Caroselli in primo piano

I caroselli in primo piano mostrano una selezione di contenuti pertinenti per l'utente.

Risorse

Tipo	Collega	Stato
Progettazione	Origine progettazione (Figma)	Disponibile
Implementazione	Jetpack Compose	Disponibile

In evidenza

• Usa caroselli in primo piano per mettere in evidenza contenuti specifici.
• I caroselli in primo piano possono includere elementi dell'interfaccia utente come immagini, titoli, dettagli dei contenuti, video, azioni e controlli di impaginazione.
• In genere i caroselli si trovano nella home page o nella pagina di destinazione dell'app, il che li rende facilmente accessibili.
• I caroselli in primo piano sono visivamente accattivanti per aiutare a coinvolgere l'utente e creare un'esperienza immersiva.
• I contenuti visualizzati possono essere personalizzati in base alla cronologia delle visualizzazioni, alle preferenze o alle tendenze attuali dell'utente.

Varianti

Esistono due diversi modi per integrare i caroselli in primo piano:

1. Immersivi
2. Scheda

Blocco di contenuti

Anatomia

1. Testo sovrapposto
2. Titolo
3. Descrizione
4. Pulsante

Specifiche tecniche

Impaginazione

Anatomia

1. Premessa
2. Elemento attivo
3. Elementi non attivi
4. Elementi totali

Specifiche tecniche

Immersivi

Anatomia

1. Sfondo immagine
   1. Tela cinematografica
   2. Poster
   3. Colore dello sfondo
2. Blocco di contenuti
3. Impaginazione
4. Griglia dei contenuti

Specifiche tecniche

Scheda

Anatomia

1. Sfondo immagine
   1. Tela cinematografica
   2. Poster
   3. Sfondo scheda
2. Blocco di contenuti
3. Impaginazione
4. Griglia dei contenuti

Specifiche tecniche

Utilizzo

Usa caroselli in primo piano per mostrare e promuovere una selezione curata di contenuti in un formato coinvolgente, visivamente accattivante e facile da esplorare.

Immagini sullo sfondo

Le immagini sullo sfondo svolgono un ruolo cruciale per migliorare il coinvolgimento degli utenti in un carosello in primo piano di un'app di streaming.

Immagini di alta qualità

Utilizza immagini ad alta risoluzione visivamente accattivanti e pertinenti ai contenuti della scheda attiva.

check_circle

Cosa fare

Utilizza immagini nitide, visivamente accattivanti e pertinenti al blocco di contenuti.

cancel

Cosa non fare

Evita di utilizzare immagini con testo sullo sfondo.

Gerarchia visiva evidente

Assicurati che lo sfondo non distolga l'attenzione dai contenuti della scheda attiva applicando un retino sopra l'immagine. In questo modo l'utente può concentrarsi sul titolo, sulla descrizione e sul pulsante di invito all'azione della scheda.

check_circle

Cosa fare

Utilizza una retina per migliorare la leggibilità e la digestione dei contenuti.

cancel

Cosa non fare

Assicurati che lo sfondo non influisca sulla leggibilità e sulla visibilità del resto dei contenuti sullo schermo.