Smart Home app

Manage a smart home with an app that's connected with IoT devices.

These shots are just a small part of what I've created, as the rest of it is under NDA...

Smart Home app

A mobile application to manage your IoT devices in your smart home or building. A project I've worked on for a venture of a design agency, but due to it being under NDA I can show a couple of screens: a sensor dashboard and an internal shop. This is also why I cannot enclose the name of the project, sadly.

Platform

1 mobile app (Android & iOS).

Type of project

Products (sensors) with SaaS for B2B and B2C.

Project date

2022

My role

Concepting, Researching, UX Designer, UI Designer.

Challenge

The challenge was to start from nothing, explore visual styles and come up with a first version of the app while aligning all the stakeholders and guiding the project. There were some old wireframes and visuals, that were outdated and didn't have much functionalities. This is why I started from scratch and tried to create a new style, visually. From there on, we could setup the wireframes quickly and make the visuals fast as well. Development could start working after the wireframes already.

Problem

The problem was that users that managed building and homes found it hard to gather and manage all the right information about the location. They were not able to setup sensors, which was too difficult, and how to gather info from the sensors and how to process that.

Actions

By making assumptions for a first version of the app, I came up with certain wireframes and visuals that helped the stakeholders to envision how the product would work and what it would look like. I started with creating wireframes, a visual exploration, creating visuals based on that and along the way aligning the stakeholders to guide the project.

Results

As I left when the project was still ongoing, but the app design was almost complete and ready to build upon. I know that the stakeholders were really happy with the new designs and the team was super enthusiastic to build the designs. This was also due to the good collaboration between the involved devs, the venture manager and me as the designer for this project. The direct results were solid new designs to build on and a good direction of the visual style to build a brand on (as this was still unknown and ongoing).

Tools

Figma, pen and paper

Designs

Some of the designs I've made.

Wireframes

2 wireframe screens.

Placeholder and high fidelity wireframes

Process

From wireframe to designs, during explorations. Pretty straight forward, as this is what I had in mind so not that much exploration.

From wireframe to final design

From wireframe to final design

Different version of the information dashboard

Iterations on the dark theme. Top section has 'squared' corners and the bottom section has more rounded corners

Icons

Custom icons I've made.

Custom icons

Menu

Some iterations of the menu, variating from normal to dark theme versions.

Menu iterations

Designs

The final designs.

'Squared' corner version
Rounded corner version
Dark theme version
Product shop
Light & dark theme

Comparison

The main themes bundled and shown for comparison.

A 'squared', a more rounded corner version and a dark theme version for comparison
Other projects: 

© 2023 Stephan van Dijk
All rights reserved