The smart-home dashboard drawn like a house that the whole family uses

A hand-drawn floor plan, animated device controls and a television display turned an ignored Home Assistant interface into a shared household control centre.

A Home Assistant dashboard is usually judged on utility alone. One homeowner took a different route: he turned his smart home into a hand-drawn floor plan, then made that illustration the interface the whole family actually wanted to use. The result combines a fireplace, garden lighting, air conditioning and room-by-room controls in a single visual model of the house, with the same layout used across mobile devices, computers and a television screen.

The idea grew out of a practical problem. Some functions in the home, such as garden lighting and irrigation, were already automated. Others still needed occasional manual control, especially when timing mattered. In the case of the garden lights, the system included a timer that switched them off automatically after a set period and started flashing as a warning before shutdown. The aim was to prompt someone to extend the timer in time, but the existing app-based controls were not popular with the rest of the household.

Rather than add yet another physical switch, the owner decided to redesign the interface itself. The most appealing concept was a floor plan that matched the actual house, because it allowed devices to sit exactly where they were located in real life. Three-dimensional dashboard examples were considered, as were pixel-art designs, but neither approach quite fit. A custom illustration offered more flexibility, more visual clarity and, crucially, a better chance of making the dashboard pleasant enough that other people would choose to use it.

Finding the right artist took time. The brief needed more than a beautiful image: it had to explain how the dashboard would function, what kinds of animations would be needed and how the files would have to be delivered. The final specification called for separate daytime and night-time versions, transparent PNG assets for static elements, animated WebP files for active devices, and every item exported on the same canvas at a consistent scale. That last requirement mattered because it allowed the whole house to be assembled later without tedious manual alignment. The builder also learned that it was wiser to request WebP animations from the outset, rather than converting sprite sheets afterwards.

Once the artwork was ready, Home Assistant did most of the rest. The dashboard was built with the standard picture-elements card, which places interactive elements over a background image. Devices such as the air conditioner used state-dependent images so that a static frame appeared when inactive and an animated sequence played when running. The same technique was used for day and night views, with a helper entity and automations tied to sunset and sunrise switching between the two versions. For most devices, tapping simply opened the default Home Assistant detail view.

The irrigation system needed more work, because it consisted of several valves and timers rather than one tidy device card. For that, the owner used Browser Mod, a popular Home Assistant extension distributed through HACS, to create a custom pop-up control window. The dashboard’s image files were stored locally in Home Assistant’s www directory and served through local paths, which kept the setup simple and made the assets easy to manage.

Displaying the dashboard on a television introduced another set of constraints. Reports about LG webOS support for WebP turned out to be misleading in this case, but the television still could not be persuaded to open the dashboard reliably or present it as a proper start page. The workaround was to bypass the TV’s browser entirely and feed the Home Assistant system into the television through HDMI, using a kiosk-style display add-on so the dashboard appeared as a dedicated source. That approach also made the interface visible for hours at a time, which helped the household become familiar with it.

The finished arrangement is split into separate floor views and a combined full-house view. The shared canvas made it possible to line up the upper and lower floors precisely in the composite display, while keeping each level usable on its own. Because the visual editor could not reuse the same elements across multiple cards, the builder moved the setup into YAML and organised the floor plans into separate files that could be included wherever needed. That made maintenance easier: a change in one room updates every view at once.

In practice, the project achieved something larger than a more attractive smart-home screen. It reduced friction. Family members who had ignored the original app were willing to use the dashboard once it lived on the television and mirrored the actual house. The phone version works well for individual floors, while the full layout is best on a larger screen. Recent Home Assistant dashboard guides increasingly stress the same broader lesson: interfaces work best when they are structured around rooms, tasks and household habits, not just around the software’s default layout. This example goes a step further by showing that design, when done carefully, can make a home system feel usable to everyone in it.