In a similar vein to the system page ideas topic, I’m getting to the point where I’m happy with the layout and formatting of all my pages - except for default page floorplan(s). See: https://imgur.com/a/ejMbhBO (has a few day/night examples as well).
Looking for inspiration to tart it up a bit. Or maybe replace the floorplans altogether (especially as they do not scale well to mobile devices). Maybe just some commonly used tiles? IDK.
don’t want to hijack your post (and looking forward to the answers you will get) but I indeed like your pages, specifically the climate and devices (night) buttons.
Do you by any chance have these on a GitHub page so I can have a look at the code (setting up my Lovelace interface myself…)
my default page is somewhat more cartoonesk I am afraid, but fully device-size aware:
My default is semi-dynamic. It shows the things I want to know about. That means it only shows lights that are on, exterior doors/windows that are open, and so on. The only things that stay there are one card showing where everybody is, and the weather forecast.
The exception are some of the temperature/light/humidity sensors, but I’ll shortly be tweaking those so they only show if a room is occupied.
I’m leaning towards that idea Tinkerer. I started an ‘insights’ page but have not paid it much attention lately. Adding a few static cards could make it quite a useful default page:
thanks for that! a lot of inspirational ideas!
How do you get all cards to have the rounded corners, is that in your theme, or a master modder somewhere?
It was that that made me think you were using Buttons, because setting border-radius: 6px is a breeze there. Ive added that to the card-modder settings per card, but don’t see you doing that anywhere in the config?
Had me turn my head inside out because of the order of your config, especially with the nested horizontal_stacks/card_modder/vertical-stack-in-card…
please let me ask why you use that order (all cards declared upside down), and not like below, which at least to me seems so much more understandable at first sight, and way easier to debug and edit (check Weather Now):
Here is mine. I used floorplans for a while, but found them ultimately no that useful, especially when using the UI on mobile devices, which in my case tends to be the only time I actually use the interface!
When using storage mode HA (used to?) sort all Lovelace key: value pairs alphabetically. I got used to seeing it that way. I still use storage mode even though I construct more complex cards in an external editor and then paste into Lovelace manual cards.
Taking inspiration from what has been posted so far I’m working on a default page that shows my most used items and making it mobile compatible.
This works really well on my mobile, 1080p tablet and 1920x1200 on my pc. I can see or interact with all the most common items I use.
I had to revert to flat bordered buttons though. The tiles-card I’m using does not support different values for shadow for on and off states. This coupled with the fact that the card looks abandoned means I should probably change everything over to the custom button-card.
I also might change the glance icons to mini graphs like at the top of the weather card. That needs some forecast info too. Back to work for now though.
nice! be aware though that the full templating possibilities the Tiles card offers isn’t yet as developed in the Button-card. I would move to the Button-card fast, but if you need full templating keep those in Tiles config. Button-card has templates too, but not on all fields, and not always full JS.
I have made the move for most of my Tiles now and the Buttons work swift and look beautiful. Most importantly though, as you say, is the full support on the Button card by @romrider , who is adding functionality by the week!
The only controls visible on the ‘front page’ are ‘what I need to know’ plus a control’s visibility is based on ‘situational awareness’. The only downside to this approach is that it doesn’t win any beauty contests because there’s so little to show …
For people unfamiliar with this approach, imagine you are seated in the Apollo command module facing its complex console filled with switches and indicators. All of the controls are demanding your attention but, in reality, only some of them truly require your attention. Others can be safely ignored until they change state.
If you could make these non-critical ‘others’ temporarily disappear, your visual workload would be reduced so you can focus exclusively on what truly requires your attention. You can’t easily achieve this with mechanical controls but you can with the ‘soft-controls’ rendered in a GUI.
For example, when all doors and windows and locks are secured, my front page shows controls for:
arming the security panel
unlocking the door lock
opening the garage door
If you unlock the lock or open a door, the control for arming the security panel disappears. Until that lock and door are secured, there’s no point in operating the security panel.
If you open a door, the UI displays it, otherwise when closed there’s nothing shown in the UI about that door’s status. I’m only interested in it when it’s open.
I have one door with a controllable lock. If you open that door, its new status is displayed in the UI and the control for operating its lock disappears. Why? Because it makes no sense to lock an open door.
There are badges summarizing how many:
lights are on
doors are open
appliances are on
Ideally, I would prefer to have conditional badges. If zero lights are on then the ‘All Lights’ badge would disappear. Maybe there’s a way to do this but I don’t know how.
Current design (alert wifi level lowered for demonstration purposes only). That is one massive stack of conditional cards that monitor just about everything important.
I use the default_view mainly as an overview or navigational panel for mobile viewing. I’m going to explore rounded corners and I need to get actual photos of our spaces/rooms (these are stock photos)
Just found this thread, (Tom) will probably hate me lol
I been struggling to figure out how to design my dashboards and even trying to figure out whats useful for the default page
I use only the mobile as of now.
my thinking was to display the main components of the house i like to monitor and use Pop up to see more. So if you clicked on one of the chips it would pop and display more info or buttons.