Contactez-nous

Prenons rendez-vous

Revenir au blog

UX & UI design : quelle différence ?

Sophie-Charlotte Colrat
Sophie-Charlotte Colrat Lecture : 7 min - 24 mars 2022

Les termes “UX” et “UI” sont très souvent utilisés ensemble, mais tout le monde ne sait pas exactement à quoi correspond chacune de ces expertises et comment elles fonctionnent ensemble.

L’UX design est le travail qui est fait sur l’expérience des utilisateurs, leurs parcours et leur utilisation d’une plateforme, avant même de considérer l’aspect graphique. L’UI design sera quant à lui le travail effectué sur les éléments graphiques et textuels de l’interface, ayant pour but de la rendre intuitive tout en respectant l’image de marque et la charte graphique d’une société.

Dans cet article nous allons découvrir comment ces deux disciplines interviennent dans la création d’une interface qui a pour but principal la génération de leads.

uxui-recap

Définitions : que sont l’UX et L'UI Design

 

1. Qu’est-ce qu’est l’UX Design ?


On associe communément l’UX design, ou User Experience Design, à l’expérience que l’on peut avoir sur une interface digitale. En vérité, elle concerne tout autant notre ressenti global, le ressenti émotionnel que l’on gardera de notre expérience d’un lieu public ou de l'accomplissement d'une tâche professionnelle ou personnelle. 

Si l’on se focalise sur l’UX design appliqué aux interfaces digitales, il s’agira alors de se poser les bonnes questions lors de la phase de conception d’un site internet, afin  de concevoir une solution centrée utilisateur et de limiter ses éventuelles frustrations.

2. Qu’est-ce qu’est l’UI Design ?


L’UI design, ou User Interface Design, concrétise le look and feel d’une interface, les choix graphiques et les interactions d’un produit. L’UI a toute son importance pour faciliter les interactions de l’utilisateur et l’aider à atteindre  son but, tout en réduisant sa charge mentale. 

Le travail autour de l’UI permet de définir entre autres les choix typographiques, colorimétriques, de formes, de volumes, et de transitions, afin de guider au mieux les utilisateurs  lors de leur parcours sur l’interface. Ainsi,  la conception de l’interface utilisateur participe à engager les users par l’émotion et contribue à l’expérience utilisateur globale d’une plateforme. 

Lorsqu’une charte graphique ou un Design System (une bibliothèque de composants réutilisables et une documentation qui permet de concevoir des designs cohérents) existent, l’UI designer tâchera de l’appliquer sur la solution en gardant à l’esprit qu’il est important de maintenir une cohérence de marque. 

Les codes propres aux secteurs d’activité auront aussi leur importance. Par exemple, l’UI design dans le luxe n’utilisera pas les mêmes codes que ceux d’’une marketplace.

 

Le rôle de l’UX et l’UI Design dans la conception d’un site orienté Lead generation


L’UX et L’UI design sont deux pratiques complémentaires et leurs rôles sont bien distincts. Toutefois, ces deux pratiques nécessitent une approche itérative centrée utilisateur afin de tenir compte de leurs retours pour affiner l’expérience utilisateur.

Lors d’une conception centrée utilisateur, les UX/UI designers s’adaptent à chaque projet afin de vous accompagner au mieux dans la création, la refonte ou l’amélioration de votre site internet.

2.1. Définition des objectifs de conversion client 

Lors de la définition de votre cahier des charges, en tant que client, vous définissez des objectifs de performance pour votre site internet. 

L’un des objectifs principaux est généralement de maximiser la génération de Leads qualifiés. Et afin de générer du trafic sur votre site internet, vous disposez de plusieurs leviers : de la publicité en ligne, des campagnes d’emailing ou encore le référencement naturel par exemple. 

Une fois que vous aurez généré du trafic sur votre site internet, c’est l’expérience que vivra votre visiteur qui sera le levier déterminant dans son engagement et de sa progression dans le tunnel de conversion.

Et pour cela, votre site internet devra s’appuyer sur l’UX Design. On parlera alors d’utilisabilité.

Un système (dans notre cas, un site web) est utilisable lorsqu’il permet à l’utilisateur de réaliser sa tâche avec efficacité, efficience et satisfaction dans le contexte d’utilisation spécifié.

