Transitions

Les transitions permettent de passer aisément d'un état à un autre.

Quand utiliser cette composante

• Lors de l'utilisation d'un ensemble de données avec une grande variété d'options.
• Pour raconter une histoire avec les données (par exemple, en passant de différents graphiques à barres à un graphique à barres empilées pour mettre en valeur le total)
• Pour impliquer l'utilisateur dans la manipulation des données.

Quoi éviter

• Éviter les longues transitions.
• Les transitions complexes ou confuses peuvent détourner les utilisateurs de l'histoire.

Design et code

Exemple 1 : des barres verticales aux barres empilées

Exemple 2 : des chemins sur une carte à des barres horizontales

Lignes directrices sur le contenu et le design

• Rendez la transition suffisamment marquante pour que les utilisateurs remarquent le changement, mais pas trop pour ne pas les déconcerter.
• Visez des transitions d'une durée d'environ 500 millisecondes.
• Suivez les lignes directrices générales sur le design.

Lignes directrices sur l'accessibilité

• Assurez-vous que les transitions peuvent être effectuées sans souris.
• Si la transition raconte une histoire claire, incluez cette histoire à un autre endroit de façon textuelle.
• Suivez les lignes directrices générales sur l'accessibilité.