TP 4 – Un voyage de mille lieues commence toujours par un premier pas.
Le Royaume du pré-design
Chapitre 1 : Le portrait global
Créer un design consiste en une itération de 3 étapes :
Pré-design
Design
Post-design
Un projet de design consiste majoritairement à boucler sur ces trois étapes jusqu'à obtenir un prototype satisfaisant.
Voici le contenu de chaque étape :
Pré-design
Persona, tâche, brainstorm
Design
Itération 1 : prototype papier
Itération 2 : protptype Miro ou Figma
Post-design
Critique, scénarios, évaluation utilisateur, heuristiques, etc.
Chapitre 2 : Le pré-design en lumière
Les Personas
Utilisateur fictif créé par le designer qui représente un public cible.
Généralement il y a plusieurs personas pour un design. Dans le cadre du cours, il sera commun de ne définir qu'un persona par design.
"Mélanie, 25 ans, nouvellement mère. elle a peu de temps libre, elle doit souvent, dans une journée, arrêter ses actions pour s'occuper de son bébé. Elle a peu de moyens financièrement et elle a souvent un sommeil léger".
Éléments d'un bon persona :
1. Mettre des informations pertinentes pour la définition de nos tâches.
Par exemple, j'ai mentionné que Mélanie doit souvent "arrêter ses actions", car j'ai l'intention dans les tâches de prendre en considération cet élément pour créer un système de sauvegarde de ses actions sur le site web (avec une création de wishlist et création de comptes.)
2. Les informations mentionnées dans le personna doit le plus possible être cohérent avec le public cible
Dans notre exemple, il n'aurait pas fait de sens de rajouter "Mélanie est une personne zen dans la vie", car les nouvelles mamans ne sont généralement pas zen dans leur quotidien (rien contre les mères btw, elles font un excellent travail)
Les Tâches
Ce sont des courtes phrases ordonnées qui dictent les fonctionalités/éléments de design que doivent soutenir notre plateforme
Étant nouvellement mère, Mélanie souhaiterait pouvoir accéder à des 'kits de départ', soit un ensemble d'articles proposés d'être achetés ensemble. En magasinant, elle sera potentiellement perturbée dans son activité : création d'un compte où elle pourrait sauvegarder ses étapes dans un panier virtuel ET dans une liste de souhait. Il faudrait également qu'elle puisse magasiner par catégorie. Après avoir placé les articles désirés dans son panier, elle pourra avoir un aperçu des frais de livraison et des taxes sommés aux prix des articles. Ensuite, elle pourra directement procéder à une transaction monétaire par crédit.
Éléments d'une bonne liste de tâches :
1. aucun lien avec l'interface. Nous sommes encore en pré-design. Les tâches dont une abstraction, pas un début d'implémentation !
2. Faire, si possible, des liens avec le persona défini
Chapitre 3 : Les petits extras
Voici un nouvel exemple de site web qu'on a "pimpé" sur Figma
Lien du 'mauvais' site web
Lien du réajustement sur Figma
J'ai mis en bulles 'commentaire' quelques unes des justifications des modifications faites sur le design d'origine. Bien entendu, dans vos devoirs, il faudra rajouter les liens avec les éléments de découvrabilité, d'utilisabilité et du persona
Procédons maintenant à la citation de la semaine :
Assure-toi que c’est comme si c’était fait par des humains, pour des humains.
Stefan Sagmeister – Designer graphique & typographe.
Le TP4 est maintenant FERMÉ.