L’importance des micro-interactions


Brand Content, User Experience

Les micro-interactions,  nous y sommes confrontés chaque jour de manière plus ou moins subtile dans nos différents parcours utilisateurs, que ce soit sur un site internet ou une application mobile. Concrètement, nous allons nous attarder sur toutes ces animations interactives qui permettent de rendre plus humaines les différentes interfaces auxquelles nous sommes confrontées chaque jour. Ce sont elles qui vont grandement aider à transmettre des émotions et fluidifier le langage entre l’interface et l’utilisateur.

Le fonctionnement des micro-interactions

Les micro-interactions s’adaptent aux attentes de l’utilisateur.

Elles sont pensées et développées dans le seul but de guider l’utilisateur.

C’est pourquoi une bonne animation se devra de :

  • s’adapter
  • être visible
  • informer
  • être répétable

switch  L’importance des micro interactions

Une micro-interaction verra son processus se diviser en 4 étapes distinctes :

Le TRIGGER

qu’on pourra traduire comme le déclencheur.

Il peut donc être manuel ou venir directement du système.

Les RULES

qui représentent l’ensemble des règles déterminant le comportement de la micro-interaction.

Suite à l’activation du TRIGGER, il faudra donc envisager tous les scenarii possibles pour conforter l’expérience utilisateur et, pourquoi pas, le surprendre.

Le FEEDBACK

L’utilisateur reçoit ici un retour de la micro-interaction. Le système fait savoir à l’utilisateur qu’il a compris sa demande et réagit. L’expression de ce feedback peut prendre plusieurs formes en fonction du contexte : pop-up, vibrations, sons, etc.

Les LOOPS

Ce sont les boucles qui vont faire varier les micro-interactions. Elles comprennent l’ensemble des variables qui incluent la durée, la répétition et l’évolution dans le temps.

Personnalisation et attractivité

Beaucoup de principes de micro-interactions sont d’ores et déjà adoptés par les utilisateurs.

Certains proviennent des nouvelles contraintes issues de l’émergence de la mobilité. Un espace réduit nécessite peu d’icônes : ces dernières doivent donc s’adapter, disparaitre ou se transformer en fonction des actions de l’utilisateur.

burger L’importance des micro interactions

Il est donc important de se baser sur l’existant et de personnaliser ce dernier par rapport au profil utilisateur du dispositif créé. Les habitudes de navigation de votre cible ne doivent pas être oubliées. La refonte d’une application mobile par exemple devra se faire en partant de ce postulat. Un changement du tout au tout impactera ces habitudes et requerra une attention toute particulière aux micro-interactions qui aideront grandement les utilisateurs à se familiariser rapidement avec la nouvelle interface posée.

menu L’importance des micro interactions

Les micro-interactions apportent une dimension humaine aux interfaces.

Reflet des choix esthétiques d’un designer en réponse à une cible, un même besoin pourra se traduire de nombreuses manières en fonction du contexte fixé. Même si elles se basent sur de l’existant, les animations développées permettent ainsi de se différencier de la concurrence en conférant une dimension unique au dispositif final.

Les choix d’iconographie, d’animation offrent un côté novateur à une problématique UX ou micro UX. Ce sentiment de nouveauté rend attractive l’interface et pousse l’utilisateur à explorer plus longuement le dispositif développé.

menu navigation L’importance des micro interactions

Un formulaire contenant des micro-interactions aura plus de chances d’être complété qu’un formulaire classique développé plus rapidement. Il en va de même pour un tunnel d’achat sur un site e-commerce.

Le symbole de l’excellence

Beaucoup de minutie s’avère donc nécessaire pour construire la bonne micro-interaction, qui se doit d’être utile et non pas source de distraction ou de lassitude auprès des utilisateurs.

L’erreur d’une équipe projet serait en effet de ne pas penser en amont ce concept de micro-interactions et surtout de le reléguer en fin de projet.

btn menu L’importance des micro interactions

Or le développement de ces animations nécessite une symbiose de nombreuses ressources métier. UX Designer, Graphiste, Motion Designer et Développeur sont autant de métiers nécessaires au développement d’une simple micro-interaction dont il faudra fixer le lieu, la durée et l’animation au sein d’une interface. Le rendu de l’ensemble est le reflet  direct des échanges et des compétences de l’équipe projet.

etapes mi L’importance des micro interactions

Il serait donc regrettable de qualifier les micro-interactions de simple détails dans la réflexion UX d’un projet.  Pour autant, ce terme est peut-être le mieux choisi si on écoute le designer Charles Eames :

The details are not the details. They make the design.

La réussite d’un projet passe par l’attention toute particulière que l’on porte aux moindres détails.

 

Sources : Dribbble,  ideine.fr, blog.lunaweb.fr, webdesignerdepot.com 

Laisser un commentaire