An iPhone lock screen with two SMART notifications, a camera alert and a weekly energy report, the phone lying between two metal frames on a grey surface

SMART Living Solution

A smart home I helped build in 2020, then redesigned on my own once I knew what had gone wrong.

Role
Flows and prototype, then the redesign
Team
Three of us in 2020. The redesign was mine alone
When
2020. Redesign 2024 to 2025
Tools
Raspberry Pi and Adobe XD, then Figma
01

Overview

The problem

In 2020 my team built a smart home that worked, and nothing crashed. But the first person outside the three of us who tried it, a friend in the lab, couldn’t work out how to turn a light on.

What I did

In 2020 I made the flows and the prototype, and a teammate wrote the code. In 2024, after I’d moved into UX, I redesigned the interface on my own, starting from everything that had gone wrong.

What changed

Everything the Raspberry Pi did out of sight now has a place on the screen, from the 7am scene to whether a light is on. It’s a concept, and it was never built back onto the hardware.

02

Process

  1. 01

    Build

    2020

    A smart home in a university lab, team of three. I made the flows and the prototype. A teammate wrote the code and ran the demo.

  2. 02

    Lab test

    2020

    A friend in the lab tried the app and got stuck on the lights.

  3. 03

    Scope

    Five personas, and an app map of what the redesign had to cover.

  4. 04

    Redesign

    2024 to 2025

    The interface on my own, in Figma: rooms, devices, scenes, family sharing, camera, voice, alerts and energy.

03

Understand

In 2020 my team built a smart home in a university lab. The housing was cardboard. Inside it were a Raspberry Pi, a camera that recorded and detected motion, sensors for movement, temperature and humidity, a motor that opened and closed the curtains, and two sets of lights. It measured power consumption and showed the figure on a phone. It sent you an alert when the camera saw movement while you were out.

It worked. Nothing crashed, nothing failed, and we were pleased with it.

We had wanted nine devices. Component problems cut it to four. An air conditioner, a television, an audio system, a door lock, a water heater and a set of windows all stayed in the interface long after they stopped being real.

What we built in 2020

Cardboard housing, university lab, team of three. Nine devices planned, four built.

Sensors

Temperature
Humidity
Motion
CameraRecorded and detected
Power meterBuilt by a teammate
Raspberry PiLogic fixed in code

Outputs

Main lights
Lights
Curtain motor
Phone appAlerts and power readout

The one automation

At 7am the curtains opened and the lights came on.

The 2020 material

Lab bench, 2020. A teammate at a laptop running the demo, the cardboard housing and its cabling on the desk behind him
Phone photo of a desktop monitor in the lab showing the room list of the 2020 working file, the word Run! burnt into the frame
Phone photo of the working design file on a laptop, artboards for login, room list and the room screens laid out together, the word Loading burnt into the frame

The only images from 2020 are a phone photo of the working design file and a six-second video someone posted to Instagram. The white text is the story’s, not the interface’s: Run! on the monitor, Loading on the laptop. The interface in them is a work in progress, and the finished screens are gone. The blurred cardboard shape on the desk is the housing, unfinished. I haven’t cleaned any of it up.

What we couldn’t do

The first person outside the team couldn’t use it

We asked a friend in the lab to try. He opened the app, found the room, and stopped. He couldn’t work out how to turn a light on.

Looking at the screens now, I’m not surprised. Every device carried the same word. Main Lights said OPEN. Curtains said OPEN. Door Lock said OPEN. Beside each one sat an identical toggle, and nothing on the screen said what state anything was in. OPEN was either what the light was doing or what tapping would do, and there was no way to tell which.

I can see how it happened. We had curtains, windows and a door lock, and for those three OPEN is the right verb. Then the word got applied to the lights, the heater and everything else, because it was already there.

The 2020 bedroom screen annotated: Curtains OPEN, correct, and so are Windows and Door Lock; Television OPEN, a television doesn’t open; Chandelier OPEN, neither does a chandelier. Three devices in the room genuinely open, the rest inherited the word, and no tile shows what state anything is in

Adding a device meant writing code

There was no path for it in the interface at all.

The one automation we had was invisible

At seven in the morning the curtains opened and the lights came on. It ran every day. It lived in the Raspberry Pi, and nobody outside the three of us knew it existed, let alone how to change it.

Six years later I asked my teammate how it was triggered, and neither of us can reconstruct it. If the people who wrote it can’t recall how it worked, the person living in the house never stood a chance. That’s the argument for putting automations on the screen, and I didn’t need to make it, because the project made it for me.

Voice control was tried and dropped

It was too buggy to demonstrate, so we dropped it and didn’t mention it again.

04

Define

The hardware worked. What it was doing, and how to change it, never reached the screen.

So the redesign follows one rule: anything the house does, the person living there can see on the screen and change.

I wrote five personas, each wanting a smart home for a different reason. They’re assumptions, based on 16 people I asked at random, and between them they set what the redesign had to cover.

Five personas

PersonaWantsWhere it lives in the redesign
Alex, 30, software engineerAdvanced automation, and strong data privacyScenes, a schedule on every device, two-factor sign-in
Thanh, 20, stay-at-home parentHer children’s safety, and routines for each family memberFamily sharing with permissions for each device, and safety alerts
Hoang, 32, marketing managerControl of the home from work, with notifications and voiceLive camera, unlocking the door, voice commands
Shinjuku, 40, ITClear icons, voice and a simple setup, and to know how his data is usedAdding a device in a few guided steps, and voice
Lam, 25, freelancerLower energy use and bills, with proof the app helpsEnergy management, with use over time

