🤔 Qu'est-ce que l'UX/UI Design ?

Mis à jour le :  

29/2/2024

Généralement quand je présente mon métier (UX/UI Designer donc), je suis confrontée à deux types de réactions : ceux qui connaissent déjà (parce qu’ils ont quelqu’un de leur entourage dans ce domaine ou qu’ils ont déjà travaillé avec un UX/UI Designer) et ceux qui me regardent avec des yeux remplis d'incompréhension 😶. 

Je reformule donc souvent en webdesigner, designer digitale ou encore tout simplement créatrice de site web. Ajoutons à cela que prononcer rapidement la phrase “je travaille dans l’UX” peut prêter à confusion 🔞 et on a perdu tout le monde…

Je vais donc expliquer ici ma définition personnelle de l’UX/UI Design.

Ma définition personnelle de l’UX/UI Design

Commençons par le commencement : UX et UI Design sont deux acronymes qui correspondent respectivement à User eXperience et User Interface. Bon, c’est vrai qu’on n’est pas beaucoup plus avancé avec tout ça…
En fait, UX Design et UI Design sont deux domaines distincts, pouvant être pratiqués par une seule et même personne. Néanmoins, certains professionnels sont uniquement spécialisés en UX ou en UI.

L’UX Design se concentre sur l’expérience utilisateur, l’accessibilité et l’ergonomie du site. L’objectif est de permettre à un utilisateur de n’avoir aucun blocage, du moins le moins de freins possibles, lorsqu’il effectue une tâche sur un site (comme par exemple acheter un produit sur un site e-commerce). 

L’UI Design se focalise quant à lui plutôt sur l’aspect visuel du site, en intégrant des éléments graphiques et d’identité visuelle : c’est la conception de l’interface avec laquelle l’utilisateur va finalement interagir.

En résumé, l’UX et l’UI sont deux étapes du processus de création d’un site web (ou de sa refonte) et sont complémentaires l’une de l’autre. 

Quelles différences entre UX et UI Design ?

Pour aller un peu plus dans le détail de mon métier, voici des exemples que ce je réalise au quotidien en UX Design et en UI Design.

En tant qu’UX designer, je réalise des audits ou des interviews utilisateurs 💬 afin de dresser un état des lieux de l’existant et d’améliorer l’utilisabilité d’un site web. 

Il s’agit de comprendre les utilisateurs, leurs comportements et leurs préférences. Pour cela on utilise fréquemment le principe des personas (qui correspondent à une ou des personnes fictives, proches des préoccupations des vrais utilisateurs 🙋‍♀️🤷‍♂️). Cela permet de toujours orienter ses réflexions en fonction des besoins des utilisateurs et ne pas se fier uniquement à son instinct. 

Exemple de persona pour une application de voyage/road trip (réalisé notamment grâce à l’outil d’HudSpot)
Exemple de persona pour une application de voyage/road trip (réalisé notamment grâce à l’outil d’HudSpot)

Pour concevoir un site, on commence donc généralement par l’UX Design. Après avoir réalisé des recherches sur les utilisateurs, on définit l’arborescence du site (quelles pages créées et comment l’utilisateur va naviguer de page en page) et on réalise des wireframes plus ou moins détaillés. Les wireframes sont neutres, souvent en nuances de gris, et permettent de définir plus précisément le contenu et les sections de chaque page.

💡 Les Wireframes (de l’anglais, fil de fer) sont un schéma de la structure et des fonctionnalités du site. Ils donnent une première image simplifiée de l’interface et permettent de repérer les erreurs éventuelles avant d’aller plus loin. Leur simplicité les rends très faciles à modifier et à corriger. 

A gauche un wireframe - A droite, la même page sous forme de maquette graphique

Exemple de wireframe
Exemple de maquette graphique

En UI design, je vais d’abord créer ou faire une refonte de l’identité visuelle selon les besoins de mon client. Parfois, il s’agit juste d’adapter celle-ci aux contraintes du web. 
L’avantage c’est que l’on peut réaliser cette étape en même temps que les premières réflexions UX.

On peut ensuite s’appuyer sur les wireframes pour réaliser des maquettes graphiques, qui intègrent justement l’identité visuelle et permettent d’agencer graphiquement les différents éléments qui vont composer le site web 🖼️. 

L’étape suivante consiste soit à l’intégration du site soit, pour approfondir les tests de design, à l’animation des maquettes graphiques. Les maquettes deviennent alors un prototype avec lequel on peut interagir comme sur le site final.

Un résumé visuel des différences entre UX et UI Design juste au-dessus ! ©Graffersid.com

Pourquoi faire appel à un UX/UI Designer ?

Je pense que tu l'as compris, créer un site web nécessite de passer par de nombreuses étapes pour concevoir un site qui correspond vraiment aux besoins de tes utilisateurs et que tu ne trouves pas juste beau personnellement (👋 bye bye l’instinct, les goûts personnels et parfois les fausses croyances). 

L’avantage de travailler avec un UX/UI designer, c’est que tu es avec quelqu’un qui t’accompagne de bout en bout pour te guider, te donner des recommandations et surtout te faciliter la tâche.

C’est typiquement un domaine où on a envie de mettre la main à la pâte, mais déléguer permet souvent de gagner un temps précieux et d’éviter certaines erreurs courantes ! 

Les petits bonus

Revenir aux ressources