En développant une application, on souhaite qu’il soit facile à utiliser et beau. C’est exactement ce que permettent respectivement l’UX et l’UI design. Ce sont les deux premières étapes pour créer votre application, c’est pourquoi il est si important de comprendre la différence entre les deux !
Derrière la structure de chaque application, il y a une logique propre. Si vous n’avez jamais entendu parler d’UX et d’UI, la prochaine fois que vous allez sur une application, essayez de vous poser les questions suivantes : Comment est-ce que le site ou l’application mobile sont-ils construits ? Qu’est-ce qui fait que vous avez cliqué sur le lien ? Est-ce que le service est facilement accessible ?
Ce parcours utilisateur est déterminé au moment de l’UX design. Le terme UX design vient d’eXpérience Utilisateur. C’est la première étape de la création d’une application. Elle sert à déterminer l’interaction entre l’application et les utilisateurs.
Cette méthode permet de concevoir une interface centrée sur l'utilisateur. L'objectif est de créer la meilleure expérience utilisateur en tenant compte de ses besoins, désirs et attentes de l’utilisateur.
Cette étape est donc clé dans la construction de votre application ! Le but est de rendre l’environnement le plus accessible et fluide possible, immédiatement compréhensible par l’utilisateur.
En très simplifié, l’UX design est synonyme de “ergonomique”.
Une fois que le squelette est assemblé, il faut l’habiller. C’est le rôle de l’UI design, ou de l’Interface Utilisateur. C’est l’étape qui permet de créer l’interface graphique de votre produit.
C’est une étape cruciale, car elle détermine si un utilisateur restera sur votre application ! L’objectif est de favoriser l’engagement, en rendant l’application belle, agréable à utiliser et facile à prendre en main. L’UI se focalise davantage sur le visuel, l’esthétique, tout en faisant bien attention à conserver l’efficacité de l’application.
En très simplifié, l’UI design est synonyme de “beau”.
L'UX design consiste en 4 étapes :
S’il y a une étape fondamentale, c’est elle, c’est pourquoi nous y consacrerons une importante partie de cet article. La recherche utilisateur est la matière première avec laquelle vous travaillerez durant tout le développement de votre application.
Mais qu’est-ce que cela signifie “UX research” ? C’est la recherche qui vous permettra de connaître le mieux possible votre utilisateur en se glissant dans sa peau. C’est logique : comment réaliser une application répond à un besoin, sans connaître son utilisateur ? Le but ultime est de jouer sur le ressenti de l’utilisateur.
Une personne ouvre une application si elle le trouve attrayant, puis y reste si son utilisation est agréable, son fonctionnement compréhensible et si elle trouve facilement ce qu’elle cherche. Finalement, l’UX est la façon dont l’utilisateur va percevoir le monde pendant quelques minutes, à travers votre produit.
Comment faire ? Tout simplement, c’est le moment où il faut se poser beaucoup de questions sur vos utilisateurs. Qui sont-ils ? Que cherchent-ils ? Où voulez-vous les mener ? Quel est l’objectif de votre site/ application ? Puis, testez vos hypothèses, ouvrez vos horizons et interrogez de potentiels utilisateurs autour de vous. Vous pouvez ensuite construire la persona de votre utilisateur pour designer l’app qui répondra au mieux à ses besoins.
Une UX research bien menée vous permettra ensuite de guider l’utilisateur vers ce que vous voulez lui apporter. Tout comme les fameux “nudge” dont on parle beaucoup ces derniers temps (par exemple, le dessin de mouche sur les toilettes masculines !), votre application devra en regorger pour donner envie à votre utilisateur d’aller ici ou là, et ainsi le guider en douceur vers le call-to-action, qui concrétisera l’achat de votre utilisateur.
Une UX research bien menée vous permet ensuite de créer une liste pertinente des besoins de l’utilisateur. Chaque élément de cette liste doit être inclus dans votre produit, c’est ce qui permettra à l’utilisateur d’être satisfait.
N’hésitez pas également à conduire des séries de tests avec les utilisateurs pour être sûrs et certains que vous avez bien compris leurs besoins et que vous y répondez bien avec votre service.
Vous pouvez alors commencer à esquisser les plans de votre produit en vous mettant à la place de l’utilisateur. Quelles étapes doivent apparaître ? Dans quel ordre? Quel lien entre les différents écrans sur votre application ?
À cette étape, il faut pour l’instant uniquement écrire ces étapes, sans commencer à dessiner les premiers écrans.
C’est à ce moment que le Wireframe fait son apparition. Il s’agit d’un schéma au graphisme (très) simplifié de la structure de votre application. L’objectif est d’établir puis de visualiser :
N’hésitez pas à dessiner, à faire des schémas pour vous représenter le plus concrètement possible le parcours de votre utilisateur. Dessinez les liens des pages entre elles, réduisez au maximum le nombre de “clics” que l’utilisateur doit faire pour atteindre son but.
Pour mieux comprendre le déroulement nous vous conseillons de regarder la réalisation de l'application METS-UP PRO, l'application qui aide les professeurs d'EPS.
L’UI design arrive juste après l’UX design. Maintenant que vous avez identifié les problématiques de votre utilisateur, que vous avez compris quel était le parcours idéal pour répondre à ses besoins, vous avez créé une série d’écrans très schématisés.
L’étape de l’UI est clé - puisque c’est le moment où ces écrans schématisés vont prendre forme. Le designer va en effet créer une maquette de votre application.
C’est le moment de la création du visuel. On passe donc du wireframe froid à une maquette certes statique, mais colorée qui se rapproche au plus près de votre futur produit. Elle permet de se mettre un peu plus à la place de l’utilisateur grâce à sa perspective réaliste. Cette maquette est réalisée à partir des indications de l’UX, elle ne fait “que” l’habiller.
Il s'agit alors de définir :
Une fois que l’UX et l’UI design ont été réalisés, ils ne sont pas gravés dans le marbre. L’étape d’après est celle du prototype, qui permettra de tester les fonctionnalités de l’application et de mettre en évidence ses avantages et ses axes d’amélioration. Pour cela, il est notamment possible d’animer les différents écrans de l’application pour mieux tester leur utilisation.
On peut ainsi créer un prototype - une maquette interactive et cliquable qui permet de tester l’application comme si on l’utilisait en vrai. Le prototype permet également d’analyser en temps réel l’interface. C’est le meilleur moyen de récupérer le feedback des utilisateurs.
N’hésitez surtout pas à faire de nombreux tests avec des utilisateurs pour améliorer leur expérience et peaufiner les maquettes existantes. Pour en savoir plus, consultez notre article sur le feedback utilisateur.
Pour résumer, on peut dire que l’UX est le squelette d’une application, qui doit être fonctionnel et parfaitement articulé, et que l’UI en est le beau visage, avec lequel on peut facilement interagir.
Ces deux étapes sont interconnectées et constituent la base d’une application. Elles doivent être travaillées avec minutie avant de passer au prototype, qui mettra en évidence les mérites et axes d’amélioration du produit.
Pour avoir une UX et une UI réussies, la clé est de se mettre à la place de son utilisateur. L’idéal est même de tester son produit le plus possible, auprès de proches par exemple.
