What's missing and what's wrong?
Audit Current Experience
This design challenge is around an app which serves as a platform for IoT Devices. To provide and communicate the simplest and most efficient way for users to interact with the app when changing applicable settings for each device.
When we look at the current experience, there's a few major flaws in the usability and current user flow:
1. Unclear information architecture
In the first screen, we can found that "Everything on / off" and "Baby Room" are obviously not in the same category of information - one is a mode controlling all appliance and devices, and one is a place.
2. Lacking of UX & Visual Indications for Default and User-Generated Settings and Modes
For the "default modes" and "customized modes", there should be a clear UX distinction and visual indications in the UI.
As well as some system settings needs more clarification. "Everything on / off" is more like a switch to control all devices, while "scheduling" is a big functionality where user can create their own modes, thus should be differentiate from both UI and UX perspective.
3. Redundant Steps & User Flow
When we think about how to design a UX flow, we think about the task customer has to finish first (JTBD). If a customer need to switch all the appliance on or off, they should be able to do that within 1 click, instead of going from screen 1~3 and check all the device details.
4. Lacking of Focus & Sparks
I researched on a series of IoT products (mostly Mobile Apps pairing and managing the hardwares), each product has the core functionalities and they are similar. However, there's a gap between an ordinary product and outstanding product - the product's focus and creative sparks that really tackles people problem outside the core functionality.
Persona & User stories
Lily is a new mom just got back to work. It's been really busy at work after the 1 yr maternity leave. She has a engineer husband who is crazy about the "smart home" idea. However, Lily is not very familiar with those cutting-edge devices. And all she cares about is whether her baby is safe and sound with the nanny, and make sure everything is on the right track for both her work and family life.
Build empathyJTBD Stories
JTBD (Job-To-Be-Done) can help us to clarify the situation, motivation and the expected outcome of the customer.
I created 3 JTBD stories for Lily to build empathy can provide them with the product can fulfill their needs.
Solve people problem
Based on the persona - Lily. I decided to create a light-weighted mobile app with minimalism & modern aesthetic to help non tech-savvy audience to manage and use the smart devices at home.
1. Categorize Devices Better
Categorize the appliance and devices based on rooms and places in user's home. Using different rooms in user's home as the unit to categorize the information for all smart devices.
2. Pin the frequently-use appliance
How to find some appliance user need to check very often within 5 clicks? Pin them and save as a list, so they don't have to diving into different rooms to find it or forgot what it was named.
3. Customize your own modes
Not limited to switching all the appliance on / off, you can customize which are the appliance you want to control, like setting a " If / Then"condition.
How it Works > How it Looks
User Flow & Product Structure
Mapping out the product structure and user flows based on the overarching goal and the aim to solve "people problem" for Lily. I used swim lane User Flows to understand and make it clear for both the user and the system.
#1: Add a Device
Add a device in a room, in your own home.
#2: Pin a Device or Mode
Help you quickly find the device or mode you use frequently.
#3: Set a Schedule, or Customize Modes
Schedule the way you want your smart devices to work, and can always customize different modes you want!
Rapid prototypying & IteratingHand Sketches
Before diving into the digital design, I sketched out the interface to iterate the product idea quickly and easily. This is the version after a few brainstorming iterations.
CRAFT THE EXPERIENCESketchs & Wireframes
Low-fidelity prototype and wireframes.
clean, minmum, elegant
see how it works
Final High-fidelity Design & Interactive Prototype
keep everything organized
Build Your Smart Home from Your Own Home
Lily might not know what are the all smart devices exactly her husband bought over the last 3 year. But she definitely a pro for her own house! Instead of pairing your 3 smart curtains at home and name them "Curtain 1, 2, 3", dive into the room and see what's out there!
Too many devices? We Got your back!
Pin Your Frequently-Use Appliance
Has 3 smart TVs in different rooms at home? Don't remember which rooms has security camera? Pin the appliance you want to check frequently, and find them in the mobile app only within few clicks!
Make it your way
Customize Different Modes
Want to switch everything off except the outdoor light and security camera? Want to open the curtain 8am so you can wake up naturally? Move your fingers and you can do it on the app!
Beyond this design challenge
Reflections & Limitations
The design challenge is a 6-hr crash project, so the persona here is an assumption without solid user research and insights from real-life experience. If there’s more time, I feel it’s really necessary to conduct User Research and see what the current pain point for people when they’re using some of the IoT / Smart home products in the market, like Samsung smart things, LG smart home, and Amazon Alexa, etc.
This redesign focus on the setting and managing all the devices. As mentioned before in this case study, my goal is to design a Light-Weighted product in the scope of this design challenge. However, there's so much more essential features we can extend to optimize the experience, like Onboarding, Connecting and Pairing Hardware, User Profile, etc.
I believe the value of Product and UX design lies in the Prototype - Test - Iterate learning cycle, and hope to extend the project beyond visual design in this perspective, to bring real value for customers.
Thanks for reading!