uxui-iso-9241

 

2.2.  Ateliers de conception et d’itération

Un premier levier à utiliser pour entreprendre une démarche d’UX/UI Design est de s’appuyer sur les grands principes ergonomiques. Les UX/UI designers effectuent un audit en suivant une grille d’analyse basée sur les critères ergonomiques de Christian Bastien et Dominique Scapin.

uxui-audit ergo

Si l’audit ergonomique est une première phase qui permet d’obtenir des résultats rapidement, il peut être approfondi par un audit UX complet comprenant des recherches utilisateurs pour comprendre les besoins, les envies et les comportements des utilisateurs. Ce processus s’appuie sur différentes méthodes d’observation des utilisateurs finaux.

On distingue deux grandes familles de méthodes de recherche utilisateur, qui peuvent être utilisées si besoin en complément : les méthodes quantitatives et les méthodes qualitatives

Ainsi selon le stade du projet il sera plus ou moins opportun de s’appuyer sur l’une ou sur l’autre. Le processus que l’on mettra en place sera différent selon ce que l’on souhaite connaitre des utilisateurs et dans quel but. 

Les méthodes dites quantitatives, adressent le combien. Elles permettent de quantifier l’attractivité des différents éléments d’interface :

  • Les UX analytics permettent d’affiner la hiérarchie et le parcours visuel grâce à des heatmap* ;
  • Les A/B tests permet de tester plusieurs variantes pour en conserver la meilleure ;
  • Les sondages permettent de recueillir l’opinion d’une population, ses attentes, sa perception de l’image de marque.

Les méthodes qualitatives posent le pourquoi et le comment de l’interaction. Elles permettent de comprendre le end user, son expertise, ses motivations, ses problèmes et ses besoins au travers de plusieurs types de rencontres : 

  • Les entretiens individuels avec les end users, qui seront focalisés sur leurs problématiques, leurs usages de la plateformes et leurs besoins ;
  • Les focus groups, où les utilisateurs ne sont plus interviewés individuellement mais en groupe afin d’approfondir les réflexions individuelles, créer des dynamiques d’échange ou challenger des retours ;
  • Les tests utilisateurs, où l’utilisateur est directement confronté à une interface, ou bien des wireframes afin qu’il puisse faire des retours à chaud sur son expérience.

Cette démarche, qui peut sembler parfois chronophage, est aussi un gage de réussite. Elle permet d’avancer progressivement dans la définition de l’expérience sans engager des dépenses trop vite sur la partie UI. Définir les parcours les plus performants en amont, c’est aussi bien préparer l’étape suivante de l’UI Design, qui viendra peaufiner votre message.

Les spécialistes UX/UI sauront tirer la bonne interprétation de ces données et ainsi identifier les contenus qui génèrent de l’intérêt ou des revenus. En complément, ils sauront enclencher une démarche d’UI Design afin d’optimiser encore plus l’expérience utilisateur et mieux mettre en scène votre marque ou vos messages. 

uxui-ateliers

2.3. Sublimer l’expérience utilisateur (User Experience)

Lorsque les expériences utilisateurs souhaitées de votre site sont définies, l’UI Design intervient pour mettre en lumière les parcours et les informations. L’UI Design permet ainsi de faire passer des messages forts ou de mettre en avant votre image de marque, aspects non négligeables dans votre stratégie de lead generation.

Par le travail sur les aspects graphiques, l’UI design est un levier pour améliorer la lisibilité d’un site et le guidage vers les bons call to action. Il permet de mettre en valeur et sublimer le travail d’un UX au service de la conversion :

  • L’utilisation de couleurs complémentaires ou de jeux de couleurs sourdes associées à des couleurs plus vives aident à accentuer des call to action ou certains niveaux de titres ;
  • Le choix typographique doit se limiter à 2 familles de police, permettant ainsi de mieux mettre en valeur l’architecture de l’information sans alourdir la charge mentale de vos visiteurs ;
  • Un styleguide permet de maintenir une homogénéité des éléments, des espacements et ainsi concevoir un site avec une cohérence de marque forte.

Proposer un contenu utile à votre prospect permet de capter son attention. L’attention à l’image de marque permet d’améliorer la capacité de conversion, de rétention et de fidélisation. Une UX efficace peut pousser à convertir un visiteur, mais ne garantit pas que la marque restera dans le top of mind du visiteur.

