1. Il problema della dashboard mobile
Home Assistant funziona benissimo sul telefono. Il problema è che la dashboard che hai costruito per il desktop — con le sue colonne affiancate, i widget di stato, il pannello riscaldamento in terza posizione — sul cellulare diventa una lista verticale infinita che scorre dall’alto verso il basso senza alcuna logica.
Trovi le luci in cima anche quando sono le tre di notte e l’unica cosa che ti interessa è la temperatura della camera. Il meteo te lo mostra alle 23:00. Il pulsante “esci di casa” lo trovi dopo tre scroll quando sei già in ascensore con il cappotto.
Non è un bug di Home Assistant. È che la dashboard non è stata pensata per il contesto in cui la usi quando sei sul telefono: un contesto che cambia a seconda dell’ora.
2. L’idea: una dashboard che sa che ora è
L’obiettivo non è fare una dashboard “bella su mobile”. L’obiettivo è fare una dashboard utile sul telefono in quel preciso momento.
La logica è semplice: dividi la giornata in tre fasce e mostri card diverse in ciascuna.
- Mattina (06:00–12:00): meteo, porta d’ingresso, pulsante uscita, consumi in corso
- Pomeriggio/Sera (12:00–22:00): clima, luci, media player, sensori comfort
- Notte (22:00–06:00): temperatura camera, sicurezza, controllo rapido “spegni tutto”
Una sola view, una sola colonna, zero scroll inutile. Home Assistant legge l’ora del sistema e decide da solo cosa mostrare.
3. Cosa sono le card condizionali
Le card condizionali sono una funzione nativa di Home Assistant: non servono HACS, non servono integrazioni esterne, non servono custom card. Sono disponibili fin dall’inizio.
Il principio è elementare: aggiungi una card alla dashboard e le dici “mostrami solo quando questa condizione è vera”. La condizione può essere lo stato di un’entità, la presenza di qualcuno in casa, o — nel nostro caso — l’ora del giorno.
Se la condizione non è vera, la card sparisce. Non si grigia, non collassa: sparisce del tutto. Sul mobile questo fa un’enorme differenza perché la view si adatta dinamicamente senza occupare spazio inutile.
4. Creare la dashboard e la view Mobile
Per tenere separato tutto il lavoro e non interferire con la configurazione esistente, la prima cosa da fare è creare una nuova dashboard dedicata. In questo modo puoi sperimentare liberamente e, una volta soddisfatto del risultato, impostarla come home page della Companion App.
Vai su Impostazioni → Dashboard e in basso a destra clicca su New Dashboard.
Una volta creata la nuova dashboard, aprila e clicca sulla matita in alto a destra per entrare in modalità modifica. Crea una nuova view e compilala con i seguenti parametri:
- Nome: Mobile
- Icona: mdi:cellphone (opzionale, ma utile per riconoscerla subito)
- URL: mobile
- Tipo di view: Sezioni (oppure Masonry, se preferisci)
- Numero massimo di colonne: 1 — importante
Il numero di colonne è il dettaglio che fa la differenza. Anche se Home Assistant è responsive, impostare esplicitamente una colonna singola ti dà controllo totale sul layout e impedisce che le card vengano affiancate su schermi di medie dimensioni.
5. Fascia mattina — 06:00–12:00
La mattina sei in modalità “esco di casa”: ti interessa sapere che tempo fa, se il portone è chiuso, e se hai lasciato acceso qualcosa che non dovevi.
Le card che ha senso mostrare in questa fascia, a titolo di esempio:
- Meteo — previsione giornaliera con temperatura esterna
- Sensore porta d’ingresso — aperta/chiusa
- Pulsante uscita — attiva la scena “casa vuota” (riscaldamento in eco, luci spente)
- Monitor consumi — presa lavatrice o altri carichi attivi
O qualsiasi altra card che preferite: queste sono solo le mie scelte, personalizzate sul mio setup.
Per ognuna di queste, il procedimento è identico. Aggiungi una nuova card, scegli il tipo Condizionale, poi configura due cose: la card interna (quella che vuoi mostrare) e le condizioni (quando mostrarla).
Importante: se vuoi mostrare più card all’interno di una sola condizionale — che è quello che faremo — devi avvolgere tutte le card in una Vertical Stack. La card condizionale accetta solo una card figlia: la Vertical Stack è la soluzione nativa per raggrupparne più di una.
Nel tab Condizioni aggiungi una condizione di tipo Orario:
- Dopo: 06:00
- Prima: 12:00
type: conditional
conditions:
- condition: time
after: "06:00:00"
before: "12:00:00"
card:
type: vertical-stack
cards:
- type: weather-forecast
entity: weather.home
forecast_type: daily
- type: tile
entity: binary_sensor.porta_ingresso
name: Porta ingresso
- type: button
name: Esco di casa
icon: mdi:home-export-outline
tap_action:
action: call-service
service: scene.turn_on
service_data:
entity_id: scene.casa_vuota
- type: tile
entity: sensor.presa_lavatrice_power
name: Lavatricetype: conditional
conditions:
- condition: time
after: "06:00:00"
before: "12:00:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-buttons-bar-card
title: Azioni Rapide
theme: dark
buttons:
- name: Esco di Casa
icon: mdi:logout
service: scene.turn_on
service_data:
entity_id: scene.esco_di_casa
- name: Tutte le luci
icon: mdi:lightbulb
entity: light.luci_tutte
- name: Scena Film
icon: mdi:movie-open
service: scene.turn_on
service_data:
entity_id: scene.serata_film
- type: custom:wesmart-weather-card
entity: weather.home
title: ""
theme: dark
- type: custom:wesmart-doors-card
title: Porte e finestre
entities:
- name: Portone Principale
icon: mdi:door-closed
entity: binary_sensor.0xa4c138dccb4cb231_contactLe WeSmart Cards usano nomi di entità reali del mio setup (es. binary_sensor.0xa4c138dccb4cb231_contact). Sostituiscile con le entità della tua installazione prima di incollare.
6. Fascia pomeriggio/sera — 12:00–22:00
Nel pomeriggio e in serata sei in casa: vuoi il controllo del clima, le luci giuste e, magari, sapere cosa sta suonando in salotto.
Le card utili per questa fascia:
- Termostato o valvola — temperatura target e attuale
- Controllo luci — le luci del soggiorno o della stanza in cui ti trovi
- Media player — se hai un altoparlante o una TV integrata
- Sensore qualità aria o umidità — comfort nelle ore casalinghe
Stesso procedimento della mattina. Nel tab Condizioni, imposta:
- Dopo: 12:00
- Prima: 22:00
type: conditional
conditions:
- condition: time
after: "12:01:00"
before: "22:00:00"
card:
type: vertical-stack
cards:
- type: light
entity: light.soggiorno
name: Luci soggiorno
- type: media-control
entity: media_player.soggiorno
- type: thermostat
entity: climate.soggiorno
- type: tile
entity: sensor.umidita_soggiorno
name: Umidita'type: conditional
conditions:
- condition: time
after: "12:01:00"
before: "22:00:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-lights-card
title: Luci Principali
entities:
- name: Luci Cucina
icon: mdi:fridge
entity: light.cucina_tutte_le_luci
- name: Luci Soggiorno
icon: mdi:lightbulb
entity: light.0xa4c1380a031cae28
- type: custom:wesmart-media-player-card
entity: media_player.echo_plus_di_massimo
title: Musica
theme: dark
- type: custom:wesmart-climate-card
entity: climate.0x3c2ef5fffebad64b
- type: custom:wesmart-sensors-card
title: Sensori
entities:
- sensor.temperatura_percepita_soggiorno7. Fascia notte — 22:00–06:00
La costruzione della card per la notte è identica alle altre. La notte il telefono lo guardi per due motivi: verificare che tutto sia spento, o controllare la temperatura della camera prima di addormentarti.
Le card che ha senso mostrare:
- Pulsante “spegni tutto” — attiva una scena che spegne le luci e porta il riscaldamento in modalità notte
- Temperatura camera da letto — il dato più utile in quel momento
- Stato luci — un riepilogo rapido di cosa è ancora acceso
- Sensore porta o finestra — sicurezza prima di dormire
Nel tab Condizioni, imposta:
- Dopo: 22:00
- Prima: 06:00
Nota sull’errore comune della mezzanotte. Una fascia che attraversa la mezzanotte non crea problemi, ma vale la pena capire perché. Home Assistant gestisce correttamente questo caso: quando il valore di after è maggiore di before, la condizione oraria viene interpretata automaticamente come una fascia a cavallo della mezzanotte. In pratica funziona già con i valori così come li hai scritti nell’editor visivo — non devi fare nulla di speciale. Se invece stai scrivendo YAML a mano con due condizioni separate, ricordati che devono essere collegate in OR, non in AND.
type: conditional
conditions:
- condition: time
after: "22:00:00"
before: "06:00:00"
card:
type: vertical-stack
cards:
- type: button
name: Spegni tutto
icon: mdi:power-sleep
tap_action:
action: call-service
service: scene.turn_on
service_data:
entity_id: scene.buona_notte
- type: tile
entity: sensor.temperatura_camera
name: Temperatura camera
- type: tile
entity: light.tutte_le_luci
name: Luci accese
- type: tile
entity: binary_sensor.finestra_camera
name: Finestra cameratype: conditional
conditions:
- condition: time
after: "22:01:00"
before: "05:59:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-buttons-bar-card
title: Notte
theme: dark
buttons:
- name: Luci Soggiorno
icon: mdi:lightbulb
entity: light.soggiorno
- name: Spegni Tutto
icon: mdi:light-switch-off
service: scene.turn_on
service_data:
entity_id: scene.esco_di_casa
- type: custom:wesmart-infinite-lights-expand-card
title: Luci
entities:
- name: Luce Camera da Letto
icon: mdi:lightbulb
entity: light.0xa4c13849ee028be9
- type: custom:wesmart-switches-card
title: Sicurezza
entities:
- alarm_control_panel.ezviz_alarm
- type: custom:wesmart-climate-compact-card
title: Riscaldamento
icon: mdi:thermostat
theme: dark
entities:
- entity: climate.aqara_termostato
name: Soggiorno
- entity: climate.0x3c2ef5fffebad64b
name: Camera da Letto8. Come testare senza aspettare l’ora giusta
Non devi aspettare le 22:00 per verificare che la fascia notte funzioni. Il trucco è temporaneo e non richiede nessuna modifica permanente al sistema: nell’editor visivo, sostituisci momentaneamente i valori orari della condizione con un intervallo che include l’ora attuale. Se sono le 15:30, imposta after: 15:00 e before: 16:00 — la card appare subito. Verificato che tutto funziona, ripristina i valori originali.
Per vedere il risultato animato con le tre fasce che si alternano, nel video allegato a questo articolo mostro l’intera sequenza in accelerata: è il modo più rapido per capire come si comporta la view nella pratica.
9. Impostare la Companion App
Costruire la view Mobile non basta: devi anche dire alla Companion App di aprirla per prima quando lanci l’app sul telefono, altrimenti continui ad atterrare sulla dashboard predefinita.
Il percorso è più diretto di quanto sembra. Apri la Companion App, vai sulla dashboard che hai creato e tocca i tre puntini di fianco al nome della view — poi seleziona Save as default. Da quel momento, ogni volta che apri l’app atterri direttamente sulla view giusta, già filtrata per l’ora in cui ti trovi. Il procedimento è lo stesso su iOS e Android.
10. Upgrade con le WeSmart Cards
La struttura che hai costruito — card condizionale con fascia oraria — è completamente indipendente dal tipo di card che ci metti dentro. Puoi sostituire qualsiasi card nativa con una WeSmart Card senza toccare le condizioni: cambia solo il blocco card: interno, le condizioni rimangono identiche.
Il risultato visivo cambia radicalmente: le WeSmart Cards usano un design minimal con tema scuro nativo, perfetto per l’uso notturno sul telefono senza abbagliare. Se hai già installato la collezione, è questione di pochi minuti per aggiornare ogni card.
Trovi la presentazione completa del progetto qui: WeSmart Custom Cards per Home Assistant, e la guida all’installazione con tutti gli esempi YAML qui: Installazione e configurazione WeSmart Custom Cards. Il repository GitHub con tutti i file è disponibile su github.com/WeAreSmart-home/wesmart-original-custom-cards.
Se invece preferisci un’estetica diversa, Bubble Card è un’alternativa altrettanto valida per costruire dashboard personalizzate — trovi esempi e configurazioni pratiche in Bubble Card: esempi per dashboard.
11. YAML completo
Per chi preferisce lavorare direttamente nel raw editor, qui sotto trovi l’intera view in un unico blocco, nella versione con le WeSmart Cards che uso nel mio setup. Il punto importante da sottolineare è la struttura a sezioni separate per fascia: ogni grid contiene una sola card condizionale con la sua Vertical Stack interna. Questo rende il YAML più leggibile e facile da manutenere rispetto ad avere tutto in un’unica sezione.
Ricordati di sostituire tutte le entità con quelle della tua installazione prima di incollare.
type: sections
max_columns: 1
title: Condizionale WeSmart
header:
card:
type: markdown
text_only: true
content: |-
# Ciao {{ user }}
Tutorial sulle card condizionali
sections:
- type: grid
cards:
- type: heading
heading_style: title
- type: conditional
conditions:
- condition: time
after: "06:00:00"
before: "12:00:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-buttons-bar-card
title: Azioni Rapide
theme: dark
buttons:
- name: Esco di Casa
icon: mdi:logout
service: scene.turn_on
service_data:
entity_id: scene.esco_di_casa
- name: Tutte le luci
icon: mdi:lightbulb
entity: light.luci_tutte
- name: Scena Film
icon: mdi:movie-open
service: scene.turn_on
service_data:
entity_id: scene.serata_film
- type: custom:wesmart-weather-card
entity: weather.home
title: ""
theme: dark
- type: custom:wesmart-doors-card
title: Porte e finestre
entities:
- name: Portone Principale
icon: mdi:door-closed
entity: binary_sensor.0xa4c138dccb4cb231_contact
- type: grid
cards:
- type: heading
heading_style: title
- type: conditional
conditions:
- condition: time
after: "12:01:00"
before: "22:00:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-lights-card
title: Luci Principali
entities:
- name: Luci Cucina
icon: mdi:fridge
entity: light.cucina_tutte_le_luci
- name: Luci Soggiorno
icon: mdi:lightbulb
entity: light.0xa4c1380a031cae28
- type: custom:wesmart-media-player-card
entity: media_player.echo_plus_di_massimo
title: Musica
theme: dark
- type: custom:wesmart-climate-card
entity: climate.0x3c2ef5fffebad64b
- type: custom:wesmart-sensors-card
title: Sensori
entities:
- sensor.temperatura_percepita_soggiorno
- type: grid
cards:
- type: heading
heading_style: title
- type: conditional
conditions:
- condition: time
after: "22:01:00"
before: "05:59:00"
card:
type: vertical-stack
cards:
- type: custom:wesmart-buttons-bar-card
title: Notte
theme: dark
buttons:
- name: Luci Soggiorno
icon: mdi:lightbulb
entity: light.soggiorno
- name: Spegni Tutto
icon: mdi:light-switch-off
service: scene.turn_on
service_data:
entity_id: scene.esco_di_casa
- type: custom:wesmart-infinite-lights-expand-card
title: Luci
entities:
- name: Luce Camera da Letto
icon: mdi:lightbulb
entity: light.0xa4c13849ee028be9
- type: custom:wesmart-switches-card
title: Sicurezza
entities:
- alarm_control_panel.ezviz_alarm
- type: custom:wesmart-climate-compact-card
title: Riscaldamento
icon: mdi:thermostat
theme: dark
entities:
- entity: climate.aqara_termostato
name: Soggiorno
- entity: climate.0x3c2ef5fffebad64b
name: Camera da LettoNota: questo YAML usa le WeSmart Cards del mio setup personale — incluse entità con indirizzi Zigbee (0xa4c138...) che sono specifici della mia installazione. Se vuoi partire dalle card native senza dipendenze esterne, usa i blocchi YAML delle singole sezioni 5, 6 e 7 riportati sopra.
12. FAQ
Posso aggiungere altre fasce orarie?
Sì, il procedimento è identico. Puoi creare tutte le fasce che vuoi — una fascia pomeridiana, una per il pranzo, una per l’ora di sport. Aggiungi una nuova card condizionale con la fascia oraria desiderata e riempila con le card più utili in quel contesto.
Funziona anche senza Companion App?
Sì. Le card condizionali funzionano nel browser come in qualsiasi altro client. L’ora usata è quella del sistema su cui gira Home Assistant, non quella del dispositivo che stai usando per visualizzare. Se il tuo server è sincronizzato correttamente — e lo è quasi sempre — il risultato è identico. La Companion App serve solo per impostare la view Mobile come home page predefinita: senza di essa devi navigare manualmente alla tab corretta ogni volta.
Funziona su Android?
Sì, senza alcuna differenza. La Companion App per Android ha le stesse impostazioni di quella iOS. Il percorso è identico: tre puntini di fianco alla view → Save as default.
