Hi there, happy to see a fellow dev here. I'm in fullstack engineering myself so this might be a bit of a "the blind leading the blind" situation, but here'd be my take from the FE Experience i have:
-
I'd mainly focus on simplifying the colorscheme. You have a lot of colors that may not optimally work together. I usually use https://coolors.co/ to generate a coherent colorscheme for cases like this.
-
Generally i like the areas, just the "Room" Headings with the Background don't really look great imo. I'd personally go for something a little bit more streamlined and muted, like the options i've marked on the screenshot. Basically focus on less pronounced text for the different areas and a normal text heading for the room. Of course i recognize that this might not be the most usability focused approach, so i completetly get if you opt for the colored heading for sake of instant recognition
**Specifics: **
- For the detailed light card (e.g. Office Bulbs) i'd probably go for a card that is full width and unfolds on card press or something along these lines. I think the fact that the card isn't as wide as the other cards and has the arrow next to it does make it look a little weird. I personally have it just limited to any other light card with a popup where i can make detailed adjustments on clicking the card
- The Printer Button just looks way too big and i don't love the design of the default card. I'd probably use something like this to make it fit better https://ui-lovelace-minimalist.github.io/UI/usage/cards/card_input_boolean/
Overall i opted for something completely different, where i only have the rooms with the most vital information displayed on the card, like room temperature, and a badge if something important is on that then brings me into another Tab where the controls of that room are located just for simplicity. However it totally makes sense the way you have it for faster access.
hazy crag
onyx plover
vale osprey
vagrant hatch