Système de couleurs

Android TV est conforme aux consignes de couleur Material de Google, ce qui garantit une interface cohérente et visuellement attrayante. Elle crée un style visuel très immersif et engageant adapté à l'écran du téléviseur. Ce guide explique en détail comment appliquer le thème Material Design à une interface Android TV.

Sélection

  • Android TV est conforme aux consignes de couleur Material de Google, mais est optimisée pour les téléviseurs.
  • Utilisez des thèmes sombres pour créer des expériences cinématographiques.
  • Utilisez Material Theme Builder pour créer un thème.

Jeu de couleurs

Un jeu de couleurs vous aide à appliquer de la couleur à votre interface utilisateur de manière significative, ce qui crée de l'harmonie, de la cohérence de la marque et de l'évolutivité.

La base d'un jeu de couleurs est l'ensemble de cinq couleurs clés qui se rapportent individuellement à des palettes tonales distinctes de treize tons ou plus. Des tons spécifiques de chaque palette tonale sont attribués à des rôles de couleur dans une interface utilisateur. Les couleurs clés constituent la base pour créer tout jeu de couleurs dynamique. Vous pouvez créer des couleurs clés basées sur une couleur racine à l'aide de Material Theme Builder ou choisir vos propres couleurs clés.

Couleurs principales

Une fois les couleurs clés définies, l'algorithme de Material spécifie le spectre complet des couleurs nécessaires pour exprimer les états d'interaction, les erreurs et le contraste accessible.

Processus de génération des thèmes de couleurs

Le générateur de thèmes Material génère des jeux de couleurs sombres et claires avec les mêmes jetons de couleur, ce qui permet de passer facilement d'un thème à l'autre.

Rôles de couleur

Principale

Les rôles principaux sont utilisés pour les composants clés de l'interface utilisateur, tels que les boutons visibles, les états actifs et la teinte des surfaces surélevées.

Accent principal

Secondaire

Les rôles secondaires sont utilisés pour les composants moins visibles dans l'interface utilisateur, tels que les chips de filtre, et pour les options supplémentaires d'expression de couleur.

Accent secondaire

Tertiaire

Les rôles tertiaires sont utilisés pour accentuer les contrastes permettant d'équilibrer les couleurs primaires et secondaires ou d'attirer une attention accrue sur un élément, tel qu'un champ de saisie.

Accent tertiaire

Surfaces

Les rôles neutres sont utilisés pour les surfaces et les arrière-plans, ainsi que pour le texte et les icônes à forte intensité. Pour en savoir plus sur les surfaces, consultez les consignes Material Design.

Surfaces

Comptes-rendus

Pour en savoir plus sur les principaux rôles, consultez les consignes Material Design.

Outline

Couleurs dynamiques

Sur Android Mobile, à partir d'Android 12, les utilisateurs peuvent générer des schémas individualisés via des sélections de fonds d'écran et d'autres personnalisations. Android TV ne prend pas en charge le fond d'écran, ce qui signifie que les schémas générés par l'utilisateur ne sont pas pris en charge et que l'OS Android TV ne diffuse que les palettes de base.

Au lieu de schémas générés par l'utilisateur, vous pouvez utiliser des jeux de couleurs basés sur le contenu pour créer des conceptions dynamiques et ludiques, basées sur des contenus tels que des affiches de film, des pochettes d'album et d'autres images de héros. Pour plus d'informations, consultez la section Jeux de couleurs basés sur le contenu.

Les bibliothèques de développement des utilitaires Material color vous permettent d'extraire les couleurs clés directement de l'image, ou d'exécuter votre propre algorithme d'extraction des couleurs pour trouver une couleur clé, puis d'utiliser les utilitaires de couleur de Material pour générer un thème.

Voici un exemple d'extraction des couleurs d'une image:

Couleurs dynamiques

  1. Image source
  2. Couleur de la graine extraite
  3. Couleurs clés générées

Vous pouvez générer un jeu de couleurs à l'aide de ces couleurs clés ou utiliser les tons pour les appliquer à votre interface utilisateur.

Exemple d'application de couleurs dynamiques

Accessibilité

Pour en savoir plus sur l'accessibilité, consultez les bonnes pratiques en matière d'accessibilité pour Android TV.