La manière dont votre application communique avec ses utilisateurs est un critère fondamental de son utilisabilité. Pas de messages système, des textes abscons ou omniprésents rendent une application inconfortable et augmentent les risques d’erreurs ou d’anxiété.

Le problème des messages système, c’est qu’on a tendance soit à les oublier, soit à en faire trop. Je suis persuadé que vous n’avez jamais réellement réfléchi de manière à la fois globale et détaillée aux messages que vous servez à vos utilisateurs et à leur impact sur leurs conditions d’utilisation de votre service. Ces messages sont pourtant essentiels à une bonne prise en main et une bonne compréhension de votre application, ce qui les rend bien plus sensibles que vous pourriez le penser.

Il faut dire que ces messages n’ont rien de folichon, ni dans leur affichage, ni dans leur rédaction, et que l’on considère facilement que le simple changement des informations à l’écran se suffit à lui-même, quand on y pense. Il vous faut au contraire créer une cartographie de votre application afin de valider la présence – ou l’absence – desdits messages, les informations transmises, et leurs impacts possibles sur vos utilisateurs.

Les messages d’aide : différents formats pour des informations variées

Votre application a différentes manières de communiquer avec vous, en fonction du contexte général et de vos actions. Sans chercher à être exhaustifs, vous pouvez d’ors et déjà répertorier trois types de messages.

Les messages d’aide générale

Ce sont les messages d’accueil spécifiques à un écran de votre application. Ils rappellent à vos utilisateurs ce qu’ils vont y trouver, et ce qu’ils pourront y faire. Mis en valeur graphiquement, ils sont généralement désactivables par l’utilisateur une fois que celui-ci en a pris connaissance.

Utilisez-les avec parcimonie, ils ne doivent pas submerger vos utilisateurs mais leur donner un aperçu de ce qu’ils peuvent faire uniquement si ce n’est pas évident du premier coup d’oeil.

Sur Twitter, ils servent à mettre en avant une fonctionnalité particulière récemment modifiée.

Aide globale sur Twitter sur le nouveau Retweet

Ne les considérez pas non-plus comme une bonne alternative à la simplification de votre application. Il est aisé de construire une usine à gaz inutilisable, puis d’afficher de grands panneaux expliquant comment s’en servir. Personne ne les lira, et les utilisateurs fuiront votre produit.

Les messages d’aide contextuelle et les infobulles

Comme leur nom l’indique, les messages d’aide contextuelle servent à aider l’utilisateur sur telle ou telle fonctionnalité précise de l’application dans son contexte. Merci Captain Obvious.

Une manière intéressante de les utiliser est de les positionner sur des emplacements vides car l’utilisateur n’a pas encore utilisé la fonctionnalité.

Twitter affiche l’explication de ce que sont les listes à l’endroit où elles se trouveraient si vous en aviez créé une. Dès la première liste créée, l’aide disparait.

L'aide des listes sur Twitter

Les infobulles, ou tooltips donnent des détails sur une fonctionnalité spécifique ou une partie spécifique de l’interface dans son contexte. Leur affichage est activé par un clic sur une icône significative, par exemple un point d’interrogation.

Google Docs fait une utilisation intelligente de l’infobulle afin de mettre en avant une nouvelle fonctionnalité. L’infobulle est affichée dès le chargement de la page et ne s’affiche plus une fois fermée.

Tooltip Google docs

Les messages d’informations : pensez global, agissez localement

En théorie, une application bien conçue devrait afficher un message chaque fois que l’utilisateur modifie des données, court un risque d’en détruire, ou qu’une erreur se produit, qu’elle vienne du produit ou de lui. En pratique, c’est très loin d’être le cas, souvent par paresse, par oublie, ou parce que la modification semble évidente.

Les messages de confirmation

S’ils doivent être visibles, les messages confirmant la réussite d’une action ne doivent pas être intrusifs, afin de ne pas gêner l’utilisateur ou lui laisser croire qu’une erreur a pu se produire. Si messages ne sont qu’informatifs, ils sont néanmoins indispensables. Comment savoir que mon action a réussi si je change simplement d’écran sans personne pour me le dire ? Les choses sont encore pires quand les données sont envoyées de manière asynchrone, sans rechargement de la page. Sans message de confirmation, l’utilisateur n’a aucun moyen de savoir que quelque chose s’est passé, en bien ou en mal.

