
SYLVANIA Smart Lighting Mobile App UI
Problem
Project goal is to create starting points for Android UI/UX and look outside the box on ways to control RGB and soft white light bulbs with an interactive color picker controller. The interactive color picker design is the key piece and the primary focus for this project.
​
Solution
The color picker design solves several problems with a new diamond shape. The user can now land on a perfect red, blue, green, or warm yellow color. The design also lends itself to have smoother interactions and chooses between colors.
​
Role
Research, Explore, Design, Define, Test, Implement, Test
​
Research and Discover
During the research phase I found hundreds of different color pickers but only tested a few and found the angular designs to be my favorite. My goal from the start was to make it easy for the user.
​
16,777,216 is the number of RGB color possibilities.


Exploration
I had several concepts but gravitated towards the triangle and diamond shapes.
​
The square color scheme below became the base of my design and the diamond is the shape that worked best for the user.

Exploration
The core colors to the right define the color controller, RGB options and a clear path of up and down for warm and cool light.




Design
A method for selecting colors to be projected from a lamp is provided. In one embodiment, the method includes pairing a lamp with a graphic user interface having a diamond shaped perimeter grid of selectable light color settings surrounding a selectable dimming setting. The diamond shaped perimeter grid including four color based segments, wherein each of the four color based segments provides a different family of colors.
Design
Defining the light controller
design and functionality.
​
Below are the two designs that had the strongest impact.





Design
The first phase of the UI explored a dark background






Design Continued
The second phase of the UI explored a white background and connected with the SYLVANIA brand. At this point we handed the project off for agency help and development.


