Ce guide de style se concentre sur la création de notifications et de messages de toast pour l’interface utilisateur d’un produit. Ces éléments jouent un rôle crucial dans la communication des actions clés, des statuts et des résultats aux utilisateurs. Une notification bien écrite ou un message de fin de vie améliore l’expérience utilisateur en apportant clarté, conseils et informations exploitables.
Principes fondamentaux
| Principe | Ce que cela signifie |
|---|---|
| La clarté d’abord | Écrivez des messages courts et directs qui traduisent immédiatement votre but. Évitez le jargon technique ou le langage complexe. |
| Régularité | Utilisez le même ton, la même mise en forme et la même structure dans toutes les notifications. Suivez le même vocabulaire pour les actions répétées (par exemple, « sauvegardé », « mis à jour », « échoué »). |
| Pertinence | Adaptez les messages au contexte de l’action. N’affichez que les messages qui ont un sens pour le flux de travail de l’utilisateur. |
| Orienté action | Utilisez des verbes pour indiquer le résultat de l’action ou les prochaines étapes. Assurez-vous que les utilisateurs savent quoi faire ensuite si d’autres mesures sont nécessaires. |
Types de notifications
Notifications de succès
Confirmez qu’une action a été réalisée avec succès (par exemple, téléchargement de fichiers, sauvegarde des réglages, contenu publié).
- « Les changements ont été sauvegardés avec succès. »
- « L’article a été publié. »
Notifications d’erreur
Informez les utilisateurs des échecs ou des erreurs système. Expliquez clairement ce qui a mal tourné et fournissez des conseils pour résoudre le problème.
- « Échec de téléverser le fichier. Assurez-vous qu’il respecte la limite de taille. »
- « Importation de domaine échouée. Vérifie le format du fichier et essaie à nouveau. »
Notifications d’avertissement
Alertez les utilisateurs des problèmes ou risques potentiels avant qu’ils ne procédent. Aidez les utilisateurs à éviter des erreurs irréversibles.
- « Tu es sur le point de supprimer une catégorie. Cette action ne peut être annulée. »
Notifications informatives
Fournir des mises à jour non urgentes ou des informations générales (par exemple, mises à jour de fonctionnalités, annonces, confirmations de sauvegarde automatique).
- « Tes modifications sont sauvegardées automatiquement. »
Note : La limite de caractères pour les notifications intégrées à l’application est de 80, espace blanc compris.
Toast Messages
Définition : Les messages toast sont de courtes notifications éphémères qui apparaissent brièvement dans un coin de l’interface. Ils sont généralement utilisés pour des mises à jour non critiques.
Bonnes pratiques
| Directives | Que faire |
|---|---|
| Faites court | Limitez les messages à 1 à 2 phrases. |
| Utilise le présent | Décrivez l’action ou le résultat de manière concise au présent. |
| Évitez la surcharge | N’incluez que les informations essentielles. Ne surchargez pas le message avec trop d’informations. |
| Rejet automatique | Les messages de fin devraient disparaître après quelques secondes, sauf si l’action est critique et nécessite une reconnaissance de l’utilisateur. |
Exemples
- « Article sauvegardé en brouillon. »
- « 1 fichier téléchargé avec succès. »
- « Commentaire supprimé. »
À faire et à éviter
| Do | Ne le fais pas |
|---|---|
| Utilisez un langage clair et concis. | Écrivez des messages longs ou trop détaillés. |
| Expliquez ce qui s’est passé ou ce qui vient ensuite. | Laissez les utilisateurs dans le doute quant au résultat. |
| Adoptez un ton amical et conversationnel. | Ça sonne robotique ou trop formel. |
| Adapter le message à l’action effectuée. | Utilisez des messages génériques ou sans importance. |
Directives de mise en forme
| Directives | Exemple |
|---|---|
| Commencez par le résultat ou l’action | « L’article a été archivé avec succès. » |
| Cas de phrase d’utilisation | Mettez en majuscules uniquement le premier mot et les noms propres. |
| Évitez la ponctuation excessive | Utilisez un seul point à la fin. Évitez les points d’exclamation sauf pour célébrer le succès. |
| Utilisez les nombres pour la précision | « 3 fichiers téléchargés avec succès. » |
Notifications courantes et messages de fin
Messages de réussite
- « Paramètres mis à jour avec succès. »
- « 2 utilisateurs importés avec succès. »
- « Lien de réinitialisation du mot de passe envoyé à votre e-mail. »
Messages d’erreur
- « Impossible de sauvegarder les changements. Veuillez réessayer. »
- « Ce nom de catégorie existe déjà. Choisis un autre nom. »
- « Échec à publier l’article. Vérifie ta connexion internet. »
Messages d’avertissement
- « Tu as des modifications non enregistrées. Tu veux partir sans sauver ? »
- « Supprimer cette catégorie supprimera également ses sous-catégories et articles. »
Messages d’information
- « Brouillon enregistré automatiquement à 10h35. »
- « Vous avez un accès limité à cette page. »
Liste de contrôle pour rédiger des notifications et des messages de fin de vie
- Le message est-il clair et concis ?
- Est-ce que cela explique le résultat ou les prochaines étapes ?
- Est-ce spécifique à l’action de l’utilisateur ?
- Est-ce que cela suit le ton et les directives de style ?
- Est-ce dépourvu de jargon technique ?