UX & UI Design, des pratiques qui évoluent


3.1. Amélioration continue grâce aux outils d’analyse

Avec la généralisation des outils d’analyse, comme peuvent proposer HubSpot ou Google Analytics, les pistes pour optimiser les tunnels de conversion sont de plus en plus activables. 

uxui-behavior-flow

Il est ainsi très judicieux de se rendre régulièrement sur les outils d’analyse de votre site pour en tirer des idées d’optimisation des parcours clients. Par exemple :

  • suivre les flux comportementaux sur Google permet de comprendre quels sont les parcours des utilisateurs. Si une section majeure pour vous n’est jamais cliquée, c’est qu’elle est peut-être mal positionnée et que l’UI de votre site ne sert pas assez l’expérience idéale..
  • La mesure des zones chaudes, des zones cliquées, des parcours entre les pages, des rebonds ou des conversions permettent d’améliorer en continu des pages. 
  • Les AB tests permettent de tester des jeux de couleurs ou dispositions pour voir lesquels performent le mieux.

 

3.2. Vers une démarche Growth-Driven Design

La démarche UX/UI se heurte aujourd’hui à une réalité du quotidien des nombreuses sociétés qui ont amorcé leur transformation digitale. À l’heure de l’accélération du digital, il n’est plus question de travailler sur de longs projets informatiques. Force est de constater que les fameux cycles en V, composés d’une phase de cadrage complète, de design puis d’implémentation finissent souvent par aboutir à des livrables obsolètes avant même d’être proposés aux end users. 

L’heure est aujourd’hui à l’agilité, à des démarches itératives. Chez Markentive par exemple, nous croyons à une démarche en deux temps :

  • Une phase d’implémentation courte de votre projet de site internet en travaillant le concept de MVP, Minimum Viable Product, tant sur le plan de l’UX que de l’UI.
  • Une phase d’accompagnement et d’optimisation pour améliorer cette première version en continu et atteindre vos objectifs de croissance.

Mettre votre site en ligne le plus rapidement possible, c’est pour nous la garantie de pouvoir commencer à activer des campagnes marketing, de vous positionner dans les résultats de recherche, et donc commencer à accumuler de la donnée de visite et de conversion. C’est sur cette base que nous travaillons ensuite pour faire évoluer l’UX de votre site en optimisant les parcours. 

Ainsi, Markentive propose aujourd’hui à ses clients le choix d’un launchpad Website mais aussi une équipe pour l’accompagner au quotidien dans le développement et l’optimisation de son site. L’objectif est ainsi de mieux coller aux besoins qui évoluent et aux profils toujours plus variés des visiteurs pour mieux pousser à leur conversion en leads qualifiés.

 

Ce qu’il faut retenir

l’UX et l'UI design sont certes des disciplines qui peuvent évoluer séparément, mais elles sont complémentaires et indispensables ensemble pour garantir la réussite d’une refonte de website ou d’une interface ayant pour but de générer des leads.

Le processus de travail classique sur un website consiste en :

  • la définition des objectifs de conversion et des autres KPIs qui seront pertinents pour mesurer la performance de l’opération ;
  • l’audit de la plateforme existante (si elle existe) et l’organisation d’ateliers focalisés expérience utilisateur (UX), selon différentes méthodes de recherche quantitatives et qualitatives ;
  • l’optimisation de l’expérience utilisateur en appliquant la couche graphique (UI) aux parcours identifiés pendant les ateliers UX, afin de mettre en lumière les informations importantes du site et accompagner les users vers les points de conversion ;
  • l’amélioration continue grâce à l’analyse de la performance du site et à la démarche Growth-Driven Design.

Il est toutefois important de préciser que ce processus n’est pas figé et que l’on peut faire appel à des prestations UX et/ou UI à tout moment de son processus de création ou refonte d’un site.

Vous souhaitez créer ou refondre votre site web en appliquant les meilleures pratiques UX et UI ? Vous aimeriez optimiser la performance de vos dispositifs de génération de leads (landing pages, emails, etc.) ?

Notre équipe est à votre disposition !

Contactez-nous

newsletter-markentive