Une liste immersive combine une ligne de contenu et un aperçu de l'élément sélectionné. Elle présente du contenu dans une fenêtre d'affichage plus grande.
Ressources
| Type | Lien | État |
|---|---|---|
| conception | Source de la conception (Figma) | Disponible |
| Implémentation | Jetpack Compose | Disponible |
Sélection
- Aperçu du contenu dynamique Lorsqu'un utilisateur parcourt la ligne de contenu, la zone d'aperçu est automatiquement mise à jour pour afficher l'élément sélectionné actuel.
- Le composant de liste immersive présente une fenêtre d'affichage plus grande pour afficher le contenu, ce qui permet aux utilisateurs de visualiser et d'apprécier plus facilement les détails visuels de l'élément sélectionné.
- Les listes immersives fournissent des informations pertinentes et contextuelles sur l'élément ciblé, ce qui permet aux utilisateurs de prendre des décisions éclairées sans quitter l'expérience de navigation.
- Le composant de liste immersive utilise la divulgation progressive pour afficher plus de détails sur le contenu au fil de la navigation des utilisateurs, ce qui réduit la charge cognitive et maintient l'engagement des utilisateurs.
- Le composant de liste immersive garantit des interactions cohérentes dans l'application, offrant ainsi aux utilisateurs une expérience familière et prévisible.
Anatomie
- Arrière-plan avec image
- Blocage de contenu
- Carte mise au point
- Grille de contenu
- Fond cinématique
- Affiche
- Couleur du fond
Caractéristiques techniques
Comportement
Lorsque vous naviguez entre les cartes de la liste immersive, les détails de la carte sélectionnée s'affichent progressivement en arrière-plan.
Lorsque la liste immersive est au premier plan, sa hauteur augmente pour afficher des informations supplémentaires, telles que le titre et la description de l'arrière-plan, comme illustré dans la vidéo suivante.
Utilisation
Utilisez des carrousels immersifs lorsque vous souhaitez attirer l'attention sur des contenus mis en avant ou promus, tels que des nouveautés, des émissions populaires ou des titres exclusifs. La fenêtre d'affichage plus grande et l'aperçu dynamique permettent de présenter ces éléments à priorité élevée de manière convaincante.
Affichage des images
- Focus de la carte: lorsque l'utilisateur parcourt le carrousel, la carte sélectionnée est mise en valeur visuellement, la mise à l'échelle de la carte de 1, 1, l'utilisation d'une bordure et d'autres repères visuels d'élévation pour indiquer sa sélection. Assurez-vous que les titres de contenu figurant dans la miniature de la fiche ciblée sont clairement visibles et plus faciles à lire.
- Image de fond: lorsqu'une carte est active, une image de fond correspondante s'affiche dans la fenêtre d'affichage plus grande. Nous recommandons que cette image de fond soit de haute qualité et visuellement attrayante, car elle fournit un arrière-plan immersif et engageant pour le contenu.
Composition
À faire
À éviter
Pour vous assurer que les images utilisées en tant qu'arrière-plan dans le composant de liste immersive sont correctes, veillez à les redimensionner de manière appropriée afin qu'elles ne soient pas floues ni déformées.
Format
Dans la mesure du possible, utilisez le format 16:9 pour les images de fond afin de garantir une mise en page cohérente et visuellement attrayante.
