Il design per Android copre un'ampia gamma di aspetti e dispositivi unici, tra cui i dispositivi pieghevoli; non è sufficiente considerare solo i punti di interruzione. Gli utenti possono regolare e riorientare le finestre delle app sui propri dispositivi. Con i dispositivi pieghevoli, un singolo dispositivo può coprire tutti questi casi d'uso. È fondamentale pensare in termini di riquadri per l'adattabilità dei contenuti.
Modifiche all'orientamento
Non bloccare le app in modalità verticale. In questo modo, può sembrare un bug e si crea un indesiderabile letterbox durante il multitasking.
Gli utenti spesso riorientano i propri dispositivi per motivi di ergonomia e visualizzazione dei contenuti. La tua app deve supportare queste modifiche dell'orientamento.
Sui dispositivi più grandi, le modalità verticale e orizzontale possono avere effetti più sottili quando passano da una dimensione media a una grande, ma la modalità orizzontale offre una dimensione della finestra media con una visualizzazione verticale compatta.
Prendi in esame le seguenti pratiche di progettazione per l'orientamento orizzontale:
Supporta le barre di sistema edge-to-edge.
Scegli il componente di navigazione che supporta meglio i tuoi contenuti, ad esempio una barra di navigazione orizzontale o una barra di spostamento.
Valuta la possibilità di riformattare i contenuti o modificare la densità.
I layout orizzontali possono utilizzare l'interfaccia utente a larghezza media.
L'orientamento orizzontale può sfruttare l'altezza ridotta di una barra di navigazione in basso orientata orizzontalmente.
Per i contenuti, prova a utilizzare un contenitore per il letterbox o utilizza un orientamento diverso dei contenuti, se disponibile, ad esempio verticale anziché video orizzontale. I contenuti a tutta larghezza in un formato verticale compatto occupano la maggior parte dello schermo in un layout orizzontale di grandi dimensioni. Se i contenuti non scorrono in verticale, non farli scorrere in orizzontale, perché questo può confondere gli utenti.
L'immagine hero occupa lo spazio principale e rimane fissa. La barra dell'app in basso viene sganciata.
Dalla modalità verticale a quella orizzontale: entrambi i raggruppamenti di contenitori ruotano sul posto.
Per un foglio di filtri, il componente del foglio può diventare un foglio laterale. Se è necessaria maggiore attenzione, il foglio rimane a schermo intero, ma si adatta a un layout a due colonne.
Posture
Tieni conto dei casi d'uso di fattori di forma unici, come le posture di piegatura (piegata, piatta e a cavalletto).
Scopri di più su come supportare i display dei dispositivi pieghevoli.
La tua app non deve tenere conto in modo specifico di ogni postura, ma valuta la possibilità di sfruttarne una per la tua app. Ad esempio, un Media Player può mostrare un'interfaccia utente unica per la modalità da tavolo e la modalità Cover.
Piatto
Un dispositivo pieghevole è in posizione piatta quando è aperto. Lo schermo è in genere di dimensioni medie o grandi.
Chiuso
Quando un dispositivo pieghevole è chiuso, è in posizione piegata. In questa postura, interagisci con lo schermo esterno, che in genere è compatto.
Da tavolo
Una postura da tavolo è parzialmente piegata in posizione orizzontale. Questa postura ti consente di utilizzare layout unici, come controlli di grandi dimensioni e video in formato orizzontale.
Cerniera
Rendi la tua app consapevole della cerniera, in modo che i contenuti scorrano senza interruzioni e non si perdano nella cerniera. Potrebbe non essere necessario nei layout a un solo riquadro. Tuttavia, valuta se i controlli e il testo devono evitare lo spazio della cerniera.
Se progetti con una griglia di layout e riquadri, lascia un margine più ampio per ospitare la cerniera, ad esempio in un layout list-detail a due riquadri.
Alcuni pieghevoli, come quelli a tre ante, hanno più cerniere.
Copertina
Alcuni smartphone pieghevoli possono avere uno schermo esterno con formato quadrato, come uno smartphone a conchiglia.
Quando progetti per le cover, segui queste linee guida:
- Assicurati che le app siano visualizzate da bordo a bordo.
- Assicurati che gli elementi dell'interfaccia utente non siano coperti dai ritagli della fotocamera.
- Concentrati sui casi d'uso e sull'interfaccia utente.
Ad esempio, quando un dispositivo viene utilizzato solo come lettore multimediale, la copertina può diventare lo sfondo per rivelare una visualizzazione rapida che richiede meno informazioni.
Su schermi e formati più piccoli, considera l'esperienza dei contenuti focalizzati. L'immagine promozionale occupa la maggior parte della copertina per un maggiore impatto visivo, con un'anteprima del titolo e dei contenuti per facilitare lo scorrimento e la leggibilità.
La copertina deve concentrarsi molto sull'input. Ad esempio, quando viene visualizzata la tastiera, il messaggio è l'elemento principale.
Nelle schermate più piccole, come le copertine, il foglio dei filtri è a schermo intero, ma il posizionamento e il ridimensionamento dei pulsanti si adattano.
Sebbene compatta, una barra di navigazione potrebbe essere più ergonomica su una cover.
Le copertine più grandi possono sfruttare entrambi gli orientamenti di navigazione. Valuta in che modo gli utenti potrebbero interagire con i contenuti.
Una piccola barra di navigazione può evitare ritagli della videocamera e della UI di sistema rispettando l'altezza ridotta.
Cosa fare
