Smarthome for everyone
Smarthome gadgets are like this thing you didn't know you needed until you visited someone who has it. And even then, the first question is: "How complicated is it to setup?"
Back in 2012, our client entered the smarthome business with no success. People didn't get how to use the product.
In 2014, we had the ambitious goal of creating a smarthome system for everyone. Hastle free, plug and play, no hickups.
What I did
I was responsible for the mental model of the app and the execution of the interaction design.
Phase 1: Immersion
The initial step in the project was to understand the client's current solution, their technical capabilities, the feedback of their existing users and their business requirements. Once requirements were clear, I put together the first draft of the information architecture diagram to capture the scope of features and requirements. The IA was refined and improved throughout the project. Below is the final version.
Phase 2: Concept & detail design
We identified the main key flows that the users would be interested in. I started wireframing the flows to get a comprehensive view of the mental and interaction model that would be most suitable. The interaction model I settled on tailored towards flexible entry points throughout the platform. This enabled the user to find elements and sections related to each other in an easy and intuitive way. The mental model was one where all devices are tokens within a certain smarthome category: Lighting, Climate, Security, Shutters, Entertainment etc. Every token can be read or activated individually, or combined with different tokens to form a scenario.
In the flow below, the user creates a complex scenario from scratch. A scenario is when a user selects a set of triggers and conditions to automate an action. In the edge case below, when the switch is on or when motion is detected and the brightness is below 20% and it's between 00:00 and 08:00 the garden light turns on for 30 seconds.
Multiple common-use scenarios would be proposed by the system to kickstart the user's progress. This is an example illustrating the flexibility of the system to suit the needs of advanced users, which was one of the business requirements.
We put together a Design Language System to accelerate the production process. Once the basic flows were wireframed, I improved upon them and polished them using the elements from the DLS.
The flow below showcases how a user can manage their rooms within their smarthome.
1. The user's view when no devices have been added to any rooms.
2. The user sees the number of devices in each room.
3. The user adds a new room.
4. The user edits the name of an existing room.
Adding devices to the system is one of the user's most feared tasks. The image below demonstrates three access points the user can add a device from.
1: When the user's done installing their central unit they can start installing their devices immediately. In the instance where the user purchased a product bundle, the system recognises the list of devices the user has. Step by step instructions guide the user through a smooth flow.
7 & 11: The user can also add a device from the devices page or from the home page by selecting the plus button.
The system was designed to work well with third party devices and integrate most of them. In this case, the user can control the hue, color and intensity of a Philips Hue light bulb and turn it on or off. The user can also access the scenarios that the device is integrated in or view more details about the product at the bottom of the page.
The team put together a clickable prototype that the client user-tested before starting development. The smarthome system (software and hardware) was developed in 2017 and is now available on the market for purchasing.
The project's duration was 10 weeks.
Do not hesitate to get in touch for more details.
Thanks for reading!