Les modules complémentaires Google Workspace doivent être cohérents avec le style et la mise en page de l'application hôte qu'ils étendent. Ils doivent étendre l'interface utilisateur de manière naturelle en utilisant des commandes et des comportements familiers. Les consignes présentées ici décrivent comment gérer le texte, les images, les commandes et le branding pour offrir une expérience utilisateur de haute qualité.
Si votre module complémentaire ouvre des pages Web distinctes qui font partie intégrante de son fonctionnement (par exemple, une page de paramètres du module complémentaire), assurez-vous que ces pages Web respectent également ces consignes de style.
Texte et images
Cette section vous explique comment utiliser correctement le texte et les images dans votre module complémentaire.
Nom du module complémentaire
Vous devez définir le nom de votre module complémentaire dans son fichier manifeste de projet et lorsque vous configurez votre module complémentaire pour la publication. Ce nom apparaît à de nombreux endroits, comme sur la fiche Google Workspace Marketplace et dans les menus. Lorsque vous choisissez un nom:
- Utilisez la casse de titre.
- Évitez les signes de ponctuation, en particulier les parenthèses, sauf s'ils font partie de votre marque.
- Faites court : 15 caractères maximum. Les noms longs peuvent être tronqués automatiquement dans la fiche Google Workspace Marketplace et ailleurs.
- N'incluez pas les mots "Google", "Gmail" ou d'autres noms de produits Google dans le nom de votre module complémentaire.
- N'incluez pas le mot "module complémentaire" dans le nom de votre module complémentaire.
- Ne pas inclure d'informations sur la version.
Style de rédaction
Vous n'aurez pas besoin d'écrire beaucoup. La plupart des actions doivent être claires grâce à l'iconographie, à la mise en page et aux libellés courts. Si vous constatez qu'une partie de votre module complémentaire nécessite des explications plus détaillées que celles que peuvent fournir de courtes libellés, nous vous recommandons de créer une page Web distincte décrivant votre module complémentaire et d'y ajouter un lien.
Lorsque vous rédigez du texte pour l'interface utilisateur:
- Utilisez la casse de phrase (en particulier pour les boutons, les libellés et les actions de carte).
- Privilégiez un texte court et simple, sans jargon ni acronymes.
Actions universelles et actions sur les fiches
Si vous utilisez des actions universelles ou des actions de carte dans votre module complémentaire, elles apparaissent en tant qu'éléments de menu dans les fiches que vous définissez. Vous pouvez choisir le texte utilisé dans ces menus pour ces actions. Lorsque vous choisissez le texte à utiliser:
- Évitez d'utiliser un texte de menu qui ne fait que répéter le nom de votre module complémentaire.
- Commencez chaque élément de menu par un mot d'action tel que "Exécuter", "Configurer" ou "Créer".
- Décrivez la tâche, et non le composant d'UI que l'action affiche.
- Si votre action lance un workflow et qu'aucun verbe ne décrit ce qu'elle fait, appelez-la "Démarrer".
- Limitez le nombre d'éléments de menu pour éviter de forcer l'utilisateur à faire défiler une longue liste. Si vous avez d'autres actions à implémenter, envisagez d'utiliser plusieurs cartes avec des actions différentes sur chacune d'elles.
Messages d'erreur
En cas de problème, il est important d'utiliser un langage clair. Expliquez le problème du point de vue de l'utilisateur et suggérez comment le résoudre.
- N'autorisez pas l'utilisateur à voir les exceptions générées par votre code. Utilisez plutôt des instructions
try...catch
pour intercepter les exceptions, puis affichez un message d'erreur convivial. - Avant de publier, vérifiez que votre module complémentaire n'affiche pas d'informations de débogage dans l'interface utilisateur.
Les contenus d'aide
Vous pouvez concevoir des cartes qui affichent des informations d'aide ou expliquent le fonctionnement du module complémentaire à l'utilisateur. Si vous créez du contenu d'aide pour votre module complémentaire, n'oubliez pas de:
- Dans la mesure du possible, présentez les instructions sous forme de liste à puces ou numérotée. Guidez les utilisateurs jusqu'au résultat final, en faisant référence claire aux éléments d'interface utilisateur nommés.
- Assurez-vous que vos instructions expliquent clairement les exigences, comme la configuration d'une feuille de calcul d'une certaine manière.
- N'hésitez pas à ajouter des liens vers des contenus d'aide externes, comme des pages Web d'aide.
Images
Les images utilisées dans votre module complémentaire sont l'un des types d'icônes intégrés ou une image hébergée publiquement spécifiée par une URL. Lorsque vous utilisez des images hébergées, assurez-vous qu'elles sont accessibles à tous ceux qui peuvent utiliser votre module complémentaire.
Commandes
Cette section fournit des consignes sur l'expérience utilisateur pour les widgets interactifs.
Boutons
Utilisez des boutons pour contrôler les actions principales de votre interface utilisateur plutôt que d'autres widgets.
- La plupart des libellés de boutons textuels doivent commencer par un verbe.
- Dans la plupart des cas, les lignes de boutons doivent être limitées à trois boutons ou moins.
DecoratedText
Les widgets DecoratedText vous permettent de présenter du contenu textuel avec des icônes, des boutons ou des boutons d'activation/de désactivation.
- Utilisez la casse de début de phrase pour le contenu textuel.
- Le texte d'un widget DecoratedText est tronqué s'il ne peut pas tenir dans l'espace disponible. C'est pourquoi nous vous recommandons de toujours essayer de réduire le contenu textuel au maximum.
Entrées de sélection
Vous pouvez utiliser différents widgets de saisie de sélection dans votre module complémentaire: des listes déroulantes, des cases à cocher et des boutons d'option.
- Utilisez des cases à cocher lorsque les utilisateurs peuvent sélectionner plusieurs options ou aucune. Utilisez des cases d'option (ou un menu de sélection) lorsqu'une seule option doit être sélectionnée. Utilisez des listes déroulantes lorsque vous fournissez une courte liste d'options tout en essayant de gagner de l'espace dans l'interface utilisateur.
- Utilisez la casse de début de phrase pour le texte attribué à chaque option.
- Évitez d'utiliser des modifications de sélection pour déclencher des actions majeures et difficiles à annuler, car les utilisateurs font souvent des erreurs lorsqu'ils effectuent des sélections. Envisagez plutôt d'ajouter un bouton qui lit les valeurs de sélection actuelles, puis déclenche l'action.
- Pour les menus déroulants, triez les options par ordre alphabétique ou selon un schéma logique que tous les utilisateurs peuvent comprendre (par exemple, en présentant les jours de la semaine dans l'ordre, en commençant par dimanche ou lundi).
- Limitez le nombre d'options dans un widget de saisie de sélection donné à un nombre raisonnable. Si le nombre d'options est trop élevé, les utilisateurs peuvent avoir du mal à utiliser le widget. Dans ce cas, envisagez de diviser l'option en différentes catégories et en plusieurs widgets.
Saisies de texte
Les entrées de texte permettent aux utilisateurs de saisir des données de chaîne.
- N'utilisez pas de saisie de texte pour demander à l'utilisateur de saisir l'une d'un ensemble spécifique d'entrées possibles. Utilisez plutôt un menu déroulant.
- Utilisez des indices et des suggestions pour aider l'utilisateur à saisir du texte avec le format et le contenu appropriés.
- Utilisez des zones de saisie de texte multilignes si le texte à saisir comporte plus de quelques mots.
Branding
Cette section fournit des consignes sur l'expérience utilisateur pour ajouter des éléments de branding à l'interface de votre module complémentaire.
Dans votre module complémentaire
Si vous souhaitez inclure votre marque dans l'interface utilisateur de votre module complémentaire, faites-le de manière concise et légère. Cela permet aux utilisateurs de se concentrer sur les fonctionnalités de votre module complémentaire.
- Tous les aspects de votre module complémentaire doivent respecter les consignes relatives au branding.
- N'incluez pas les mots "Google", "Gmail" ou d'autres noms de produits Google.
- N'incluez pas d'icônes de produits Google, même si elles sont modifiées.
- N'incluez pas le mot "module complémentaire" dans votre texte de branding.
- Le texte de branding ne doit pas comporter plus de quelques mots.
Dans Google Workspace Marketplace
Lorsque vous configurez votre module complémentaire pour la publication, vous fournissez un certain nombre d'assets graphiques et textuels pour créer la fiche Google Workspace Marketplace.
Tous les aspects de votre fiche Play Store et de ces assets doivent respecter les consignes relatives au branding.