Skip to content
Sean Mooney edited this page Oct 2, 2019 · 1 revision

There is a desire to improve Scene support during Hacktoberfest 2019, and here are some of my initial ideas on how the overall user experience could work.


Scenes Panel - Overview

Under Configuration would be a brand new "Scenes" panel that would allow activating scenes, managing existing scenes, and saving new scenes. Here are a couple initial mockups in several variants.

This first one has the icons of entities used in the scene underneath. When hovering over the icons it would have "enhanced" tooltips that display the brightness percent, color, etc. This has potential scalability issues though - imagine if the user has dozens of lights in a scene.

entity-icons

This second one has a more basic icon style, and gets rid of the icons in favor of a user-provided description of exactly what the scene does.

descriptions

This last one shows the colors of each light. The idea being that you could just quickly scan the page looking for a certain color. If you're looking for the Halloween scene, it'll be orange. Xmas lighting scene would be green and red etc. I'm not really sure about this one though.

The other thing it has is an icon / entity picture. When support for uploading images gets added, it would be nice to implement that here as well. Sports fans often create "game day" scenes using their team colors, and now they would be able to use the team logo as their scene icon too.

expanded-with-colors-picture

Creating Scenes

This page would have a floating action button to add a new scene using the current state of your lights. One of the nice benefits of this approach is that you could use any other application to adjust your lights, like say Philips Hue, and then save.

There would be a floating action button. When pressing it the user would get a view like this:

Saving Scenes

The view for saving could have a big option at the top “Save Current Light Settings (All Lights)” and then a smaller ‘or select which lights to use’ option underneath that would give the user more granular control. When selecting that ‘pick and choose’ option it could basically display things exactly like an Entities card, where the user could adjust the state of their lights and/or quickly toggle things off, only difference s there would be a SAVE button underneath?

One killer use case of this approach is that now the user can change their lights/scenes from anywhere, such as the Philips Hue app for example, and then easily get that added into Home Assistant. This allows an extremely easy migration path when a user is coming from other platforms.

If the user already has a bunch of existing scenes in the Philips Hue app, they can simply tap "Arctic Aurora" or "Savanna Sunset" and once Hue sets that then add them to Home Assistant.

Importing Scenes

For integrations where it's possible to retrieve this data, it would be helpful to display the users existing scenes and offer to import them as part of the configflow setup process. This would allow the user to effortlessly migrate everything over to Home Assistant.

import-scenes-configflow

This could also be displayed as a message "banner" at the top of the Scenes panel. Clicking on it would bring up this same UI.

Default Scenes

There could be a handful of default "stub" scenes that would give the user an idea of scenes to create. These would have unique icons too.

Scene Icon
Morning mdi:weather-sunny
Goodnight mdi:sleep
Arrived Home mdi:home
Left Home mdi:exit-run
Movie Mode mdi:theater
Party Time mdi:party-popper

Scenes Panel - Detail

TBD.

More Info Dialog

As most people are going to be adjusting the brightness and color of their lights from a more-info dialog, it would make sense to be able to save scenes from there as well.

The more-info for Lights could maybe have a tabbed interface. First tab would be exactly as it is now, second tab would be “Scenes” where it would display your existing scenes and have a + button to add more. Layout wise, I think something very much like Google Chrome’s New Tab view would work. Or to use a HA analogy, a similar style to Lovelace badges or the Glance card. Basically icon-based with the scene name underneath, tapping the icon would activate that scene. Simple.

Two options. One a tab, one a collapsed list that pops up... Not sure which one better? Experiment.

Badges

It would be pretty cool to have scenes as badges where it'd activate the scene without having to go to more-info. I don't use any badges on my setup but for this I probably would. Need to think of a way to differentiate scene badges from other "regular" badges.

Other

Show in sidebar???