Interfaccia utente

Icona ottimizzata adattiva di livello 2

LIVELLO 2: ottimizzazione adattiva

Per gli utenti, l'interfaccia utente è l'app. L'interfaccia utente determina l'esperienza utente, che determina la soddisfazione degli utenti, l'utilizzo dell'app, gli acquisti in-app e la fidelizzazione dei clienti.

Gli schermi di grandi dimensioni offrono un ampio spazio di visualizzazione per interfacce utente innovative e adattabili che offrono un'esperienza utente che gli schermi piccoli non possono replicare.

Ottimizza la tua app per gli schermi di grandi dimensioni includendo i seguenti elementi dell'interfaccia utente:

  • Modalità di navigazione laterale o riquadro di navigazione a scomparsa
  • Touch target di grandi dimensioni
  • Menu e finestre di dialogo ben posizionati
  • Layout a più riquadri

Layout adattivi

Crea layout adattabili che ottimizzano l'interfaccia utente della tua app su schermi grandi e piccoli. Progetta e crea per più fattori di forma contemporaneamente. Prepara la tua app per i nuovi tipi di dispositivi.

Layout canonici

Sfrutta i layout adattivi comprovati per rendere eccezionale l'esperienza utente della tua app. Crea un layout elenco-dettagli, riquadro di supporto o feed per rendere più gestibile e piacevole la visualizzazione di più contenuti.

UI reattiva

Formatta gli elementi UI in base alle dimensioni del display. Limita la larghezza di pulsanti, schede e campi di testo a larghezza intera sui display di piccole dimensioni a una dimensione funzionalmente appropriata sui display di grandi dimensioni. Non consentire alle finestre di dialogo e ad altre finestre modali di riempire l'intero display. Posiziona i menu contestuali e altri popup correlati agli elementi adiacenti all'elemento selezionato dall'utente, non centrati sullo schermo.

Incorporamento dell'attività

Aggiorna le tue app legacy basate sull'attività con layout a più riquadri su schermi di grandi dimensioni. Non è necessario eseguire il refactoring del codice. Configura i layout in XML o con poche chiamate API Jetpack WindowManager.

Passaggi successivi

Per scoprire di più sullo sviluppo dell'interfaccia utente per un'esperienza utente ottimizzata, consulta le seguenti guide per sviluppatori: