Retour

UX et IU Design : savez-vous vraiment ce que c’est ?

L'environnement de travail numérique 4/03/2019 Scala Dream Team

On a tous entendu parler de l’UX et de l’IU design. Mais, au fond, savons-nous vraiment ce que c’est ?

Commençons par le début (oui, commencer par le début c’est toujours mieux) :
UX = User eXpérience design = Design de l’expérience utilisateur
UI = User Interface design = Design d’interface utilisateur

Le design est le petit plus qui incitera les visiteurs à rester sur votre site mais aussi, qui les incitera à revenir. Cependant, restons vigilant, « beau » ne veut pas nécessairement dire « pratique » et « agréable à utiliser » (ergonomique). Il faut savoir où placer le curseur : ni trop ni pas assez.

Prenons un exemple pour illustrer ce propos : que pensez-vous de cette image ?

Fourchettes galerie

Prenez quelques instants pour bien regarder…

Ce sont de très beaux objets, c’est incontestable ! Mais est-ce que ces fourchettes remplissent vraiment leur fonction première ?

Elles intéresseront tout particulièrement collectionneurs et galeristes mais ont peu de chance, à première vue, de se retrouver dans votre cuisine un jour.

Le besoin et la fonction d’un objet semblent donc bien différents en fonction de la cible à laquelle il s’adresse.

Alors, comment définir l’expérience utilisateur ?

Ce schéma simplissime, traduit très simplement le concept d’expérience utilisateur (UX). Ici un utilisateur (user) va se servir d’un produit (product), le vélo, équipé de roues, d’un cadre et de pédales. Il est heureux car le vélo répond à son besoin premier à savoir : pouvoir se déplacer.

Velo UX design schema
Source : https://blogdummi.fr/

Si maintenant je lui propose que son vélo soit également rouge, et que c’est une couleur qui lui plait, ou avec une selle très confortable par exemple ; en plus de remplir sa fonction première, le vélo remplira des critères d’apparence, de confort, de design, …. (et donc de UI) importants pour l’utilisateur.

L’UX et l’UI sont indissociables pour remplir pleinement l’expérience utilisateur. Un vélo sera toujours plus vendu s’il est beau et confortable, mais s’il n’a pas de pédales ou de roues, il ne sera pas vendu du tout ! Indissociables donc, mais avec des notions différentes. Regardons un peu ce nouveau schéma :

iceberg UX design
Source : https://www.thibautlochu.com/

L’utilisateur ne voit que la partie émergée de l’iceberg. Alors que la partie immergée, toujours plus importante, c’est tout le reste : tout ce qui permet à nos UI Designer de faire le design d’interface.

Découvrons désormais ensemble les étapes importantes de l’expérience utilisateur :

1. La stratégie ou « comment apprendre à se centrer sur l’utilisateur »

Définir les attentes et besoins de l’utilisateur c’est aussi connaître ses capacités technologiques, géographiques mais aussi physiques. Mais pour connaitre son utilisateur il faut connaitre sa cible et pour connaitre sa cible il faut définir les objectifs du projet et les affiner avec les besoins des utilisateurs.

Si l’on ne connait pas son utilisateur, on est sûr de passer à côté de notre projet et donc entraîner nécessairement une perte de temps et une perte d’argent.

2. Les personas

Cette étape permet d’affiner les besoins des utilisateurs et les fonctionnalités de votre projet. Le persona est un profil d’utilisateur, c’est l’incarnation concrète d’un utilisateur-type. C’est l’outil principal de l’empathie tout au long du projet, la synthétisation de la recherche utilisateurs

Designer pour l’utilisateur réel plutôt que pour le plus grand nombre : chaque profil a une vie, des attentes et des objectifs différents. A travers ces personas (car oui, il faut en faire plusieurs), il sera possible d’envisager les fonctionnalités spécifiques du futur produit.

Retrouvez l’article de Maud sur le Sprint Design, sur le Blog Scala juste ici. L’atelier est identique (presque) en tout point !

3. Le parcours utilisateur

Les personas vont nous permettre d’établir un parcours utilisateur.

Dans un parcours, il peut y avoir :

• Les actions du persona, dans l’ordre chronologique
• Ses perceptions : audio, visuelles, etc.
• Ses Insights, ressentis (pas forcément positifs)
• Sa courbe de stress
• Ses points de contact avec le service / Interface
• Les informations données/services rendus par le produit

Je n’ai pas besoin de vous dire pour l’instant le but de ce parcours utilisateur.

4. Stratégie de contenu / Hiérarchisation des besoins

Des étapes précédentes, nous allons pouvoir énumérer les fonctionnalités, le contenu et en faire une arborescence.

Enumerer Catégoriser Structurer

Maud nous vous a présenté cette étape dans son article sur le Sprint Design, atelier dans lequel nous avons appliqué cette étape (ça fait 2 fois, oui, je sais!).

5. Du Sketching au Prototypage

Pour passer de nos précédentes étapes à des prototypes de notre futur site web ou application, il faut compter 4 étapes :

• Le sketching
• Le wireframing
• Les mockups
• Le prototype

6. Les tests utilisateurs

Même s’ils n’apparaissent pas sur notre iceberg, ils restent indispensables. Il est important de tester nos prototypes pour voir s’ils correspondent aux besoins, c’est le moment ou jamais avant d’attaquer les développements.

Pour plus d’informations et pour un accompagnement dans vos projets de UI et UX Design, n’hésitez pas à nous contacter !

Avatar auteur
Écrit par ,
Consultants Scala
Ça vous a plu ? Faites tourner !

À lire aussi

say hello !

un projet ? des infos ? un devis ?

on est partout.

Amiens
Scala Amiens

7 rue de l’Ile Mystérieuse

80440 Boves Amiens
Lyon
Scala Lyon

Parc du Crecy, 12 rue Claude Chappe

69370 Saint Didier au Mont d’Or Lyon
Marseille - Siège social
Scala Marseille

11 avenue André Roussin
Immeuble Grand Ecran

13 016 Marseille
+33 (0)4 91 46 84 60
Paris
Scala Paris

8 Rue Euler

75 008 Paris
+33 (0)1 56 68 77 80
Tunis – Tunisie
Scala Tunisie

Rue du Lac Biwa, Immeuble Fraj
3ème étage, Lac 1,
Les Berges du Lac

1053 Tunis – Tunisie
+216 71 657 451
Et même Londres, Bruxelles, NY, Montréal et Casablanca.Voir carte.

on recrute !

Venez voir toutes nos offres ici.

contact
le blog