Sélection de carrousels
Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
La sélection de carrousels présente une sélection de contenus pertinents pour l'utilisateur.
Ressources
Sélection
- Utilisez des carrousels mis en avant pour mettre en avant des contenus spécifiques.
- Les carrousels présentés peuvent inclure des éléments d'interface utilisateur tels que des images, des titres, des détails sur le contenu, des vidéos, des actions et des commandes de pagination.
- Les carrousels sont généralement situés sur la page d'accueil ou la page de destination de l'application, ce qui les rend facilement accessibles.
- Les carrousels présentés sont visuellement attrayants pour aider à engager l'utilisateur et créer une expérience immersive.
- Le contenu affiché peut être personnalisé en fonction de l'historique de consultation de l'utilisateur, de ses préférences ou des tendances actuelles.
Variantes
Il existe deux façons d'intégrer une sélection de carrousels:
- Immersif
- Fiche
Blocage de contenu
Anatomie
- Texte en surligne
- Titre
- Description
- Bouton
Caractéristiques techniques
Anatomie
- Arrière-plan
- Élément actif
- Éléments inactifs
- Nombre total d'éléments
Caractéristiques techniques
Immersif
Anatomie
- Arrière-plan de l'image
- Fond cinématique
- Affiche
- Couleur du fond
- Blocage de contenu
- Pagination
- Grille de contenu
Caractéristiques techniques
Fiche
Anatomie
- Arrière-plan de l'image
- Fond cinématique
- Affiche
- Arrière-plan de la carte
- Blocage de contenu
- Pagination
- Grille de contenu
Caractéristiques techniques
Utilisation
Utilisez des carrousels mis en avant pour présenter et promouvoir une sélection de contenus dans un format engageant, visuellement attrayant et facile à parcourir.
Images en arrière-plan
Les images en arrière-plan jouent un rôle crucial dans l'amélioration de l'engagement des utilisateurs dans le carrousel présenté dans une application de streaming.
Images de haute qualité
Utilisez des images haute résolution visuellement attrayantes et pertinentes par rapport au contenu de la carte ciblée.
check_circle
À faire
Faites en sorte que les images soient propres, visuellement attrayantes et pertinentes par rapport au bloc de contenu.
cancel
À éviter
Évitez d'utiliser des images contenant du texte en arrière-plan.
Hiérarchie visuelle évidente
Assurez-vous que l'arrière-plan ne détourne pas le contenu de la carte sélectionnée en utilisant une toile sur l'image. Cela aide l'utilisateur à rester concentré sur le titre, la description et le bouton d'incitation à l'action de la carte.
check_circle
À faire
Utilisez un fond pour améliorer la lisibilité et la digestion du contenu.
cancel
À éviter
Assurez-vous que l'arrière-plan n'affecte pas la lisibilité ni la visibilité du reste du contenu à l'écran.
Le contenu et les exemples de code de cette page sont soumis aux licences décrites dans la Licence de contenu. Java et OpenJDK sont des marques ou des marques déposées d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/07/27 (UTC).
[[["Facile à comprendre","easyToUnderstand","thumb-up"],["J'ai pu résoudre mon problème","solvedMyProblem","thumb-up"],["Autre","otherUp","thumb-up"]],[["Il n'y a pas l'information dont j'ai besoin","missingTheInformationINeed","thumb-down"],["Trop compliqué/Trop d'étapes","tooComplicatedTooManySteps","thumb-down"],["Obsolète","outOfDate","thumb-down"],["Problème de traduction","translationIssue","thumb-down"],["Mauvais exemple/Erreur de code","samplesCodeIssue","thumb-down"],["Autre","otherDown","thumb-down"]],["Dernière mise à jour le 2025/07/27 (UTC)."],[],[],null,["# Featured carousels showcase a selection of content relevant to the user.\n\nResources\n---------\n\n| Type | Link | Status |\n|----------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------|\n| Design | [Design source (Figma)](https://goo.gle/tv-desing-kit) | Available |\n| Implementation | [Jetpack Compose](/reference/kotlin/androidx/tv/material3/package-summary#Carousel(kotlin.Int,androidx.compose.ui.Modifier,androidx.tv.material3.CarouselState,kotlin.Long,androidx.compose.animation.ContentTransform,androidx.compose.animation.ContentTransform,kotlin.Function1,kotlin.Function2)) | Available |\n\nHighlights\n----------\n\n- Use featured carousels to highlight specific content.\n- Featured carousels can include UI elements such as images, headlines, content details, videos, actions, and pagination controls.\n- Carousels are usually located on the app's homepage or landing page, which makes them readily accessible.\n- Featured carousels are visually appealing to help engage the user, and create an immersive experience.\n- The content displayed can be personalized based on the user's viewing history, preferences, or current trends.\n\nVariants\n--------\n\nThere are two different ways of integrating featured carousels:\n\n1. Immersive\n2. Card\n\nContent block\n-------------\n\n### Anatomy\n\n1. Overline text\n2. Title\n3. Description\n4. Button\n\n### Specs\n\nPagination\n----------\n\n### Anatomy\n\n1. Background\n2. Active element\n3. Inactive elements\n4. Total elements\n\n### Specs\n\nImmersive\n---------\n\n### Anatomy\n\n1. Image background\n 1. Cinematic scrim\n 2. Poster\n 3. Background color\n2. Content block\n3. Pagination\n4. Content grid\n\n### Specs\n\nCard\n----\n\n### Anatomy\n\n1. Image background\n 1. Cinematic scrim\n 2. Poster\n 3. Card background\n2. Content block\n3. Pagination\n4. Content grid\n\n### Specs\n\nUsage\n-----\n\nUse featured carousels to showcase and promote a curated selection\nof content in an engaging, visually appealing, and simple to navigate format.\n\n### Images in backgrounds\n\nImages in backgrounds play a crucial role in enhancing user engagement\nin a streaming app featured carousel.\n\n### High quality imagery\n\nUse high-resolution images that are visually appealing and relevant\nto the content of the focused card. \ncheck_circle\n\n### Do\n\nKeep images clean, visually appealing, and relevant to the content block. \ncancel\n\n### Don't\n\nAvoid using images with text in the background.\n\n### Obvious visual hierarchy\n\nEnsure that the background does not distract from the focused card's\ncontent by using a scrim over the image; this helps the user maintain\nfocus on the card's title, description, and call-to-action button. \ncheck_circle\n\n### Do\n\nUse a scrim to improve readability and content digestion. \ncancel\n\n### Don't\n\nMake sure the background doesn't affect readability and visibility of the rest of the content on the screen."]]
