Smart Home Dashboard

I have a lot of smart home devices across multiple ecosystems. Hue bulbs in every room, smart locks, a Nest thermostat, motorized blinds, Sonos speakers, an automated air quality sensor hooked into a ventilation system, and a few Echos scattered around. The problem is none of it works well together. Even platforms designed to be unified smart home hubs are built too generally to handle this kind of setup well. Everything ends up too buried. Too many taps. Too separate.

So I built a bespoke dashboard for our home. A wall-mounted portrait tablet in the living room serves as the primary always-on hub, and a smaller landscape tablet wall-mounted in the kitchen acts as a secondary panel for quick control while cooking. The original plan was a single Echo Hub on the living room wall, but its locked-down OS made always-on kiosk mode impossible. The hardware limitation pushed the project from one device to two, and from one screen to a system designed for two different contexts in the home.

The design had to handle dozens of controllable objects across multiple rooms and ecosystems, serving everyone from guests who just want to turn on the lights to me adjusting individual devices by room. I landed on a tiered approach to progressive disclosure.

That three-tier structure is the same on both devices. How it's presented is not. The two devices serve very different contexts. The wall tablet in the living room is viewed from across the room, used for both control and ambient display, and lives at glance distance most of the day. The kitchen tablet is used standing up, often briefly, often with messy hands. The Echo Hub that ended up in the kitchen couldn't run as an always-on hub the way the wall tablet does, but as an on-demand panel you wake when you need it, the limitation matches the use case. The kitchen isn't a room you sit in passively, so a screen that lights up when you reach for it and goes dark when you don't is the right behavior for that surface anyway.

The two versions share the same vocabulary. Room rows, scene pills, dimmer pattern, color palette, control patterns, and bottom navigation are identical across both. Someone moving from the kitchen to the living room never has to relearn anything. Every component had to be designed in a way that worked at both densities and orientations, which meant rejecting designs that depended on having lots of horizontal space, and rejecting designs that depended on having lots of vertical space.

The contextual control panel is the clearest example. In landscape, it sits on the right edge of the screen and lays out vertically. In portrait, that vertical column wouldn't have worked, so the same panel had to be reauthored to sit at the top of the screen and lay out horizontally. The components inside the panel look different. The interaction model, tap a device and the panel populates with controls, multi-select multiple devices and the panel shifts to grouped controls, is identical. The discipline was making sure that the visual reauthoring didn't bleed into the interaction model.

The portrait version added top-level cards for weather, calendar, and media. I redesigned each of them from scratch. The existing options I'd used over the years had each gotten close to what I wanted but never all the way. I took the pieces I liked from various versions, added my own changes, and built what I thought was the best version of each for this use case.

The weather widget pulled together the things I liked from various weather apps I'd used. Most weather widgets put the current temperature front and center and bury the parts I actually check the weather for, the trend across the day and when it's going to rain. I shrunk the current conditions to a small footprint at the top and gave the expanded forecast and an inline precipitation strip the real estate. Nothing revolutionary, just the version that answers my actual questions first.

The media widget was about finding a middle ground that doesn't really exist elsewhere. Third-party Spotify clients tend to feel too thin because they can't reach into the deeper parts of Spotify's data, so you lose access to artist pages, common playlists like "This Is [Artist]," and most of the browse and dive-deeper interactions. First-party Spotify gives you all of that but pulls you into discovery feeds, podcasts, and product surfaces that don't belong on a wall tablet. I wanted a mixed list of artists, tracks, albums, and playlists with full dive-in capability for each, and nothing else. It's most of the depth of the real Spotify app and none of the noise.

Multi-select started life as a secondary mode. The standard pattern, the one nearly every interface uses, is single selection by default with a switch into multi-select when needed. I'd designed it that way out of habit. It worked fine for lights, where most actions target one device at a time and the multi-select mode handled the occasional grouped action.

Then I added blinds, and the pattern felt wrong. With blinds, the most common action is adjusting several at once. Picking a single blind to control on its own is the secondary case, not the primary one. Having to enter a separate mode to do the common thing, and tap once for the rare thing, was backwards. I flipped the default for blinds, and the redesign was immediately better. Multi-select as the standard, single-device control as a secondary tap.

What I didn't expect was that the inverted pattern was actually better in the other contexts too. Once it existed, I tried it in the room screens and the floorplan and it was faster and more discoverable in both, even for use cases where I'd assumed single-select was clearly primary. The original pattern wasn't a design decision. It was inertia from how every other interface works. The new pattern got propagated back across the system, and the inconsistency between blinds and everything else became consistency around the better default.

A persistent tab bar ties it all together. Home, rooms, automations, and floorplan sit together on the left as the primary navigation, with a right-justified media button that slides up a playback drawer from any screen. The automations page itself is deliberately simple, just a grouped list of existing automations you can toggle on or off.

Because this sits on a wall in our living room, the visual design had to belong there. The room has a mid-century feel with specific colors and materials, and I didn't want the dashboard to look like a piece of tech that got bolted to the wall. I designed the interface to blend in, matching the warmth and palette of the room so it fades into the background when you're not using it. It also swaps between a light and dark mode based on time of day and the current lighting in the room, so it never clashes with the ambient mood of the space.

The whole thing also has an ambient mode. When nobody's actively using it, the tablet cycles between a digital photo frame with a clock and a weather and calendar widget view, so the screen earns its place on the wall even when you're not touching it.