This was the third product I worked on at TP-LINK Research America. I designed Smart Bulb’s interface and interaction flow for accommodating this new device to KASA App. Users can control their bulbs based on its hardware capability, such as brightness, temperature, and color. In the beginning of the project, I did research on similar products in the market and finalized what directions we would like to go. Based on the findings, I also initiated the design of individual light setting – presets for users to facilitate their use.
The project lasted three months for design. Now We keep improving the performance and quality based on our BETA program. Before the time for product launch, I kept supporting changes and needed assets for future release.
OVERVIEW
The electric light is one of the everyday conveniences that most affects our lives. Before I started the project, I first asked myself if I had a smart light, what I would like to do for it. The following is the questions I am seeking answers myself and would like to find from targeted users.
BEFORE START
Lifx and Philips Hue are two of the most popular smart bulbs in the market. Both of them have great color and brightness control, but they show different interactions and concepts for users to control their devices.
Lifx has simple and interactive interface to allow users to control lights individually. The company uses color wheel design to specify White Light and Color concepts.
Philips Hue allows users to view the big picture of the lights they can select and they can change each color’s brightness individually.
INITIAL DESIGN
Based on the findings from competitor research, I started thinking of some ideas to show our interface. We like to give users a quick understanding for their lights. In addition, I would like to separate White light and Color light. Based on my research, people normally adjust white light for their daily use and apply colors for specific scenarios, such as party time.
Although Lifx has great interaction, it doesn’t let users know what the real color the bulb shows on the interface if they adjust control panel. Also, saturation and brightness is combined on their control panel, and users might not be aware of it. Actually, 50% is the richest color. If users adjust above 50%, colors will have white added. We want to give users a clear idea what the real bulb will look like when they adjust the color.
On the contrary, Philips Hue is not salient for users to control individual light. The idea is great that people can control different bulbs at the same time. However, if users have too many lights, they need to recall number which associates with their real light.
During initial design stage, our team decided to go for version 2 since it is not complicated for users to think of saturation value. Also, it allows users to have an overview about the light color they can adjust.
IDEATION
Based on the initial Product Requirements Document (PRD) I first got from product director, users will mainly control multiple light bulbs with saved settings by using our “SCENE” function. If they go to individual device page, they can only adjust color or brightness but have no way to save the individual light setting and quickly apply it later. Since I believe users will have several favorite light settings for individual bulb, I proposed new feature – Preset – to our product team for discussion.
Normally, people will have several light settings they like the most. Preset is a great function for them to save their frequent use settings and apply later.
For certain scenarios, such as for reading, it’s better to use higher temperature (The better value is around 5500k based on research). Users might want to quickly apply this specific setting without affecting other bulbs.
This individual light setting is convenient when users setup “Scene” – our group control feature. Since the action for users to control light is not only turn ON or turn OFF, if they have saved preset, they can easily choose the one they saved before. It is also helpful for users to setup several light bulbs for a scene at a time.
FURTHER ITERATION
After several meetings, we kind of agree that Preset is very important to users. To make this function more valuable to users, we then start thinking of other key points might affect user behavior and device capability.
Then, we also finalized four default preset settings based on our different levels of bulbs. Users can use those settings right away or customize based on their real use case.
INTERNAL FEEDBACK
Where to put Preset is kind of a hard topic to us. As mentioned before, users should quickly apply the preset on our Homepage rather than go to each light bulb page to apply the saved setting. It’s kind of obvious, so we enlarge the each Smart Bulb row to accommodate the new feature. However, based on internal testings, people have troubles when interacting with the feature. There are too many buttons on the page, and it made them feel annoying and crowded. Also, some people mentioned this interface made them feel inconsistent with the one for smart plug on the device list.
Since consistency is important to us, we decided to make the row as similar as others. That means we won’t extend the row height to accommodate presets. However, we still want to allow users to quickly apply preset on home page. Thus, we made a button for users to click and show the function for each bulb. Where to put the button is another challenge and how to show users the preset list is another difficulty we were facing.
We wire-framed new solutions to balance consistency and feature discoverability
CURRENT RELEASE
The following are final version of Smart Bulb’s wireframe and user interface. It highlights how users see the Smart bulb category on device list and how they interact with the device on the specific device control page.
MILESTONE
TP-LINK’s Smart Bulb is expected to launch in the summer, 2016. We have four different models with different level of brightness and light appearance. The premium one, LB130, can adjust its color for both RGB and White light. At the same time, we will also announce “Scene”, the group control feature for all TP-LINK’s Smart Plugs, Smart Switch, and Smart Bulb.
TAKEAWAYS
Explore what user might expect
When I go deep into the design, I might find out more particular needs which are not discovered at first. Exploring those needs and having discussion with product owner is kind of important to reflect the value to users.