Niveaux de qualité des widgets

Les widgets sont un élément essentiel pour personnaliser l'écran d'accueil d'un utilisateur. Ils peuvent souvent aider les utilisateurs à effectuer un parcours utilisateur essentiel pour une application en un seul geste ou à fournir un résumé rapide des données les plus importantes d'une application. Ils peuvent également être personnalisés en fonction des besoins de l'utilisateur et de ses préférences individuelles.

La qualité d'un widget peut avoir un impact sur l'engagement des utilisateurs avec le contenu et les fonctionnalités de votre application. Il existe trois niveaux principaux de qualité des widgets:

  • Niveau 3: qualité faible – ne répondent pas au critère de qualité minimal et n'offrent pas une expérience utilisateur de qualité.
  • Niveau 2 : norme de qualité : utile, utilisable et offrant une expérience de qualité.
  • Niveau 1 : Différencié : widgets exemplaires offrant des expériences personnalisées et des héros, et aidant les utilisateurs à créer des écrans d'accueil uniques et productifs.

Niveau 3: basse qualité

Un widget est considéré comme de mauvaise qualité s'il ne respecte pas les critères standards de mise en page, de couleur, de découverte et de contenu. Pour en savoir plus sur la création d'un widget de haute qualité conforme aux bonnes pratiques, consultez les consignes suivantes.

Niveau 2 : qualité standard

Pour être considéré comme de bonne qualité, le widget doit répondre à tous les critères suivants concernant la mise en page, la couleur, la découverte et le contenu:

Mise en page

  • Le widget doit remplir les limites définies par la grille du lanceur d'applications lorsqu'il est placé sur l'écran d'accueil. Le widget peut être redimensionné dans l'une des tailles suivantes : 2 x 2, 4 x 2 (cellules de la grille du lanceur d'applications). Pour en savoir plus, consultez les consignes de dimensionnement.
    • Le widget doit s'aligner correctement sur les autres éléments de l'écran d'accueil sur l'axe vertical ou horizontal, et ne pas occuper d'espace inutile.
    • Le widget doit toucher au moins deux bords opposés de la grille. Autrement dit, les widgets n'ont pas besoin d'être rectangulaires. Ils peuvent avoir des formes personnalisées, à condition que les bords de la forme touchent au moins deux bords de la grille.
  • Si les widgets sont redimensionnables, ils doivent avoir une taille minimale ou maximale appropriée, qui peut être définie avec minWidth, minHeight, maxResizeWidth et maxResizeHeight dans le fichier XML AppWidgetProviderInfo.
    • La taille maximale doit être définie si redimensionner le widget n'ajoute que de l'espace vide.
    • La taille minimale doit être définie en fonction de la taille minimale de votre widget qui offre toujours de la valeur et répond aux exigences concernant les zones cibles tactiles (48 x 48).

À faire

Fournissez des zones cibles tactiles de 48 x 48 dp.

À éviter

Les zones cibles tactiles sont trop petites.

Couleur

  • Le texte et les boutons d'icône du widget doivent présenter des ratios de contraste suffisants pour répondre aux exigences d'accessibilité (exclut les miniatures et les images).

À faire

Assurez-vous que le contraste des couleurs est suffisant.

À éviter

Utiliser des couleurs dont le contraste est insuffisant

Découverte

  • Les widgets doivent comporter des aperçus précis dans le sélecteur de widgets. Cela peut être défini avec previewImage et previewLayout dans le fichier XML AppWidgetProviderInfo ou avec les aperçus générés.

    • L'aperçu du widget est cohérent avec les fonctionnalités proposées lorsqu'il est ajouté à l'écran d'accueil.
    Vidéo 1 : le widget présente un aperçu inexact.

Contenu

  • Le contenu des widgets ne doit pas être obsolète ou inopportun de manière systématique.
    • Le widget doit se mettre à jour une fois que l'utilisateur a effectué une action à partir de celui-ci.
    • Le widget doit être mis à jour après que l'utilisateur a effectué une action associée dans l'application.
  • Le widget doit permettre aux utilisateurs d'actualiser manuellement le contenu, si l'on s'attend à ce que les données soient actualisées plus fréquemment que l'UI.
  • L'UI du widget doit être fonctionnelle ou le contenu doit être recadré.
  • Les états nuls et vides du widget doivent être intentionnels et doivent afficher la valeur du widget ou fournir un appel à l'action lorsque le widget est installé, mais que l'utilisateur n'est pas encore connecté.