Visuellement, tachez de positionner vos messages de confirmation toujours au même endroit. Cela vous forcera à maintenir la cohérence de votre interface, ce qui est bien, tout en ne forçant pas vos utilisateurs à chercher, ce qui est encore mieux. Vous pouvez utiliser le classique triptyque vert / orange / rouge, avec ou sans icônes, mais cela ne suffit pas. Rappelez-vous que beaucoup de gens ont des problèmes de vision ou de distinction des couleurs.

Twitter – encore lui – positionne tous ses messages d’information en haut de page, sur un bandeau qui vient se positionner par dessus l’en-tête de la page, sans distinction visuelle entre les messages de confirmation ou d’erreur. Le texte du message est, lui, sans équivoque, et les erreurs sont redescendues localement.

Message de confirmation Twitter

Avertissez les utilisateurs avant qu’ils ne fassent des bêtises

Si les messages de confirmation et d’information ne doivent pas gêner la progression de l’utilisateur, il n’en est pas de même des messages d’avertissement. Placés chaque fois que l’utilisateur risque de détruire ou d’altérer des données de manière irréparables, leur but est non solum de les en prévenir, sed etiam de leur permettre de revenir en arrière.

Positionnez donc un tel message derrière chaque bouton supprimer de votre application, même si ce n’est pas suffisant. Votre utilisateur doit les trouver chaque fois qu’il se trouve confronté à une situation après laquelle il ne pourra plus revenir en arrière : supprimer, quitter sans sauvegarde préalable…

Une utilisation classique de ce genre de messages se trouve sur la fonction Vider la corbeille de votre ordinateur. La corbeille a permis de rendre le processus de suppression des fichiers non intrusifs tout en offrant à l’utilisateur un garde fou que ne lui permettait pas la ligne de commande, en déplaçant le message de confirmation de suppression des fichiers au moment d’une suppression de masse au lieu de le faire au cas par cas.

Vider le contenu de la corbeille

Les messages d’erreur, une source d’anxiété permanente

Qu’ils soient déclenchés par une erreur de manipulation ou par une erreur système, les messages d’erreur sont toujours source d’anxiété pour les utilisateurs qui se demandera toujours si l’erreur vient de lui ou de la machine. Si vous avez déjà fait un peu de support utilisateurs, vous aurez certainement constaté que ces derniers mettent d’abord le programme en cause, avant d’en admettre une éventuelle mauvaise utilisation.

Les pages d’erreur

Le fameux Blue Screen Of Death de Microsoft Windows est l’exemple typique du message d’erreur ultra anxiogène… dans presque toutes les situations.

BSOD

Imposé aux utilisateurs. Incompréhensible par un utilisateur final, il lui est totalement inutile puisqu’il ne lui dit pas ce qu’il faut faire dans un langage clair et adapté.

Les pages d’erreur peuvent vous êtres d’une grande aide pour résoudre les problèmes liés à votre application sans effrayer vos utilisateurs. Créez des pages simples, contenant un message clair. Dissimulez les informations techniques dans un coin de la page, l’utilisateur n’a pas besoin de les voir, mais affichez les quelque part afin d’en disposer sur une simple capture d’écran : type d’erreur, date, heure, et URI.

Les erreurs suite à une mauvaise manipulation utilisateur

L’utilisateur est humain, donc faillible. L’erreur la plus couramment rencontrée est celle des champs de formulaires obligatoires invalides ou non remplis.

Quand c’est le cas, mettez chaque champ posant problème en valeur à l’aide d’un code de couleur et d’un message approprié. L’utilisateur s’y retrouvera immédiatement. Signalez également en haut de page qu’une erreur s’est produite, surtout sur les longs formulaires. En effet, à moins de scroller, difficile de comprendre pourquoi je reste sur la même page.

Erreur formulaire gmail

N’affichez pas les messages d’erreur généraux avec les mêmes codes couleur ou graphiques que vos messages de confirmation. Vous courrez le risque de voir votre utilisateur zapper votre message d’erreur puisqu’il ressemble à votre message de présentation.

De ce côté là, Twitter pêche par sa volonté de simplicité, puisque les messages d’erreur sont visuellement les mêmes que les messages de confirmation, et que les champs en erreur ne sont pas mis en valeur dans le formulaire.

Erreur sur Twitter

Et voilà, c’est terminé pour cette fois. Il ne vous reste plus qu’à vous mettre en quête des messages d’erreur manquants dans votre application. Armé d’un tableau, notez chacune des URL, et pour chacune d’elle, rédigez un message adapté. En retenant toujours une chose : simple et concis (pas comme cet article).

Perry the Platypus wants you to subscribe now! Even if you don't visit my site on a regular basis, you can get the latest posts delivered to you for free via Email: