Caroselli in primo piano

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

Cover

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

Carosello in primo piano immersivo

Carosello in primo piano della scheda

Blocco di contenuti

Anatomia

Struttura del blocco di contenuti

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

Specifiche tecniche

Specifiche immersive per i blocchi di contenuti

Impaginazione

Anatomia

Impaginato

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

Specifiche tecniche

Specifiche di impaginazione

Immersivi

Anatomia

Anatomia immersiva

Anatomia immersiva dello sfondo

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

Specifiche tecniche

Specifiche immersive

Scheda

Anatomia

Struttura del carosello in primo piano della scheda

Struttura dell'immagine carosello in primo piano della scheda

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

Specifiche tecniche

Specifiche del carosello in primo piano

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.

Utilizza immagini nitide, visivamente accattivanti e pertinenti al blocco di contenuti.
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.

Utilizza una retina per migliorare la leggibilità e la digestione dei contenuti.
Assicurati che lo sfondo non influisca sulla leggibilità e sulla visibilità del resto dei contenuti sullo schermo.