Satechi Home iOS App Redesign

Satechi's inaugural venture into the Smart Home domain, featuring the Satechi Dual Smart Outlet and accompanying Home App, transforms ordinary homes into intelligent, energy-efficient spaces. As the lead UI/UX designer, I was instrumental in crafting a user-centric app interface that simplifies home automation, allowing users to effortlessly manage lighting, climate, and appliances from their iOS devices. My innovative design approach not only enhanced user interaction but also provided real-time energy insights, seamlessly integrating with HomeKit-enabled devices for a connected, intuitive home experience.

Project owner
Satechi
My Role
UI/UX Design, Usability test
Scroll Down

The Challenges

• How to rebuild an accomplished smart home app with limited time and function customized features with a limited budget?

• Redesign the original app with a fresh, modern, yet recognizable app icon. Also update the UI/UX of the app to create an intuitive, easy-to-use experience.

• Build an effective energy tracking capability based on existing hardware and technology to differentiate Satechi Smart Outlet from other products and extend its market lead.

The Process

Understanding of the product.
• What is Smart Home- how do they work?

Before working on this project, I knew very little about the Internet of Things or the smart home. It was necessary to have a good understanding of the technology, how it works, target users, problems with current products, etc. to provide a solution that works towards improving the user experience.

" Understanding the problem thoroughly is essential to design successful solutions. "

The Smart Home system is one step towards the Internet of Things. All the smart devices of a brand are connected to a cloud network. There are various brands which offer their services like Nest, Amazon, LG, Samsung, etc. All of them work almost similarly.

• Competitive analysis

I tested four different homekits apps that are currently on the market. In the process, I took screenshots and documented reports, from the onboarding process to pairing devices, scene control, user support, and so on. This helps us make decisions based on knowledge of what currently works well for your users, not guesswork or intuition.

click the image to view the detailed report
Competitive Analysis ( click the image to view the detailed report )

I went through the user reviews of the existing apps to know the actual problems the people were facing. Though the apps solved the basic need of controlling devices by a smartphone/tablet, there were significant complaints regarding the user interface and interaction elements. After reading the reviews and through a discussion with the product manager, I found that we need to design an app which makes it really easy to control the smart devices. It should be a bit playful with a smooth overall user experience.

User Reviews

Research Insights.

• Since there are many smart home brands, a user can have smart devices from many different brands. However, these could not always connect or communicate with each other. The controller for a Nest thermostat will not read the instructions sent by the Alexa app. Therefore, a user has to install a number of apps for each brand of device. The plethora of smart home apps that don't work together leads to a poor user experience.

• Users want an app which makes it really easy to control the smart devices. It should be a bit playful with a smooth overall user experience.

• The energy tracking feature is a demand from users: monitoring energy consumption, it will not only cut down on energy spending but will also be able to detect any potential problems with your home appliances.

Design.
• User Flow

The Blue sections represent the main navigation of the app.

User Flow

• Wireframe

These are the initial sketches that I prepared before designing high fidelity interfaces. Paper and pen is a convenient way to put your ideas together and analyze different solutions.

Wireframe

Final Deliverables.

• Icons & Components

• Go-to-market Assets

I also work on some marketing assets for launching the APP, which includes the App Icon design, App Store preview images, How-to videos, and a quick start guide.

App icon

Results.
The Satechi App's debut on the App Store in April 2019 marked a significant milestone, further elevated by our recent update which introduced a sleek new Dark mode design and critical bug fixes. This enhancement significantly improved user experience, as reflected in the surge of positive feedback and commendations on the UI improvements in customer reviews.

Reflect.

Satechi Home was the first project where I took the lead in designing a digital product based on user requirements and constraints. During this project, I learned that while design handoff occurs at the end of the design process, it is extremely important that communication between designers and developers is established and repeated at the beginning of each design task. Designers should collaborate with developers throughout the software development process. I used InVision to create high-fidelity prototypes of interactive screens for stakeholders and developers. Handed the designs over to the development team for implementation in Zeplin. Created a style guide for the developer to use as a reference point when implementing the final product.