UX/UI design
Inclure dans drupal.fr

La création de sites internet ou la refonte de plateformes web nécessite de passer par une phase de conception et une phase de développement avant sa mise en production.

Aujourd’hui, nous allons nous intéresser à la première phase, à savoir la conception graphique. Cette étape, réalisée par des chefs de projets ainsi que des webdesigners ou des UI / UX designers, vise à définir avec le client le périmètre fonctionnel et technique de son projet. Elle consiste également à :

  • Réaliser un benchmark concurrentiel ainsi qu’un audit du site existant (dans le cadre d’une refonte) pour y faire des recommandations.
  • Créer l’ergonomie et le parcours utilisateur du futur site internet (à travers la définition de l’architecture fonctionnelle et du contenu des différents écrans).
  • Elaborer un prototype fonctionnel à partir d’une charte graphique (création de wireframes et de maquettes graphiques de la homepage et déclinaisons sur l’intégralité des écrans).

Vous l’aurez donc compris, cette phase a pour enjeu de créer la meilleure expérience utilisateur et l’interface la plus optimisée, afin de faciliter la navigation de l’internaute sur la future plateforme web. Pour ce faire, le webdesigner va, dans un premier temps, se focaliser sur la partie UX design, puis, dans un second temps, sur la partie UI design. Bien souvent confondus, un de nos experts revient, dans la suite de cet article, sur les différences entre ces deux termes. 

Qu'est-ce que l'UX design ? 

UX/UI design

Le concept de l’UX design (User Experience) repose sur la création et la conception de l’expérience que vivra un utilisateur sur un site internet ou une application mobile.

Pour créer cette expérience utilisateur, il est nécessaire de comprendre les besoins des utilisateurs, afin de centrer toute recherche et conception sur eux. L’objectif étant de créer une interface qui s’adapte parfaitement à leurs attentes.

Toute cette recherche et cette réflexion doivent ainsi être menée en plusieurs étapes :

  • La première consiste à analyser le comportement des utilisateurs (création de personæ et de user journey, réalisation d’interviews, etc.) et de réfléchir sur la structure globale de la plateforme. Cette réflexion se réfère principalement à la définition des fonctionnalités, des technologies et des spécifications fonctionnelles, répertoriés dans un cahier des charges.
  • La seconde consiste à concevoir des solutions ergonomiques suite à l’analyse de la précédente phase. Cela s’effectue notamment par la création de wireframes, qui consiste à élaborer schématiquement le squelette du futur site internet afin de visualiser l’agencement de la page, l’architecture de l’information, les parcours utilisateurs ainsi que les fonctionnalités essentielles. L’enjeu ici étant de commencer à construire l’expérience qu’aura l’utilisateur sur le site internet.
  • La troisième et dernière étape consiste à tester auprès du client les wireframes réalisés. L’objectif étant de valider les concepts, en termes d’expérience utilisateur, pour les transmettre, par la suite, au webdesigner ou à l’UI designer qui va venir réaliser la maquette finale du site internet.

Ce processus résume ainsi les différentes étapes de conception que fait un UX designer pour rendre le parcours de navigation le plus agréable et instinctif possible.

Qu'est-ce que l'UI design ? 

Au-delà du fonctionnement de l’application web et de l’expérience utilisateur qu’elle va proposer aux internautes, il est également nécessaire de réfléchir à son apparence. L’UI design (User Interface) va ainsi être tout le travail effectué autour de la création de l’interface graphique, à partir des éléments de réflexion réalisés dans la partie UX design, et de l’élaboration des interactions entre l’ensemble des pages du futur site internet. L’objectif étant, in fine, de rendre la plateforme web simple d’utilisation, pratique tout en étant agréable et facile à prendre en main pour les utilisateurs.

Pour ce faire, l’UI designer va créer une identité visuelle ou s’appuyer sur celle du client si celui-ci en possède une, afin de réaliser les maquettes graphiques de l’ensemble des écrans de la future interface. Il viendra y intégrer les différents éléments graphiques et textuels (logo, choix et intégration des couleurs, des typographies, choix des illustrations/images, formes, etc.) et y créer les animations, interactions et transitions entre l’ensemble des pages afin de concevoir un prototype fonctionnel. Ce prototype permettra, d’une part au client de se projeter sur son projet web et d’autre part, aux développeurs de faciliter le développement.

L'UX design et l'UI design : deux concepts qui ne peuvent pas être dissociés 

Vous l’aurez donc compris, ces deux domaines sont différents mais restent tous deux complémentaires. En effet, bien que l’UX design se réfléchit en amont de l’UI design, la création d’un site internet nécessite aussi bien de disposer d’une bonne expérience utilisateur que d’une interface graphique attrayante.

Ainsi, un travail bien pensé tant sur l’UX que l’UI design est le fruit d’un site internet qui : 

  • Est facile à trouver sur les moteurs de recherche, pour un utilisateur ;
  • Est conçu pour que le contenu s’adapte aussi bien sur ordinateur, que sur tablette ou smartphone ;
  • Est facile d’utilisation pour un utilisateur, de par sa navigation, qui doit être suffisamment intuitive ;
  • Permet aux utilisateurs de trouver facilement les informations recherchées
  • Dispose d’un design qui véhicule l’image de l’entreprise et qui donne envie aux utilisateurs d’utiliser la plateforme

En bref, L’UX et l’UI design sont deux concepts interconnectés et incontournables dans le processus de conception d’une interface web. 

Bien que nous soyons une agence Drupal, nous disposons de webdesigners confirmés, afin de vous proposer des solutions innovantes et pertinentes, tant sur les aspects ergonomiques que graphiques. Ainsi, si vous souhaitez bénéficier d’un accompagnement pour la réalisation de votre site internet, n’hésitez pas à prendre contact avec un membre de notre équipe via notre formulaire de contact. 

Ajouter un commentaire

Le contenu de ce champ sera maintenu privé et ne sera pas affiché publiquement.