Contrairement aux interfaces tactiles, la télévision s'appuie fortement sur différents états principaux (par défaut, ciblé, appuyé) pour attirer l'attention de l'utilisateur sur l'élément ciblé. Il sert de point de départ pour la navigation.
Sélection
- Un système de sélection se compose de sections d'éléments sélectionnables.
- Les indicateurs de concentration sont des dispositifs visuels qui mettent l'accent sur les éléments ciblés.
- Indication d'échelle ajuste un élément selon le facteur x lorsqu'il est sélectionné ou sélectionné.
- Bien que la couleur d'arrière-plan soit statique, la couleur de la surface peut changer lorsque la mise au point est effectuée.
Objet
L'accent est mis sur la définition principale de la conception d'une télévision. La navigation est limitée aux interactions du pavé directionnel disponibles sur la télécommande. Les utilisateurs peuvent se déplacer à l'aide des touches fléchées, du bouton central pour effectuer une sélection et de la touche Retour pour revenir en arrière. La télécommande permet aux utilisateurs de passer par une interaction à la fois. Le changement d'état d'un élément est représenté à l'aide d'indicateurs de sélection pour aider l'utilisateur à visualiser.
Éléments et groupes sélectionnables
Les éléments sélectionnables font partie intégrante de l'interface du téléviseur. Les "éléments sélectionnables" peuvent être n'importe quel composant, tel que des boutons, des fiches, des éléments de liste ou une surface définie personnalisée. Les utilisateurs doivent pouvoir se concentrer sur un seul élément sélectionnable à tout moment.
Les "groupes sélectionnables", quant à eux, contiennent un ou plusieurs "éléments sélectionnables". Il peut y avoir n'importe quel nombre de "groupes sélectionnables" imbriqués. Les groupes sélectionnables sont utilisés pour regrouper de manière logique différents éléments sélectionnables pour une navigation conviviale.
Indicateurs de mise au point
Les indicateurs de concentration sont une visualisation distincte d'un élément ciblé. Lorsqu'un élément est sélectionné, il passe à l'état "enclenché" jusqu'à ce que le bouton distant soit relâché.
Chaque état d'un élément sélectionnable est configuré en ajustant les propriétés suivantes:
- Échelle : modifiez la taille d'un élément sélectionné.
- Bordure : dessinez un contour autour de l'élément.
- Halo : crée une ombre sous un élément (généralement utilisé sur les cartes).
- Couleurs : modifiez l'arrière-plan et la couleur du contenu de l'élément.
Indication de l'échelle
Met l'élément à l'échelle lorsqu'il est sélectionné ou sélectionné. Les valeurs de scaling par défaut sont: 1,025, 1,05 et 1,1x. Utilisez cette indication pour obtenir des commentaires clairs sur la navigation. Les valeurs de scaling des différents éléments peuvent varier en fonction de leur taille.
Indication de l'éclat
Ajoute un halo ou une ombre diffuse autour de l'élément. L'indication de halo prend les paramètres suivants:
- Niveau d'éclat: suggère une élévation de l'élément, allant de 2 dp à 32 dp
- Couleur du halo: peut être spécifiée en fonction de la couleur de l'image ou de la marque
Indication du contour
Ajoute un contour autour de l'élément indépendamment de la bordure. L'indication du plan utilise les paramètres suivants:
- Largeur du contour: forme en dehors de l'élément
- Encart avec contour: espacement entre l'élément et son contour
- Couleur du contour: peut être spécifiée en fonction de la couleur de l'image ou de la marque \
Indication de couleur
Les éléments peuvent changer d'état en s'adaptant aux couleurs. L'indication de couleur utilise les paramètres suivants:
- Couleur de l'arrière-plan: modifie la couleur de la surface d'un élément.
- Couleur du contenu: modifie la couleur du contenu sur une surface.
Élévation tonale
Bien que la couleur d'arrière-plan soit statique, la couleur de la surface peut changer. Les surfaces aux niveaux d'altitude +1 à +5 sont teintées via des superpositions de couleurs basées sur la couleur principale. Cela introduit une variation tonale de la surface de référence.
Les surfaces tonales présentent de nombreux avantages:
- Créer l'effet d'élévation pour différencier les différents éléments et textes
- Établir un contraste pour les avantages en matière d'accessibilité
- Créer un engagement visuel et adoucir les transitions entre les éléments interactifs
Désactivé
Dans le cas contraire, la couleur et l'opacité de l'arrière-plan affichent une proéminence plus faible pour indiquer que l'objet n'est pas cliquable.
cas d'utilisation
Un élément sélectionnable présente les trois états principaux: par défaut, sélectionné et appuyé, avec des états supplémentaires: activé, désactivé et sélectionné, formant une matrice.
dans vos fiches ;
Par défaut | Allez à l'essentiel | Appuyé | |
---|---|---|---|
Activé |
Boutons
Par défaut | Allez à l'essentiel | Appuyé | |
---|---|---|---|
Activé | |||
Désactivé |
Chips
Par défaut | Allez à l'essentiel | Appuyé | |
---|---|---|---|
Activé | |||
Activé + Sélectionné | |||
Désactivé | |||
Désactivés + sélectionnés |