Carte

Le schede possono contenere una vasta gamma di informazioni, come testo, icone, immagini, risposte di Gemini o azioni.

Gli elementi di design devono essere ancorati alla parte inferiore del frame.

Principi

Coerenza: le schede raggruppano informazioni e azioni correlate in un'unica unità facilmente fruibile.

Chiarezza: presentano i contenuti in modo chiaro e organizzato, migliorandone la scannabilità.

Versatilità: le schede possono adattarsi per mostrare un'ampia gamma di contenuti, da piccole descrizioni di testo a riepiloghi più complessi con più elementi.

Modularità: progettate per essere modulari e riutilizzabili in diverse parti dell'interfaccia Jetpack Compose Glimmer per occhiali.

Utilizzo e posizionamento

Le schede possono contenere un'ampia gamma di informazioni, come testo, icone, immagini, azioni o risposte di Gemini.

Gli elementi di design devono essere ancorati alla parte inferiore del frame.

Utilizza i modelli di schede Glimmer di Jetpack Compose per i contenuti, in quanto sono disponibili in molte varianti e sono ottimizzati per seguire i principi di progettazione degli occhiali.

Cosa fare

Mantieni i contenuti concisi e rispetta le best practice di stile, ad esempio l'utilizzo dei colori.

Cosa non fare

Saturare gli utenti con troppi contenuti all'interno delle schede o abbandonare le linee guida di stile.

Anatomia

Le schede sono create con modelli di slot preimpostati.

Gli elementi di design devono essere ancorati alla parte inferiore del frame. 1. Intestazione: la sezione superiore della scheda, progettata per contenere un'immagine.

2. Titolo e sottotitolo: questi campi di testo forniscono le etichette principale e secondaria per la scheda.

3. Icona iniziale: un'icona facoltativa che viene visualizzata all'inizio dell'area dei contenuti della scheda.

4. Icona finale: un'icona facoltativa che viene visualizzata alla fine dell'area dei contenuti della scheda.

5. Azione: uno spazio per un elemento interattivo principale, ad esempio un pulsante. In questo modo, gli utenti possono eseguire un'azione direttamente dalla scheda. Lo slot è disponibile in un overload separato del componente componibile della scheda.

6. Contenuti principali: il corpo principale della scheda, in cui inserisci il testo o altri contenuti principali.

Obiettivo

Per le schede il cui scopo principale è ospitare un elemento interattivo specifico (come.il pulsante nell'azione), lo stato attivo deve passare direttamente a quell'elemento, non al contenitore della scheda. Una scheda diventa selezionabile quando rappresenta un singolo elemento navigabile, ad esempio una voce in un elenco. In questo modo, l'esperienza utente è più diretta e accessibile.

Gli elementi di design devono essere ancorati alla parte inferiore del frame. Una scheda attiva come elemento di elenco.

Gli elementi di design devono essere ancorati alla parte inferiore del frame. Un pulsante all'interno di una scheda viene messo in evidenza come elemento interattivo.