Dashboards bauen: Lovelace, VIS & Displays

Warum ein Dashboard wichtig ist

Das Smart Home ist nur so gut wie seine Bedienbarkeit. Wenn du jedes Gerät separat über seine eigene App steuern musst, ist das „smart" nur in der Theorie. Ein gemeinsames Dashboard bringt alle Geräte auf eine Oberfläche – ob Licht, Heizung, Kameras oder Steckdosen.

Lovelace: Das Dashboard-System von Home Assistant

Lovelace ist das integrierte Dashboard-System von Home Assistant. Es basiert auf Karten (Cards), die du frei anordnen kannst. Du brauchst keine HTML-Kenntnisse – der grafische Editor reicht für die meisten Anwendungsfälle.

Basis-Karten

Die wichtigsten Karten für den Einstieg:

• Entity-Karte: Zeigt den Zustand einer einzelnen Entität an. Ideal für einen Sensor, einen Schalter oder eine Glühbirne.
• Button-Karte: Ein Klick-Button, der eine Aktion auslöst – Licht einschalten, Rolladen öffnen, Szene aktivieren.
• Glance-Karte: Zeigt mehrere Entitäten kompakt in einer Reihe – ideal für eine schnelle Übersicht.

Erweiterte Karten

• Entities-Karte: Listet mehrere Entitäten mit Zustand, Status und Steuerung auf. Gut für Gruppen zusammengehöriger Geräte.
• Mushroom Cards (HACS): Moderne, runde Karten mit Icon-Fokus – die beliebteste Custom-Card-Sammlung.
• Bubble Card (HACS): Pop-up-Karten, die Untermenüs und Detailansichten ermöglichen – wirkt wie eine native App.

KI-generiert

ioBroker VIS: Visuelle Dashboard-Oberflächen

ioBroker setzt auf VIS – das Visual Interface System. Im Gegensatz zu Lovelace ist VIS ein Canvas-basierter Editor: Du ziehst Widgets per Drag-and-Drop auf eine freie Fläche. Voraussetzung ist ein laufender ioBroker-Server, den du als Docker-Container, auf einem Raspberry Pi oder unter Windows betreiben kannst. Die Einrichtung ist im Artikel ioBroker: Die wichtigsten Adapter beschrieben.

VIS (Classic)

Die klassische VIS-Version ist ausgereift und hat hunderte Widgets. Sie ist jedoch optisch veraltet und läuft nicht auf modernen Mobilgeräten besonders gut.

• Drag-and-Drop-Editor: Widgets beliebig auf dem Canvas platzieren – ähnlich wie in PowerPoint.
• Widgetbasiert: Schalter, Schieberegler, Diagramme, Textanzeigen – alle als Widgets verfügbar.
• Bindung an Datenpunkte: Jedes Widget bindet an einen ioBroker-Datenpunkt – beim Klick wird der Datenpunkt gesetzt.

VIS-2

VIS-2 ist der moderne Nachfolger, der React als Grundlage nutzt. Bessere Performance, responsives Design, aber noch nicht alle Widgets aus VIS Classic verfügbar. VIS-2 ist seit 2023 in Beta und wird aktiv entwickelt – für Produktiv-Dashboards ist VIS Classic aktuell die sichere Wahl.

Material Design Widgets

Das Material Design Adapter-Paket für ioBroker bringt modern gestaltete Widgets – Buttons, Listen, Karten – im Google Material Design-Stil. Gut für saubere, moderne Dashboards. Installation: Im ioBroker-Admin unter „Adapter" → „Material Design Widgets" installieren und eine Instanz hinzufügen.

Smart Displays als wandmontierte Steuerung

Ein günstiges Tablet oder ein Smart Display an der Wand ist eine elegante Alternative zum Smartphone. Die meisten Nutzer montieren eines im Flur oder in der Küche.

Amazon Echo Show: Je nach Raumgröße

Der Echo Show ist ein Smart Display mit Alexa – als reine Sprachsteuerung und für Routinen gut geeignet:

• Echo Show 5: Für kleine Räume, Schlafzimmer oder als Küchengerät. Echo Show 5🛒(öffnet in neuem Tab)
• Echo Show 8: Der Mittelweg – gut fürs Wohnzimmer oder die Küche. Echo Show 8🛒(öffnet in neuem Tab)
• Echo Show 15: Das große Display für die zentrale Smart-Home-Steuerung im Flur – mit Kalender, Einkaufsliste und Geräteübersicht. Echo Show 15🛒(öffnet in neuem Tab)

Tablet als Lovelace-Display

Ein Tablet mit Fully Kiosk Browser ist die flexibelste Lösung: Es zeigt Lovelace als Vollbild-Dashboard, schaltet den Bildschirm ein, wenn jemand vorbeigeht (via Bewegungssensor), und bleibt dauerhaft an der Wand. Das Amazon Fire HD 10 Tablet🛒(öffnet in neuem Tab) ist eine der günstigsten Optionen – und mit ADB-Sideloading läuft Fully Kiosk darauf einwandfrei.

Als quelloffene Alternative zu Fully Kiosk bietet sich Wallpanel an: keine Lizenzkosten, weniger ausgereift, aber völlig ausreichend für einfache Wanddisplays. Für die Installation per ADB verbindest du das Fire Tablet per USB mit einem Rechner, auf dem die ADB-Tools installiert sind, und führst adb install fully-kiosk.apk aus – ca. 5 Minuten für Technik-Versierte.

Zur Wandmontage empfiehlt sich die Wandhalterung mit Unterputz-Ladeanschluss🛒(öffnet in neuem Tab) – das Tablet ist sauber montiert und wird permanent geladen.

Wusstest du schon?

Amazon Fire Tablets haben werksseitig keine Google Play Services. Mit ADB kannst du den Play Store in wenigen Minuten nachrüsten – und damit auch normale Android-Apps wie Fully Kiosk installieren.

Layout-Tipps für gute Dashboards

• Gruppen nach Raum, nicht nach Gerätetyp: „Schlafzimmer" (alle Geräte des Raums auf einer Karte) ist benutzerfreundlicher als „Alle Lampen" (alle Lampen im Haus auf einer Karte).
• Wichtiges oben: Die Geräte, die du täglich nutzt, gehören nach oben – oben links auf dem ersten Tab.
• Weniger Tabs, mehr Tiefe: Lieber einen Tab mit vielen Karten als viele Tabs mit je einer Karte.
• Farben sparsam einsetzen: Nur aktive Zustände farblich hervorheben – inaktive grau lassen.

Ein einfaches YAML-Gerüst für eine Raumkarte im YAML-Modus sieht so aus:

type: vertical-stack
cards:
  - type: entities
    title: Wohnzimmer
    entities:
      - light.wohnzimmer_decke
      - media_player.wohnzimmer_tv
  - type: button
    entity: scene.wohnzimmer_abend
    name: Abendstimmung

Wusstest du schon?

Im Lovelace-YAML-Modus kannst du Dashboards per Copy-Paste teilen. Die Home Assistant Community hat hunderte fertige Dashboard-Vorlagen, die du als Ausgangspunkt nutzen kannst.

Pro-Tipp

Nutze den „Companion App Sensor" in der iOS/Android Home Assistant App, um automatisch zu erkennen, ob du zu Hause bist. Das Dashboard kann sich je nach Anwesenheit anpassen – z. B. eine „Wir gehen los"-Ansicht zeigen.