Les cinq phases du processus UX

1. Objectifs

   • Citer et ordonner les cinq phases du processus UX
   • Associer à chaque phase sa question clé, ses méthodes et ses livrables
   • Expliquer pourquoi le processus est itératif
   • Relier les cinq phases au modèle du double diamant
   • Situer les leçons déjà vues (besoins, attentes, satisfaction) dans le processus
   • Planifier un petit projet UX phase par phase

1. Présentation

   • Concevoir une bonne application ne commence pas par l'ouverture d'un logiciel de maquettage. Les équipes UX suivent un processus: une suite de phases qui va de la compréhension des utilisateurs jusqu'au test d'une solution.
   • Ce chapitre présente ce processus et les outils qui l'accompagnent : Trello pour organiser le travail, les outils de maquettage pour concevoir, Git et GitHub pour conserver les livrables. Vous verrez aussi que les leçons précédentes (besoins, attentes, envies, satisfaction) trouvent toutes leur place dans ce processus.

• Nous continuons avec BiblioCampus, notre application fictive de réservation de livres. Pour les activités, créez le dossier 12-processus-ux/ dans votre dépôt GitHub ui-ux-design-bts.

1. Vue d'ensemble

   • Le processus UX que nous utiliserons compte cinq phases. Chacune répond à une question précise :

• Ces phases s'inspirent de la démarche de design thinking. Selon les entreprises, elles portent parfois d'autres noms (recherche, analyse, idéation, conception, évaluation), mais la logique reste la même.

1. Phase 1 : comprendre

   • On ne conçoit pas pour soi : on commence par rencontrer et observer les utilisateurs. C'est dans cette phase que l'on identifie les besoins et que l'on analyse les attentes et les envies, comme dans le chapitre précédent :

1. Phase 2 : définir

   • On transforme tout ce qui a été appris en un problème clair à résoudre. L'énoncé « Comment pourrions-nous… ? » ouvre la recherche de solutions sans en imposer une :

1. Phase 3 : imaginer

   • On produit beaucoup d'idées, sans les juger, puis on choisit les plus prometteuses. La quantité aide à trouver la qualité :

1. Phase 4 : prototyper

   • On rend les idées concrètes, en augmentant progressivement la fidélité: du croquis papier au prototype cliquable. Un prototype n'est pas l'application finale : c'est un support pour tester rapidement :

1. Phase 5 : tester

   • On fait utiliser le prototype par de vrais utilisateurs et on observe. On mesure aussi la satisfaction, par exemple avec le questionnaire SUS vu dans le chapitre précédent :

1. Un processus itératif

   • Le processus n'est pas une ligne droite. Les tests, et parfois les autres phases, obligent à revenir en arrière. C'est normal, et même souhaitable :

1. Exemple 1 : le coût d'une erreur

   • Dans BiblioCampus, le bouton « Mes emprunts » est mal placé.
     • découvert sur un croquis papier: on gomme et on redessine, en deux minutes ;
     • découvert pendant le test du prototype: on modifie quelques écrans dans Figma, en une heure ;
     • découvert après la mise en ligne: il faut modifier le code, retester, republier et prévenir les utilisateurs, ce qui prend plusieurs jours.
   • C'est la raison d'être du processus UX : trouver les problèmes le plus tôt possible, quand ils coûtent le moins cher.

1. Le double diamant

   • Un autre modèle très connu, le double diamant, montre le même processus sous forme de deux losanges. Dans chacun, on commence par ouvrir (diverger), puis on resserre (converger) :

• Le premier diamant cherche le bon problème, le second la bonne solution. Une erreur fréquente consiste à sauter le premier diamant et à chercher tout de suite une solution.

1. Exemple 2 : le projet BiblioCampus en cinq phases

   • Voici comment l'équipe a organisé ses quatre premières semaines :
     • semaine 1: entretiens, observation à l'accueil, analyse des avis (comprendre) ;
     • semaine 2: synthèse, énoncé du problème, tableau des exigences (définir), puis séance de remue-méninges (imaginer) ;
     • semaine 3: croquis, wireframes, puis prototype cliquable (prototyper) ;
     • semaine 4: test avec cinq étudiants, corrections et second test (tester, puis itérer).

• Les outils de la dernière colonne sont présentés dans les leçons suivantes de ce chapitre.

1. Activité 1 : remettre les phases dans l'ordre

   • Sans regarder la leçon, écrivez les cinq phases dans l'ordre, avec la question clé de chacune.
   • Vérifier : comprendre (qui sont les utilisateurs ?), définir (quel problème résoudre ?), imaginer (quelles solutions ?), prototyper (à quoi cela ressemble ?), tester (est-ce que cela marche ?).

