UX/UI DESIGN

DG2
MJM graphique DG2
cours 8 -14 decembre 2023
Design thinking
Le design thinking
Processus centré sur le besoin utilisateur

Une approche qui est utilisé depuis 20 ans

Les entreprises l’utilises pour :

● Concevoir de nouveau produits
● faire évoluer leurs services ou
leurs process
● Pour la cohésion d’équipe

ui design DG2
Le design thinking
Process en 5 étapes

ui design DG2
Définition de la
cible
Définition de la cible
Pour se faire nous devons modéliser des personas

ui design DG2
 Etape 1
Empathie
empathie
Outil visuel souvent utilisé en Design
Thinking et recommandé dans le
fameux livre “Business Model
Nouvelle Génération”

Objectif :
meilleures compréhension d’un
client, d’un utilisateur, d’un
collègue, d’un prospect… dans le
contexte de l’utilisation de nos
services ou produits.

ui design DG2
empathie

L’état d'esprit : Il faut se mettre à la place de l’autre (utilisateur)

On doit répondre à ces questions :

Pour cela 2 méthodes :
● que font ces personnes
● quel(s) est/sont leur(s)
● Observation terrain
besoin(s)
● Recherches utilisateurs
● leur(s) comportement(s)
● leur(s) crainte(s)
● leur(s) hésitation(s)
● leur(s) habitude(s)

ui design DG2
etape 2
Définir
Definir
● générer un max d’idées
● brainstorming partage d’idée

Brainstorming

sur les problématique

utilisateurs

les besoins utilisateurs

ui design DG2
 etape 3
Idéation
Idéation
● conclusion sur les besoins
utilisateurs
● de quoi ont ils besoin
● quels sont leurs problèmes
● quelles informations pouvons
nous utiliser
ui design DG2
Tour de table
début d’idée en 4 mots
ensuite
le voisin complète l’idée
exemple :
Application mobile
pour connaître la
programmation
qui met en relation avec le
service de sécurité
donne des infos pratico
pratiques aux festivaliers
sur comment se restaurer
 etape 4
Prototype
Prototype
Pas de prototype finalisés ou
désignés.

Ils permettent de voir comment

vont s’articuler

ui design DG2
etape 5
Test
Test Outil

● Remplir un customer journey

Pourquoi ? ● etudier avec des outils dédiés

Mettre notre prototype à l'épreuve (Google Analytics, Amplitude ou encore Hotjar)

● Sondages avec des réponses clairs

Comment ? oui ou non
Un échantillon d’au moins 5 personnes ● Les suivis de souris et heat map
(beta testeurs) (outil pour tracker les habitudes
Définir un objectif de parcours précis utilisateurs sur un site web)

● Eye tracking (peu utilisée)

représente les points où
l'utilisateur va regarder

ui design DG2
Customer journey exemple pour un site d’annonces
immobilières

ui design DG2
Les scénarios
Scénario 1: Inscription à l'événement
Phase Action
1/ Identifiez l'option d'inscription sur l'application
2 / Remplissez le formulaire d'inscription
3 /Sélectionnez le type de course
4 /Finalisez le paiement en ligne
ui design DG2
Scénario 2: Suivi en temps réel du coureur
Phase Action
1 / Localisez la fonction de suivi en temps réel sur l'application
2 / Sélectionnez le coureur à suivre
3 / Activez les notifications de position
4 / Suivez le coureur sur la carte en temps réel
Exemples

ui design DG2
Exemples

ui design DG2
Exemples

ui design DG2