I dispositivi TV offrono una serie limitata di controlli di navigazione per le app. Per creare uno schema di navigazione efficace per la UI della TV, considera questi controlli limitati e la modalità di navigazione dell'utente utilizzando i pulsanti del telecomando anziché un touchscreen.
In evidenza
- Il controller offre funzionalità di navigazione limitate (verso l'alto, verso sinistra e verso destra), quindi fai attenzione a come questo può plasmare il design dell'interfaccia utente della tua app.
- La navigazione deve essere naturale e familiare.
- Crea un'esperienza di navigazione semplice usando il pulsante Indietro del telecomando.
- Se un utente non ha un percorso diretto per accedere a un controllo, valuta la possibilità di spostarlo.
Princìpi
L'obiettivo è far sì che la navigazione risulti naturale e familiare senza dominare l'interfaccia utente o distogliere l'attenzione dai contenuti. I seguenti principi aiutano a stabilire una base di riferimento per un'esperienza utente coerente e intuitiva nelle app TV.
Efficiente
Consenti di accedere ai contenuti in modo semplice e veloce. Gli utenti vogliono accedere ai contenuti rapidamente, con un numero minimo di clic. Organizza le tue informazioni in un modo che richieda il minor numero di schermate.
Prevedibile
Segui le best practice e i consigli per rendere la navigazione prevedibile per gli utenti. Non reinventare inutilmente le modalità di navigazione, poiché ciò genera confusione e imprevedibilità.
Intuitiva
Rendi la navigazione sufficientemente semplice da supportare senza problemi i comportamenti degli utenti più diffusi. Non complicare eccessivamente l'utente aggiungendo livelli di navigazione non necessari.
Controller
I controller sono disponibili in tanti stili, dal telecomando minimalista ai controller di gioco più complessi. Tutti i controller includono un pad direzionale (D-pad) oltre ai pulsanti Seleziona, Home e Indietro. Gli altri pulsanti variano in base al modello.
- Pad direzionale (D-pad): il metodo di navigazione principale sulla TV è tramite il D-pad, che include i tasti hardware direzionali su, giù, sinistra e destra.
- Pulsante di selezione: consente di selezionare l'elemento sullo schermo con stato attivo. Tieni premuto può essere usato per visualizzare altre opzioni.
- Pulsante Home - Porta l'utente alla schermata Home del sistema.
- Pulsante Indietro: consente agli utenti di tornare alla visualizzazione precedente.
- Pulsante microfono: attiva l'Assistente Google o l'input vocale.
Navigazione con D-pad
Su un dispositivo TV, gli utenti possono navigare utilizzando un D-pad a 4 direzioni: in alto, in basso, a sinistra e a destra. Per creare un'app per la TV ottimale, progetta uno schema di navigazione in cui l'utente possa imparare rapidamente a usare la tua app con i quattro tasti freccia. Il D-pad sposta lo stato attivo da un elemento all'elemento più vicino nella direzione corrispondente.
Per verificare che la navigazione dell'app funzioni correttamente con il D-pad su un dispositivo TV, tieni presente quanto segue:
- Assicurati che un utente possa accedere a tutti gli elementi attivabili sullo schermo.
- Assicurati che la direzione di navigazione sia diretta e prevedibile.
- Per gli elenchi a scorrimento, assicurati che i pulsanti Su e Giù del D-pad scorrano l'intero elenco e che sia possibile selezionare ogni elemento dell'elenco.
Pulsante Home
La pressione del pulsante Home reindirizza sempre l'utente alla schermata Home o Avvio app di Google TV. L'app corrente sarebbe sospesa in background per impostazione predefinita.
Premi a lungo il pulsante Home per visualizzare la dashboard di sistema su Google TV e la griglia delle app su Android TV. Il comportamento predefinito può variare in base al produttore.
Pulsante Indietro
Per garantire la coerenza tra le app della piattaforma, assicurati che il comportamento del pulsante Indietro segua queste linee guida.
Usa un comportamento prevedibile del pulsante Indietro
Per creare un'esperienza di navigazione prevedibile, quando l'utente preme il pulsante Indietro del telecomando, porta l'utente alla destinazione precedente. Infine, l'utente deve arrivare alla schermata Home o Avvio app di Google TV se continua a premere il pulsante Indietro.
L'utente viene riportato alla parte superiore della pagina scorrendo rapidamente e attiva lo stato attivo sul menu.
Il menu laterale a sinistra viene attivato e l'elemento attivo dell'utente viene spostato sulla voce di menu attiva.
Assicurati che il pulsante Indietro non sia bloccato da schermate di conferma o da un ciclo infinito.
Cosa non fare
Non visualizzare un pulsante Indietro
A differenza dei dispositivi portatili, il pulsante Indietro sul telecomando consente di spostarsi a ritroso sulla TV. Non è necessario mostrare sullo schermo un pulsante Indietro virtuale.
Cosa non fare
Mostra il pulsante Annulla, se necessario
Se le uniche azioni visibili sono azioni di conferma, distruttive o di acquisto, è buona norma avere un pulsante Annulla che torni alla destinazione precedente.
Cosa fare
Architettura di navigazione
Destinazione di partenza fissa
La prima schermata che l'utente vede quando avvia l'app da Avvio app è anche l'ultima che vede l'utente quando torna in Avvio app dopo aver premuto il pulsante indietro.
I link diretti simulano la navigazione manuale
Che si tratti di link diretti o di navigazione manuale verso una destinazione specifica, gli utenti possono utilizzare il pulsante Indietro per raggiungere la destinazione iniziale da qualsiasi punto dell'app.
I link diretti a un'app da un'altra app simulano la navigazione manuale. Ad esempio, se l'utente accede direttamente a una pagina dei dettagli nell'app Moviestar da Google TV e preme il pulsante Indietro, viene indirizzato alla home page dell'app Moviestar.
Percorso chiaro di tutti gli elementi attivabili
Consenti agli utenti di navigare nella tua UI con una direzione chiara. Se non esiste un percorso diretto per accedere a un controllo, valuta la possibilità di spostarlo.
Cosa fare
Cosa non fare
Axis
Progetta il tuo layout in modo da sfruttare gli assi orizzontale e verticale. Assegna a ogni direzione una funzione specifica per navigare velocemente in gerarchie di grandi dimensioni.
Cosa fare
