Modèle de grille

Les grilles présentent les éléments sous forme de grille.

Ce modèle est utile lorsque les utilisateurs s'appuient principalement sur des images pour effectuer leurs sélections.

Ce modèle peut être intégré au modèle d'onglet pour permettre une navigation par onglets.

Ce modèle peut être inclus dans le modèle Carte + Contenu pour fournir une grille sur une carte.

Inclut:

  • En-tête facultatif (l'en-tête est remplacé par des tabulations lorsque ce modèle est intégré dans le modèle d'onglet)
  • Éléments de grille (voir la remarque ci-dessous), chacun contenant une icône ou une image de grande taille
  • Texte principal de chaque élément de la grille (facultatif)
  • Texte secondaire pour chaque élément de la grille (facultatif)
  • Bouton d'action flottant facultatif
Maquettes fonctionnelles du modèle de grille

Exemples de modèles de grille

Les exemples Android Auto et Android Automotive OS (AAOS) suivants ont été créés à l'aide du modèle de grille.

Exemple montrant une grille des actions possibles sur une carte
Grille d'actions intégrées dans un modèle Carte + Contenu
Exemple d'affichage des paramètres
Grille avec les éléments activés et un élément désactivé

Exigences de l'expérience utilisateur des modèles de grille

Développeurs d'applications:

DOIT Limitez la longueur des chaînes de texte principales et secondaires pour éviter qu'elles ne soient tronquées.
DOIT Associer une action à chaque élément de la grille (les éléments ne comportant que des informations ne sont pas recommandés).
DOIT Indiquez clairement l'état de l'élément (pour les éléments de grille ayant plusieurs états, tels que ceux sélectionnés et non sélectionnés) en fonction des variantes d'image, d'icône ou de texte.
DOIT Incluez un en-tête avec un titre facultatif et des actions principales et secondaires.
NE DOIT PAS Incluez en même temps une bande d'actions et un bouton d'action flottant.
PEUT Affichez une icône de chargement à la place de l'icône ou de l'image d'un élément de la grille lorsqu'une action associée à l'élément est en cours.