discovery_tier2
Figure 2 Widget avec un état vide intéressant.
discovery_tier2
Figure 3 Widget avec bouton d'actualisation.

Niveau 1 - Différencié

Les meilleurs widgets répondent à tous les critères de niveau 2 et à tous les critères de mise en page, de couleur, de découverte et de cohérence du système suivants.

Mise en page

  • Le widget remplit les limites et s'aligne correctement sur les autres éléments de l'écran d'accueil sur l'axe vertical ou horizontal, et n'occupe pas d'espace inutile.
    • Toutes les formes DOIVENT toucher les quatre bords des limites de la grille.

À faire

Faites en sorte que le widget se développe sur les 4 bords des limites de la grille.

À éviter

Créez une taille personnalisée qui ne remplit pas les limites de la grille.

  • Le widget est compatible avec une taille préférée

    • Le widget peut être redimensionné dans au moins l'une des tailles suivantes : 2 x 2, 4 x 2

  • L'en-tête du widget est utilisé et appliqué de manière cohérente

    • Nous vous recommandons d'utiliser un en-tête dans les cas suivants :
      • Vous souhaitez fournir des liens profonds vers certaines fonctionnalités de l'application, comme la recherche.
      • Vous souhaitez appliquer une icône de branding d'application qui sert également de lien cohérent vers l'application en cas de pression.
      • Le widget contient du contenu à faire défiler (liste, grille, etc.)
      • Le contenu de l'en-tête fournit un contexte utile (nom de la liste de tâches)
    • L'en-tête est facultatif dans les cas suivants :
      • Le widget est une image à fond perdu (Photos)
      • L'espace est limité (< 2 lignes de haut)
      • Lorsque le contenu de l'en-tête est redondant
    • Si vous utilisez un en-tête, respectez nos spécifications :
      • Icône, titre, actions.
        • L'icône est toujours présente
        • Le titre s'affiche lorsque l'espace disponible est suffisant
        • Actions basées sur le contexte du widget.
      • Hauteur : 48 dp, Rembourrage : 14 dp

À faire

Fournissez un en-tête conforme aux spécifications du widget.

À éviter

Utilisez des spécifications personnalisées pour la taille et les titres.

Couleur

  • Le widget est compatible avec la palette de couleurs basée sur la thématisation du système, la couleur du contenu ou la couleur de la marque.
Widgets affichant une thématisation dynamique
Figure 4. Widgets avec des couleurs dynamiques du fond d'écran et des couleurs de thème associées à la marque.

Découverte

Widgets avec des aperçus génériques et des contenus utilisateur
Figure 5 Widgets avec du contenu d'aperçu générique et du contenu d'aperçu créé par l'utilisateur
  • Le widget a un nom ou une description qui aide les utilisateurs à comprendre sa valeur.
    • Le nom comporte moins de 50 caractères.
    • Le nom et la description sont uniques au sein de l'application. Par exemple, l'application ne peut pas avoir plusieurs widgets portant le même nom.

À faire

Incluez une description succincte.

À éviter

Fournissez une description générique.

Cohérence du système

  • Les widgets rectangulaires doivent utiliser le rayon des coins fourni par le système (spécifique à l'OEM)

À faire

Utilisez l'arrondi d'angle du système.

À éviter

Définissez un rayon de coin personnalisé.
Widgets avec différents états de chargement
Figure 6 Widgets avec indicateur de chargement et état de chargement personnalisé.
  • Utilise la configuration du système au lieu d'un point d'entrée de paramètres de widget personnalisé
  • Utilise la transition de lancement du système lorsque vous accédez ou quittez une application pour un widget

Tenez compte des conseils fournis dans ce guide lorsque vous créez votre widget. Vous souhaitez offrir la meilleure qualité et une expérience utilisateur optimale. De nombreuses barres de qualité peuvent être atteintes avec les mises en page canoniques. Pour en savoir plus sur les barres de qualité, les concepteurs se reporteront aux modèles de widgets Android, et les développeurs à consulter les exemples de code de mise en page dans nos exemples de plate-forme et le guide du développeur pour les mises en page.