Dashboards sind gefühlt eine kleine Raketenwissenschaft. Und das Interesse daran ist immer wieder groß. Suchbegriffe wie Home Assistant Dashboard erstellen haben Hochkonjunktur. Und mich wundert das nicht, denn es ist nun mal einfach der Zugang zu deinem Smart Home. Der muss passen.
In der Vergangenheit habe ich dir schon die Grundlagen von Dashboards ausführlich in einem eigenen Guide erklärt. Doch all die Grundlagen nützen nichts, ohne dass wir einen genauen Blick auf die Praxis werfen. Das will ich heute mit dir anhand von meinem Dashboard tun. So bekommst du noch mehr direkte Einblicke in das, was ich in meinem Smart Home mache.
Besonders spannend daran finde ich, dass auch für mich das Dashboard in Home Assistant der zentrale Anlaufpunkt ist. Ich nutze es auf meinem Tablet, Smartphone und sogar auf dem NSPanel Pro. Dort dann in einem eigenen Home Assistant Theme, um die Optik etwas aufzuwerten. Ich kann dir wirklich nur dazu raten, dir mal die Themes genauer anzusehen. Dort ist sicher auch etwas für dich dabei.
Inhaltsverzeichnis
Häufige Probleme bei Dashboard
Doch trotz all der Optik wird es nichts, wenn dein Dashboard aussieht wie das Windows-Startmenü aus dem Jahr 2000. Und genau hier liegt aus meiner Sicht oft der Fehler, weshalb viele auch die Motivation verlieren oder irgendwann einfach mit dem Zustand leben.
Wenn wir uns die typischen Fallstricke ansehen, dann fällt mir immer wieder auf: Die Dashboards sind überfrachtet. Und zwar maßlos.
Viele Nutzer versuchen wirklich alles irgendwie auf Biegen und Brechen in ihr Dashboard zu bekommen. Das klassische Beispiel sind auch hier wieder Lampen. Doch warum musst du wirklich jede einzelne Lampe aus deinem Dashboard heraus ansteuern können? In den meisten Fällen stellen wir die Lichter sowieso nur nach Gruppen ein und setzen nicht für jede Glühbirne die Farbe einzeln. Hier liegt also schon mal ein großes Potenzial, um die Dinge schlichter zu gestalten.
Dazu kommt dann auch noch, dass man sich sehr funktional ausrichtet. Das ist zwar grundsätzlich nicht falsch, führt aber in der Praxis häufig zu hoher Frustration. Willst du wirklich erst ein Handbuch lesen müssen, bevor du das Licht eingeschaltet bekommst? Besser ist hier eine eindeutige und klare Benennung. Die kostet zwar am Anfang mehr Zeit, wird dir aber im Nachgang jede Menge Frust ersparen. Hinzu kommt dann noch, dass auch die Familie eher geneigt ist, die Oberfläche zu verstehen. Ein nicht zu unterschätzender Faktor.
Merke: Dashboards dürfen nicht überfrachtet und müssen selbsterklärend sein.
Mein Setup im Überblick
Überfrachtet wäre übrigens nicht nur für meine kognitive Leistung nicht unbedingt hilfreich, sondern auch für die entsprechenden Bildschirme. Denn es ist immer wieder eine Herausforderung die Geräte wirklich ideal abdecken zu können.
Meist nutze ich mein Home Assistant Dashboard auf dem Smartphone. Dort ist es schnell greifbar und das Smartphone ist meist in meiner Nähe. Darüber hinaus macht es mir der Fernzugriff auf Home Assistant wirklich leicht, auch mal aus dem Büro das Zuhause zu checken. Auf dem Smartphone muss aber alles wirklich kompakt sein, denn ich will nicht ewig nach den richtigen Daten suchen.
Ebenfalls wichtig ist für mich der Zugang zum Smart Home über mein NSPanel Pro. Es hängt im Arbeitszimmer und dient als schnellen Zugang, um die wichtigsten Einstellungen zu ändern. Gerade um die Jahreszeit jetzt, geht es da bei mir häufig um Beleuchtung. Denn während ich im Homeoffice lieber weißes Licht brauche, will ich zum Abend hin eher eine gemütliche Beleuchtung. Daher kann ich vom NSPanel aus schnell die entsprechende Szene aktivieren.
Kein richtiges Dashboard, aber auch Visualisierung, ist mein Bildschirm im Arbeitszimmer. Er zeigt mir nicht nur die wichtigste Kamera am Haus, sondern auch hilfreiche Informationen zum aktuellen Zustand. Ganz klassisch sehe ich dort den Zustand der Spül- und Waschmaschine, Wallbox und meiner Alarmanlage. Natürlich ist das nicht alles, doch ich denke das sind so die wichtigsten Elemente.
Lustigerweise nutze ich die Weboberfläche von Home Assistant am PC übrigens fast nur dann, wenn ich irgendwelche Einstellungen vornehmen muss oder neue Automationen baue. Ansonsten erledige ich in der Regel alles mobil, was ich echt praktisch finde. Das war damals bei ioBroker noch wesentlich umständlicher aus meiner Sicht.
Grundprinzipien & Vorstellung
Für meine eigenen Dashboards habe ich immer einige Grundprinzipien und Vorstellungen, die ich gezielt umsetze. Das Spannende dabei ist, dass es eine Art Best Practice Guide ist, der sich über die Jahre für mich als sinnvoll erwiesen hat.
Prinzip 1: Das wohl wichtigste Grundprinzip ist, dass mein Dashboard nicht überladen sein darf. Viele Beispiele im Internet sind so vollgepackt, dass es wirklich nur schwer möglich ist, sich einen schnellen Überblick zu verschaffen. Hier arbeite ich getreu dem Motto: Weniger ist mehr.
Prinzip 2: Daran anknüpfend gilt für mich, dass alle Ansichten thematisch sortiert sein müssen. Ich will die Garagentorsteuerung wirklich nicht neben der Lampe in der Küche. Das ist weder logisch erklärbar, noch in irgendeiner Form für den Alltag praktisch. Denn ich werde wohl kaum in der Küche stehen und gleichzeitig das Garagentor bedienen müssen.
Prinzip 3: Nichts ist fix. Wenn ich im Alltag bemerke, dass ein Button an einer Stelle falsch ist oder ich immer wieder den gleichen Eintrag suche, dann ist das Dashboard noch nicht ideal aufgebaut. Und glaub mir, auch wenn ich täglich mit meinem Smart Home arbeite, manchmal suche ich wirklich noch den einen oder anderen Button.
Prinzip 4: Das Dashboard muss selbsterklärend sein. Der Aufbau und die Benennungen müssen so simpel sein, dass man ohne nachzudenken navigieren kann. Denn auch wenn es für den Moment alles logisch erscheint, in einem halben Jahr wirst du genau über die Dinge stolpern, die nicht eindeutig sind.
Darüber hinaus will ich immer, dass das Dashboard zum manuellen Eingreifen gedacht ist. Ich muss auch nicht jedes einzelne Gerät steuern können. Gerade bei der Beleuchtung reichen mir persönlich Gruppen. Dadurch kann ich die Komplexität schon enorm reduzieren. Wenn möglich, läuft aber alles im Smart Home so weit wie nur möglich vollständig automatisiert.
Prinzip 1: Nicht überladen
Wenn wir darüber sprechen, dass wir unsere Dashboards nicht überladen sollten, dann werfen wir doch gleich mal einen detaillierten Blick auf mein Dashboard. Wie ich schon gesagt habe, unterteile ich thematisch. Daher nehmen wir uns gleich mal den ausführlichsten Teil der Visualisierung vor: Das Arbeitszimmer.
Wenn du einen genauen Blick darauf wirfst, dann kannst du eine meiner klassischen Unterteilungen sehen. Links haben wir die Beleuchtung und den Drucker (der ist nur notdürftig dort), in der Mitte befinden sich dann die Kerntechniken des Arbeitszimmers sowie die Automationen und auf der rechten Seite befinden sich die Rollläden. Mobil ist das alles untereinander und genau dort taucht dann auch eine Schwierigkeit auf: Denn die Automationen sind irgendwo in der Mitte. Hier muss ich also nochmal ran.
Der Grund warum ich die Automationen im Dashboard habe ist, dass ich sie schnell pro Raum deaktivieren kann, wenn ich sie mal nicht brauche. Klassisches Beispiel: Falls mal Besuch da ist und der Rollladen nicht schließen soll.
Hier mal das vollständige YAML zur Ansicht:
type: sections
max_columns: 3
title: Arbeitszimmer
path: arbeitszimmer
icon: mdi:briefcase
sections:
- type: grid
cards:
- type: heading
heading: Beleuchtung
heading_style: title
icon: mdi:ceiling-light-outline
- alert_classes:
- occupancy
sensor_classes:
- temperature
- illuminance
type: area
area: og_arbeitszimmer
- type: light
entity: light.og_arbeitszimmer
name: Beleuchtung
grid_options:
columns: 6
rows: 4
tap_action:
action: none
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: scene.og_arbeitszimmer_lesen
name: Lesen
grid_options:
columns: 3
rows: 2
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: scene.og_arbeitszimmer_chinatown
name: Chinatown
grid_options:
columns: 3
rows: 2
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: scene.og_arbeitszimmer_goldener_stern
name: Goldener Stern
grid_options:
columns: 3
rows: 2
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: scene.og_arbeitszimmer_soho
name: Soho
grid_options:
columns: 3
rows: 2
- type: grid
cards:
- type: heading
heading: Technik
heading_style: title
icon: mdi:desktop-classic
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.bildschirm_1
show_state: true
icon_height: 40px
- show_name: true
show_icon: true
type: button
tap_action:
action: toggle
entity: switch.bildschirm_2
show_state: true
icon_height: 40px
- type: tile
entity: sensor.bildschirm_1_leistung
name: Verbrauch
- type: tile
entity: sensor.bildschirm_2_leistung
name: Verbrauch
- type: tile
entity: sensor.presence_sensor_fp2_963d_light_sensor_light_level
name: Lichtstärke
- type: media-control
entity: media_player.studio_arbeitszimmer
grid_options:
columns: 12
rows: 2
- type: grid
cards:
- type: heading
heading: Fenster & Türen
heading_style: title
icon: mdi:window-shutter
- type: tile
entity: binary_sensor.az_balkontur
name: Balkontür
- type: tile
entity: binary_sensor.az_fenster
name: Fenster
- type: tile
entity: cover.rollladenaktor_arbeitszimmer_rechts
name: Rollladen Rechts
show_entity_picture: false
vertical: true
hide_state: false
- type: tile
entity: cover.rollladenaktor_arbeitszimmer_links
name: Rollladen links
vertical: true
- type: grid
cards:
- type: heading
heading: Drucker
heading_style: title
icon: mdi:printer
- type: tile
entity: binary_sensor.samsung_c48x_series
grid_options:
columns: 12
rows: 1
- type: gauge
entity: sensor.samsung_c48x_series_toner_black
name: Toner Schwarz
needle: false
grid_options:
columns: 3
rows: auto
- type: gauge
entity: sensor.samsung_c48x_series_toner_cyan
name: Toner Cyan
grid_options:
columns: 3
rows: auto
- type: gauge
entity: sensor.samsung_c48x_series_toner_magenta
name: Toner Magenta
grid_options:
columns: 3
rows: auto
- type: gauge
entity: sensor.samsung_c48x_series_toner_yellow
name: Toner Gelb
grid_options:
columns: 3
rows: auto
- type: tile
entity: binary_sensor.samsung_c48x_series_2
grid_options:
columns: 12
rows: 1
- type: grid
cards:
- type: heading
heading: Automationen
heading_style: title
icon: mdi:home-automation
- type: tile
entity: automation.beleuchtung_arbeitszimmer
name: Beleuchtung
- type: tile
entity: automation.rollladen_arbeitszimmer_links_offnen
name: Rollladen links öffnen
- type: tile
entity: automation.rollladen_arbeitszimmer_links_schliessen
name: Rollladen links schließen
- type: tile
entity: automation.rollladen_arbeitszimmer_rechts_offnen
name: Rollladen rechts öffnen
- type: tile
entity: automation.rollladen_arbeitszimmer_rechts_schliessen
name: Rollladen rechts schließen
- type: tile
entity: automation.alarmanlage_automatisch_aktivieren
name: Alarmanlage aktivieren
- type: tile
entity: automation.alarmanlage_automatisch_umschalten
name: Alarmanlage umschalten
- type: tile
entity: automation.alarmanlage_einschalten
name: Alarm einschalten (22h)
- type: tile
entity: automation.alarmanlagenstatus_senden
name: Alarmstatus senden
badges:
- type: entity
show_name: true
show_state: true
show_icon: true
entity: binary_sensor.presence_sensor_fp2_963d_presence_sensor_1
color: ""
name: Arbeitszimmer
- type: entity
show_name: true
show_state: true
show_icon: true
entity: climate.arbeitszimmer
color: ""
name: Heizung
show_entity_picture: false
- type: entity
show_name: true
show_state: true
show_icon: true
entity: climate.arbeitszimmer_2
color: ""
name: Klimaanlage
- type: entity
show_name: true
show_state: true
show_icon: true
entity: binary_sensor.arbeitszimmer
color: ""
name: RauchmelderPrinzip 2: Thematisch sortieren
Die grundlegende thematische Sortierung konntest du schon im letzten Beispiel entnehmen. Aber das reicht noch wesentlich weiter. Denn ich will nicht, dass ich auf einmal – wie schon erwähnt – das Garagentor an einer Stelle vorfinde, wo ich es nicht erwarte und nicht brauche.
Daher habe ich mir pro Raum/Bereich in meinem Zuhause eine eigene Ansicht erstellt innerhalb des gleichen Dashboards. Das sieht dann so aus, dass ich oberhalb der Ansicht durch die verschiedenen Bereiche des Zuhauses wechseln kann.
Das erste Tab ist eine generelle Übersicht mit den wichtigsten Daten. Ich gebe zu, das ist noch nicht optimal. Der Rest ist aber weitestgehend optimiert. So siehst du zum Beispiel Reiter für das Arbeitszimmer, Badezimmer, WC, Wohnzimmer und so weiter. Ich muss also nur in den jeweiligen Bereich navigieren und habe wiederum sowohl alle steuerbaren Geräte und Automationen.
Einzig bei der Beleuchtung und anderen sinnvollen Gruppierungen zeige ich immer nur die Gruppe an. Denn ich steuere sehr selten Geräte wirklich einzeln an in diesem Fall. Und wenn ich das doch mal brauche, dann muss ich eben über die Einstellungen im Home Assistant gehen. Das ist in Ordnung, da es nur äußerst selten vorkommt.
Prinzip 3: Nichts ist fix
Gut, ich gebe zu, das ist schwer zu zeigen. Aber der Hintergrund ist recht simpel, wie ich es schon angeführt habe.
Meist erstelle ich ein Dashboard am PC. Dort kann ich ziemlich schnell durch die notwendigen Schritte navigieren und mir alles so zusammenstellen, wie ich meine es zu brauchen. Doch dann bemerke ich im Alltag (meist am Smartphone), dass ich zum Beispiel eine bestimmte Option häufiger brauche, aber dort lange scrollen muss. Genau dann werde ich aktiv und sortiere nochmal um. Denn ich richte schon sehr viel auf das Medium aus, das ich primär nutze. Und das ist einfach mal das Smartphone.
Es kann aber auch vorkommen, dass sich mein Alltag verändert und ich andere Einstellungen häufiger brauche, an die ich vielleicht zuerst nicht gedacht habe. Auch dann werde ich wieder aktiv und sortiere nochmal um. Manchmal kommt dann sogar noch ein bestimmtes Gerät hinzu und ich muss sowieso nochmal Anpassungen vornehmen.
Ich kann dir daher an dieser Stelle nur dazu raten, dich in deinem Alltag etwas zu beobachten. Wie schnell und einfach kommst du an die Stelle, wo du hin willst? Ist es umständlich? Falls ja, dann wirst du nochmal anpassen müssen.
Und wenn alles nichts hilft, dann kannst du immer noch ein mobiles Dashboard und eines für den PC bauen. Denn je nachdem, wie du auf dein Smart Home zugreifst, hast du eben auch andere Bildschirmgrößen, die entsprechend viel anzeigen können.
Früher hatte ich übrigens mal Dashboards, auf denen immer alles angezeigt wird. Und dann auch noch doppelt überall. Das war in der Praxis nix und hat mir gezeigt, dass mehr nicht unbedingt immer besser ist.
Prinzip 4: Selbsterklärend
Ich denke dieser Punkt ist mitunter einer der wichtigsten. Denn ist es dir schon mal passiert, dass du dich gefragt hast, was ein bestimmter Button tut? Genau dann hast du ein Problem: Dein Dashboard ist nicht selbsterklärend. In der Praxis macht dir das die Freude am Smart Home einfach kaputt.
Ein aus meiner Sicht ganz gutes Beispiel in meinem Dashboard ist die Kachel für den Zustand der Wallbox. Denn hier zeigt sich ganz genau, wie gut ich gearbeitet habe.
Ohne zusätzliche Informationen wüsste man nicht, um welchen Stromzähler es gehen mag. Daher hilft schon mal die Überschrift „Wallbox“ sowie die zusätzliche Information „Stromzähler Wallbox“ sehr. Ebenfalls wird klar, um welchen Kilometerstand es geht (z. B. wenn du zwei Fahrzeuge hast) und weitere Informationen.
Das zeigt für mich persönlich sehr deutlich, dass die Gruppierung (in diesem Fall durch die Kachel) sowie die klare Benennung elementar ist. Denn stell dir nur mal vor du liest sowohl deine Wallbox als auch deinen Stromzähler aus und zeigst die Daten ohne weitere Erklärung untereinander an. Dann kannst du lediglich aufgrund des Zählerstands auf das Gerät rückschließen, was aber in der Praxis echt mühsam sein kann.
Hier übrigens das YAML zur Kachel:
type: entities
entities:
- entity: sensor.wallbox_stromzahler
name: Stromzähler Wallbox
- entity: sensor.smart_kilometerstand_2
- entity: sensor.smart_tageskilometerzahler_2
name: Seit Ladung
- entity: sensor.wallbox_letzte_ladung_eur
name: Ladepreis
- entity: sensor.wallbox_geladene_menge
name: Geladene Energie
icon: mdi:lightning-bolt
- entity: sensor.wallbox_dauer_sitzung
name: Ladedauer
icon: mdi:clock-time-eight-outline
title: Letzte Ladung
footer:
type: graph
entity: sensor.wallbox_wirkleistungExtras & Tricks
Einer meiner liebsten Geheimtipps, sind die bedingungsabhängigen Karten. Das bedeutet konkret, dass du Informationen und Steuerungsoptionen in deinem Dashboard basierend auf einer Bedingung anzeigen lassen kannst. Das hilft dir zusätzlich, um noch etwas mehr Ordnung in die Visualisierung zu bekommen.
Bedingte Anzeigen haben hierzu eine eigene Karte in Home Assistant, die du in deinem Dashboard hinzufügen kannst:
Das Besondere daran ist, dass du hier basierend auf Standort oder Benutzer filtern kannst, was dir genau angezeigt wird. Das macht es in der Praxis noch wesentlich leichter, um Dashboards zu vereinfachen. Und ich bin wirklich davon überzeugt, dass es eine sehr unterschätzte Funktion bei der Erstellung von Dashboards ist.
Ein weiterer Tipp, den du guten Gewissens berücksichtigen kannst ist, dass du mehrere Dashboards nutzt. Klassisches Beispiel hierfür ist oft, dass es eine Ansicht zur alltäglichen Steuerung und eine weitere für administrative Zwecke gibt. Während das alltägliche Dashboard nach den obigen Prinzipien vorgeht, kann das administrative weitaus mehr Informationen zeigen.
Allerdings musst du hierbei etwas darauf achten, dass du nicht einfach nur die Einstellungen und Geräteverwaltung damit duplizierst. Denn am Ende des Tages ist hier die Trennlinie dazu recht schwierig. Wenn du aber zum Beispiel deine Server mit Proxmox integriert hast, wäre das ein gutes Beispiel, um die Serververwaltung vom alltäglichen abzukoppeln.
Was auch noch möglich ist, wäre ein Dashboard für Gäste und eins nur für die Familie. Das Gäste-Dashboard ist abgeschwächt und noch stärker vereinfacht. Deine Gäste werden es dir danken.
Beispiel: Conditional Cards
Lass uns die Conditional Cards nochmal kurz etwas deutlicher hervorheben. Denn ich habe dir noch ein abgespecktes YAML vorbereitet, das du nutzen und ansehen kannst. Denn hier zeigt sich auch, wie die Bedingungen intern in YAML umgesetzt werden:
type: conditional
conditions:
- condition: location
locations:
- home
card:
type: alarm-panel
states:
- arm_home
- arm_away
entity: alarm_control_panel.lupusec_alarmAn diesem Beispiel wird deutlich, wie du auf Basis deines Standorts diverse Anzeigen einblenden kannst. Hier wird zuerst geprüft, ob sich die Person an der Location Home befindet. Nur wenn das der Fall ist, wird der Inhalt der Kachel angezeigt. In diesem Fall ist das die Alarmanlage.
Doch warum sollte man das nun nutzen?
In diesem minimalen Beispiel könnte die bedingte Anzeige dazu führen, dass du die Steuerung der Alarmanlage nur dann einblendest, wenn du dich daheim befindest. Würde man dir nun dein Smartphone klauen und jemand blickt in die App, könnte man zumindest mal nicht so einfach die Alarmanlage steuern. Oder wenn du unterwegs bist, dass du nicht versehentlich etwas unbeabsichtigt änderst.
Klar, das ist jetzt erstmal ein Beispiel, das an den Haaren herbeigezogen sein mag. Aber es kann in der Praxis mitunter wirklich praktisch sein.
Leitfragen
Ein weiterer Extra-Tipp sind Leitfragen. Ohne jetzt zu tief ins Detail gehen zu wollen, gestaltest du hier nichts anderes als eine Nutzeroberfläche in einem begrenzten Umfang. Das hat zur Folge, dass du natürlich auch den Anwender im Blick haben musst.
Besonders einfach ist es, wenn du nur für dich ein Dashboard baust. Denn du kannst für dich selbst sehr schnell entscheiden, was du brauchst oder was dir hilft. Doch wenn du für andere gestaltest, wird das etwas schwieriger.
Stelle dir also immer mal wieder die folgenden Fragen, während du das Dashboard baust:
- Hilft das gerade dem Nutzer?
- Lässt sich das Smart Home so einfach steuern?
- Ist es logisch, um welches Gerät es sich hier handelt?
- Findet sich der Nutzer leicht zurecht?
Ebenso hilfreich ist es immer mal wieder Änderungen zusammen anzusehen. Da kommt oft sehr hilfreiches Feedback zusammen, wonach man dann das gemeinsame Dashboard ausbauen oder umbauen kann. Wichtig ist nur klar zu kommunizieren, was im Rahmen des Möglichen ist und was nicht. Denn du baust ja kein eigenes Frontend, sondern nur die Ordnung auf deinem Dashboard.
Fazit
Wie du sehen konntest, gibt es ein paar Tricks und Kniffe, die dir beim Aufbau deines perfekten Dashboards helfen können. Und manchmal ist es hilfreich neue Wege zu gehen oder wirklich von Grund auf nochmal zu beginnen.
Mag sein, dass es nun auf den ersten Blick auf dich nicht so wirkt, als sei das die beste Information. Doch ich merke auch immer wieder selbst, wie hilfreich es sein kann, sich diese Dinge erneut ins Gedächtnis zu rufen. Gerade im Hinblick darauf, dass auf den ersten Blick volle Dashboards wirklich toll wirken und das Herz von einem Smart Home Enthusiasten höher schlagen lassen. Doch in der Praxis kann das eben komplett ins Gegenteil schwingen. Das willst du auf gar keinen Fall.
Und so ist dieser Artikel für dich eher eine Art Leitfaden für diese Dinge, die nicht ausschließlich nur technisch betrachtet werden können. Gewissermaßen eine Art Deep Dive in semantische Bereiche, die das Smart Home auf einer ganz anderen Ebene sehr interessant machen.
Wie handhabst du die Erstellung von Dashboards? Worauf legst du besonders großen Wert? Und was hat sich bei dir als absolut hilfreich herausgestellt?
Lass uns gerne unten in den Kommentaren ein paar Tricks festhalten, um die Gestaltung von Dashboards für alle möglichst hilfreich zu machen.
0 Kommentare