1. Activité 2 : classer des tâches

   • Associez chaque tâche du projet à une phase :

• Vérifier : a) imaginer ; b) comprendre ; c) définir ; d) prototyper ; e) tester ; f) comprendre ; g) définir ; h) tester.

1. Activité 3 : situer les leçons précédentes

   • Pour chaque leçon du chapitre 03 (identifier le besoin, analyser les attentes, comprendre les envies, mesurer la satisfaction, exprimer les besoins à partir d'un cahier des charges), indiquez la ou les phases concernées.
   • Vérifier : les besoins, attentes et envies relèvent de la phase comprendre ; le cahier des charges et les exigences, de la phase définir ; la mesure de la satisfaction, de la phase tester.

1. Activité 4 : formuler un énoncé de problème

   • Après les entretiens, l'équipe de CantineCampus a appris que beaucoup d'étudiants font la queue vingt minutes et finissent par manger un sandwich. Rédigez trois énoncés « Comment pourrions-nous… ? ».
   • Vérifier : vos énoncés décrivent un problème des utilisateurs sans imposer une solution (« … réduire l'attente au restaurant ? » plutôt que « … créer une application de réservation ? »).

1. Activité 5 : la méthode Crazy 8

   • Pliez une feuille A4 en huit cases. En huit minutes, dessinez huit idées différentes pour l'écran d'accueil de CantineCampus, une minute par case.
   • Présentez vos croquis à votre voisin, puis votez chacun pour deux idées.
   • Vérifier : vos huit idées sont réellement différentes, et non huit variantes de la même.

1. Activité 6 : choisir le niveau de fidélité

   • Pour chaque situation, choisissez entre croquis papier, wireframe, maquette ou prototype cliquable :
     • a) comparer trois organisations possibles de l'écran d'accueil en dix minutes ;
     • b) vérifier que des étudiants trouvent seuls le bouton de réservation ;
     • c) présenter au client les couleurs et la typographie retenues ;
     • d) discuter avec l'équipe de l'emplacement des informations sur la fiche d'un livre.
   • Vérifier : a) croquis ; b) prototype cliquable ; c) maquette ; d) wireframe.

1. Activité 7 : repérer les itérations

   • Pendant le test, trois étudiants sur cinq ne comprennent pas le mot « Réserver » : ils pensent que le livre leur sera livré. Que faites-vous ? Vers quelle phase revenez-vous ?
   • Vérifier : on revient à prototyper pour changer le libellé (« Mettre de côté », « Réserver au comptoir »…), puis on reteste. Si les étudiants expriment une vraie envie de livraison, on revient aussi à comprendre.

1. Activité 8 : planifier un mini-projet

   • Par groupes de trois, planifiez sur quatre semaines un projet UX pour CantineCampus. Pour chaque phase, indiquez les méthodes, les livrables et le responsable.
   • Vérifier : chaque phase produit au moins un livrable, et votre planning prévoit du temps pour une itération après le test.

1. Activité 9 : diverger, puis converger

   • En groupe, listez en cinq minutes le plus d'idées possible pour réduire l'attente au restaurant universitaire. Puis, en cinq minutes, choisissez-en trois avec des critères écrits (utilité, faisabilité, coût).
   • Vérifier : vous avez séparé les deux temps, sans critiquer pendant la phase d'idées, et vos trois choix sont justifiés par vos critères.

1. Activité 10 : déposer votre travail sur GitHub

   • Regroupez dans 12-processus-ux/README.md vos réponses, votre planning et les photos de vos croquis Crazy 8, puis envoyez le tout :

git add 12-processus-ux
git commit -m "Ajoute la leçon sur les cinq phases du processus UX"
git push

• Vérifier : le fichier README.md et vos images apparaissent bien sur la page GitHub du dépôt.

1. Erreurs fréquentes

1. À retenir

   • Le processus UX compte cinq phases : comprendre, définir, imaginer, prototyper et tester.
   • Chaque phase répond à une question et produit des livrables.
   • Le processus est itératif: on revient à la phase utile dès qu'on apprend quelque chose.
   • Le double diamant rappelle qu'il faut trouver le bon problème avant de chercher la bonne solution.
   • Plus un problème est découvert tôt, moins il coûte à corriger.

Le processus UX ne sert pas à éviter les erreurs : il sert à les faire tôt, quand elles ne coûtent presque rien.