Dans la pratique du “Design Thinking”, le prototypage fait partie intégrante de la réflexion sur la conception et de l’expérience centrée sur l’utilisateur sein d’un projet. Il nous permet notamment de tester nos idées rapidement afin de les confronter à la réalité terrain.
Prototype en Carton d’un grille-pain de l’agence Quirky
# QU’EST-CE QU’UN PROTOTYPE ?
Un prototype est un objet physique ou numérique issu d’une idée qui est représentée dans sa totalité ou partiellement. Dans un projet de design, il s’agit d’illustrer nos hypothèses concernant un service ou un outil, imaginées lors de la phase d’idéation. Attention cependant, un prototype n’est pas un produit fini.
Lorsque l’on démarre un projet à zéro, on n’a souvent pas beaucoup de ressource ou de temps. C’est pourquoi nos idées doivent être testées, modifiées, améliorées, en intégrant les contraintes de rapidité de production.
Comme nos habitudes du quotidien peuvent changer, nous sommes dans l’obligation de devoir confronter nos idées à nos utilisateurs, pour que notre solution finale réponde aux attentes et aux besoins de nos utilisateurs.
Exemple d’une session de test d’un prototype “low fidelity” d’UX Playground
# QUELLE EST LA DIFFÉRENCE ENTRE UN PROTOTYPE ET UN MVP ?
Le prototypage et les MVP, sont deux livrables proches, qui se complètent dans un projet.
llustration tirée de l’article Médium de Codica “Is an MVP the Same as a Prototype?”
Un prototype n’est jamais commercialisé ou industrialisé. Il est là pour être présenté et être manipulé par nos utilisateurs référents afin de générer des retours sur nos hypothèses.
Si le prototype ne répond pas aux attentes des testeurs, alors on sort avec des nouveaux éléments à prendre en compte pour le projet et pour nos futures itérations. On gagne une économie de temps et d’argent car on s’assure de ne pas se diriger vers de fausses pistes.
Mais si, nos hypothèses sont validées, la réalisation d’une version commercialisable sur la base de ces retours validés peut être envisagée.
C’est à ce moment-là, que le MVP entre en action, il est une version la plus simple et brute, commercialisable du produit.
# POURQUOI IL FAUT PROTOTYPER ?
Pour réfuter ou confirmer vos hypothèses apparues pendant votre phase d’idéation. Normalement vous aurez des idées plus ou moins formalisées de ce que vous devez faire.
Le prototype vous permettra de mettre en physique vos idées et rendre vos concepts interactifs pour récupérer des retours utilisateurs rapidement.
C’est un moyen parfait pour parler le même langage et faciliter les discussions non seulement avec vos utilisateurs, mais aussi avec les équipes en charge de la conception future du produit, surtout si vous constatez que votre équipe a un langage métier différent du vôtre
Exemple : PO, développeur, référent métier, ingénieur, commercial, etc.
Le prototype peut aussi inspirer d’une manière plus large les parties prenantes du projet.
Le prototypage papier est un excellent outil d’alignement entre chaque personne d’équipe
Pour réaliser des économies en temps, en coût et en énergie, un prototypage rapide doit formaliser qu’une seule partie de vos hypothèses, que ce soit en numérique ou en physique, et non l’intégralité du projet.
Si vous prototypez trop d’hypothèses en même temps, le risque est de ne plus savoir quelle hypothèse répond le mieux à vos utilisateurs, et peut même complexifier votre solution de base.
Lorsque vous imaginez un nouveau produit, je pense que vous avez envie de son succès, cependant il est important en début de projet de savoir commencer petit. Apprenez pendant la phase d’idéation et confrontez vos idées aux utilisateurs tout le temps pour faire grandir votre solution.
# COMMENT MARCHE UN PROTOTYPE ?
Si on doit résumer seulement en trois points, le prototypage rapide nous permet :
- D’avoir des éléments tangibles pour réaliser des tests.
- De formuler une proposition de valeur grâce à des messages clairs
Exemple : Votre cible, la fonction mise en avant, le service que vous proposez, son avantage majeur, le bénéfice.
- De créer de la visibilité dans un projet.
Encouragez donc l’équipe de votre projet à cibler plutôt une partie d’utilisateurs ou un marché de niche.
D’un point de vue financier, le prototypage permet de ne pas couter trop cher dans les budgets d’un projet, surtout pour l’équipe des développeurs.
Il a généralement un faible coût en investissement, car ce n’est pas le produit fini et on vise seulement à remonter des informations qualitatives.
Exemple d’une maquette haute-fidélité prototypée sous Adobe XD et prête à être testée
Quand vous faites tester votre premier prototype, il y a de grandes chances alors que les résultats ne soient pas ceux que vous attendiez, il ne faut pas être déçu et capitaliser dessus.
On tombe rarement sur la bonne solution du premier coup, il faut plus voir vos prototype comme une opportunité de concevoir un produit qui répond aux vrais besoins de vos utilisateurs finaux.
Il arrive que certains prototypes aient besoin d’un haut niveau de fidélité c’est le cas des chatbot qui ne sont pas forcément faciles à prototyper et à rendre tangibles.
Pourtant prototyper un chabot permettra d’effectuer des tests sur votre cible prioritaire qui utilisera votre futur outil.
Avec les outils actuels, vous pouvez créer un prototype qui ressemblera à votre chatbot sans avoir à coder une seule ligne, idéal pour limiter les coûts de budget et en ressource humaine. Vous pouvez également proposer plusieurs versions d’un prototype pour tester l’interface, les flux de conversation, le parcours de l’utilisateur sur l’outil.
Dans le monde du prototypage, il n’existe pas seulement le prototypage d’écrans mais aussi le prototypage hardware en utilisant du papier, du carton et bien sûr l’Arduino.
Exemple d’un prototype Arduino couplé avec un smartphone
Arduino est une plateforme électronique en open source pour le prototypage électronique. Une carte Arduino peut se connecter à d’autres objets comme des capteurs, laides, boutons, écrans, etc…
L’Arduino est particulièrement populaire pour le prototypage d’objets connectés : un des exemples les plus connus utilisant la technologie Arudion est de pouvoir contrôler une ampoule avec une application sur téléphone.
Attention cependant, pour créer des interactions avec un Arduino, il faut malheureusement savoir programmer un peu, mais il existe de nombreux sites qui peuvent vous aider pour débuter.
# HUIT OUTILS POUR FAIRE VOS PROTOTYPES
Choisir le bon outil permettra d’illustrer au mieux vos pensées et d’améliorer le travail avec vos clients. Maintenant de nombreux outils de prototypage existent, je vous propose 5 outils qui vous permettront de formaliser des prototypes pour vos nouveaux projets.
- Cartons, papier et crayons : L’outil qui sera le plus souvent utilisé dans notre métier ! Le prototype sera souvent reformalisé plus tard en détail sur machine afin de le rendre compréhensible aux yeux de tous. L’avantage de cet outil est que vous pouvez le découper, le coller, le scanner pour effectuer les premiers tests à vos utilisateurs.
- Adobe XD : Pour le moment gratuit, vous pouvez créer des prototypes interactifs et même des ressources prêtes pour la production dans une seule application. Si vos collaborateurs sont à distance, vous pouvez leur partager un lien pour qu’ils fassent des commentaires dessus.
- Origami Studio : Nous pouvons prévisualiser la maquette en direct sur votre mobile en temps réel comme sur Adode XD en utilisant Origami Live. Mais vous pouvez également exporter vos composants et leurs animations pour que les développeurs puissent les intégrer dans le projet.
- Wireframe.cc : Pour faire des prototypes “low fidelity”, la prise en main est rapide pour un résultat propre. Le système d’annotation est bien pratique pour commenter son travail.
- Hype 4.0 : Pour produire des animations comme sous After Effects pour des prototypes orientés en haute qualité, le principe est de créer des animations via des points-clés. L’avantage de cet outil est qu’il n’est pas nécessaire de connaître le code.
- BotMock : Pas besoin de savoir coder pour l’utiliser, vous pouvez réaliser des prototypes de chatbot prêt à être développés. Le logiciel offre assez de possibilités. Il peut notamment cartographier les flux conversation et les visualiser sous l’angle d’un utilisateur.
- Framer X : Si vous utilisez Arduino pour concevoir et prototyper un système électronique, vous pouvez utiliser Framer X pour concevoir et prototyper son interface. Ce logiciel est recommandé pour faire des interfaces fonctionnelles.
- Mon Atelier En Ville : Si vous avez l’âme d’un bricoleur, il existe de nombreux fablab dans Paris, qui ont divers équipements comme les imprimantes 3D et des découpeuses laser, idéales pour travailler le hardware d’un prototype.
# RÉFÉRENCES
- Et si vous faisiez un prototype papier ? : Article de Christophe Pian sur le site Medium.
- Is an MVP the Same as a Prototype ? : Article de Codica sur le site Medium.
- UI-UX : les bases du prototypage web et apps – Concevoir pour et avec les utilisateurs
“C’est en faisant des erreurs que l’on apprend et que l’on se développe. Il faut être mauvais pour devenir bon.”
Paula Scher
Enguerran Chambaraud, UX Designer @UX-Republic
SERVICE DESIGN : LES FONDAMENTAUX #Paris
SMILE Paris
163 quai du Docteur Dervaux 92600 Asnières-sur-Seine
USER RESEARCH : APPRENDRE DES UTILISATEURS # Belgique
UX-REPUBLIC Belgique
12 avenue de Broqueville - 1150 Woluwe-Saint-Pierre
TESTS UTILISATEURS # Belgique
UX-REPUBLIC Belgique
12 avenue de Broqueville - 1150 Woluwe-Saint-Pierre
PILOTER ET MESURER L’UX # Paris
SMILE Paris
163 quai du Docteur Dervaux 92600 Asnières-sur-Seine
UI-DESIGN : LES FONDAMENTAUX # Paris
SMILE Paris
163 quai du Docteur Dervaux 92600 Asnières-sur-Seine
DESIGN SPRINT : INITIATION & FACILITATION # Distanciel
Distanciel
Depuis chez vous !
SCRUM PRODUCT OWNER – CERTIFICATION SCRUM INSTITUTE # Paris
SMILE Paris
163 quai du Docteur Dervaux 92600 Asnières-sur-Seine
DESIGN THINKING : CRÉER DE L’INNOVATION # Belgique
UX-REPUBLIC Belgique
12 avenue de Broqueville - 1150 Woluwe-Saint-Pierre
STORYTELLING : L’ART DE CONVAINCRE # Paris
SMILE Paris
163 quai du Docteur Dervaux 92600 Asnières-sur-Seine
UX-DESIGN : LES FONDAMENTAUX # Belgique
UX-REPUBLIC Belgique
12 avenue de Broqueville - 1150 Woluwe-Saint-Pierre