Two ways to automate, on purpose

Scenes group devices. Each device also keeps its own schedule, manual or automatic. The duplication is deliberate: if someone wants the bedroom light off at midnight, they should be able to say so on the light itself instead of building a scene to hold one instruction. Grouping is what scenes are for. They shouldn’t be a gate you pass through to reach a single device.

05

Design

Every part of the new interface answers something from that list.

  1. OnboardingThree intro cards
  2. Sign up or sign inEmail, Google, Facebook or Apple. Password or Face ID
  3. Home managementSwitch homes. Unlock the main door with a PIN or Face ID

Dashboard

  • Weather and indoor climate
  • Rooms, each with camera, energy, scenes and devices
  • All devices
  • Add a room, a device or a scene

Family

  • Shared rooms
  • Members as owner, family or guest
  • Permissions for each device
  • Invite by email

Camera

  • Every camera, room by room
  • Live view and event history
  • Record, capture and speak
  • Camera settings

Settings

  • Profile
  • Notifications
  • Voice assistant
  • Energy management
  • Two-factor authentication
  • Language, updates, FAQ and support
Voice has its own button in the middle of the tab bar, and alerts arrive on the lock screen. Mapped from the redesign’s flow chart and screens.

Scenes

Morning scene and night scene are named, selectable things, with an add button beside them. The behaviour is the one that ran in 2020. The difference is that a person living in the house can see it, choose it and make another one.

Adding a device

Add devices sits right next to the devices it adds to. You scan the code on the device or connect by NFC, choose a room, give it a name, and it’s in.

Living room screen with a live camera showing temperature, humidity and air quality, today’s energy use, Morning and Night scenes with Add scenes, four devices with Add devices, and Turn all devices off
A room: camera, energy, scenes and devices in one place.
Add device sheet over the living room, offering to scan the code on the device or to connect by holding the phone near it
Two ways in: scan the code, or connect by NFC.
The camera view scanning the code printed on a light bulb, with an Add button under it
Scanning the code on a light bulb.

Making a scene

A new scene takes three steps, each a sheet over the room: name it, pick its devices, done. The Day scene here has two lamps and the speaker.

Add scene sheet over the living room, with Day typed as the scene name and a Next button
Name it: Day.
Add Device to Day sheet listing Smart Lamp, Smart TV, Speaker, Smart Lamp 2 and Smart Lamp 3, with Smart Lamp, Speaker and Smart Lamp 3 selected, and a Next button
Pick its devices: two lamps and the speaker.
Confirmation sheet reading Scene Day added, with a Done button, over the living room’s scenes and devices
Scene added.

Device state

The control for a light reads Turn off while it’s on, so the label names the action and the state follows from it. The 2020 screen used OPEN for every device, and nothing said whether that word was the state or the action. The air conditioner gets its own controls, with a mode and a target temperature, because a thermostat and a switch are different objects.

Removing a device

Remove device sits in each device’s own menu, and afterwards the app confirms the device is gone. In 2020, removing a device meant editing the code.

Light 1 sheet with a colour grid, a brightness slider, a schedule setting and a Turn off button at the bottom
A light: colour, brightness, schedule and Turn off.
Air conditioner sheet with Cool, Heat, Wind and Auto modes, a target temperature of 20 degrees, fan, eco and swing switches, a daily schedule and Turn off
The air conditioner has its own controls.
Light 1 sheet with its menu open on a single orange Remove device button
Remove device, from the light’s own menu.

The TV and the speaker

The TV and the speaker get their own controls: four modes (Music, Gaming, Movie, Classic), a volume slider and who’s connected. The speaker adds an equalizer. Each sheet still ends in Turn off, like the light’s.

Smart TV sheet over the living room with its energy use, casting from Keith.Ngo, Music, Gaming, Movie and Classic modes with Music selected, a volume slider and Turn off
The TV: mode, volume and who’s casting.
Speaker sheet with its energy use, connected to Keith.Ngo, the same four modes with Music selected, an Equalizer row, a volume slider and Turn off
The speaker adds an equalizer.

Voice

Voice runs through the whole app this time, with its own button in the middle of the tab bar and a wake phrase in settings. The engineering that made it too buggy in 2020 is still unsolved. What’s here is the part a person would see and say.

Alerts

The camera alert already worked in 2020. In the redesign an alert comes with its next step, like Lock the door when the door has been left open.

Energy

In 2020 power consumption was a number on a phone, built by a teammate, and it told you the figure and nothing else. Now it shows use over time and compares each month with the last.

Voice assistant screen reading Hello. How can I help?, with a glowing microphone button at the bottom
Voice, waiting for a command.
Door open alert on the lock screen asking whether the door was left unlocked, with Lock the door as the main action and Skip under it
An alert with its next step.
Energy management screen with monthly use as a line chart, average use down 10 percent, and last month’s use beside a projection for next month
Energy use, month by month.
06

Outcome

Every item on the 2020 list has an answer on the screen. None of it was built back onto the hardware.

What’s still unsolved

The redesign is an interface for a system that no longer exists, made by someone who now knows what he was looking at the first time.

The curtain motor never made it into the redesign either. It worked in 2020, and I left it out five years later without noticing, which is the same kind of mistake as the one this case study is about.

The redesign hasn’t been tested either. Nobody has sat down with it and tried to turn on a light, which is exactly the test the 2020 version failed.

The redesign as a clickable Figma prototype.