Un élément d’une page peut avoir différents états en fonction de l’avancé du parcours utilisateur.
Aujourd’hui une action n’amène pas forcément vers une page différente, mais elle peut actionner un certain nombre d’éléments d’une interface.
Les différents états d'une interface Cliquez pour tweeter
Lors du parcours de l’utilisateur sur un site, il va devoir franchir différentes étapes et interagir à plusieurs reprises afin d’arriver à son but. On peut alors constater des étapes récurrentes qui façonnent la plupart des sites web.
Etat initial
Le premier état qui va introduire le parcours de l’utilisateur, c’est la première impression qu’aura l’utilisateur d’une interface. Souvent utilisé pour servir de tutoriel d’introduction, l’état initial n’est pas obligatoire mais souvent bénéfique dans la poursuite de l’utilisateur dans sa découverte de l’interface.
Etat vide
L’état vide est souvent oublié, pourtant c’est le premier état que va voir l’utilisateur durant son parcours. Que ce soit pour un formulaire ou pour une liste d’items à remplir, il faut toujours prévoir un état vide qui va guider et/ou informer l’utilisateur de la future présence d’éléments.
Etat actif
Lorsque l’action est en cours d’exécution, que l’utilisateur a déclenché une interaction qui lui impose d’interagir, durant cette interaction il met alors un élément un état actif. Cet état est aussi valable lorsque le parcours implique une complétion et/ou un ajout d’éléments.
Etat correct
Si l’utilisateur va dans la mauvaise direction, il faut lui indiquer, car il n’y a rien de pire que de faire marche arrière lorsqu’on avance tranquillement dans son parcours. L’état correct permet de rassurer et d’inciter l’utilisateur dans ses actions. Cela réconforte les choix que l’utilisateur prend et plus vite l’état correct sera affiché, plus tôt l’utilisateur se sentira rassuré de ne pas avancer dans le vide.
Etat Incorrect
Encore plus important que l’état correct, l’état incorrect est indispensable lors d’interaction qui demande une vérification des données. Lors d’une utilisation de fonctionnalités diverses, l’état incorrect doit être au maximum justifié afin d’expliquer à l’utilisateur la source de son erreur.
Tâche répétitive
Une interface a souvent des actions qui se répètent (une liste, une galerie, la multi-sélection) ainsi il faut absolument montrer une différence et la validité de l’action en comparaison aux autres éléments pas encore sélectionnés.
Tâche en cours
Une action/validation entraîne une requête aux serveurs qui va entraîner à son tour un chargement, inévitable, cette phase de chargement doit être explicite et évidente pour l’utilisateur. Que ce soit pour rafraîchir le contenu d’une page, envoyer un formulaire ou télécharger un document, il faut afficher cet état transitoire afin de faire patienter l’utilisateur. Sans, l’utilisateur n’aura aucune information de l’état actuel du système et il peut quitter son parcours alors que le chargement est en cours …
Tâche accomplie
Pour finir, il faut confirmer les actions faites par l’utilisateur, comme une récompense d’une interaction réussie, l’accomplissement d’une tâche doit être explicite bien que parfois évidente.
Source : Medium
Couverture : Bady
No Comments