• 8 heures
  • Facile

Ce cours est visible gratuitement en ligne.

course.header.alt.is_video

course.header.alt.is_certifying

J'ai tout compris !

Mis à jour le 10/10/2022

Donnez vie à votre histoire dans un storyboard

Vous êtes déjà très familier des storyboards grâce aux bandes dessinées ou aux films d’animation, et pourtant ce n’est pas quelque chose que vous faites systématiquement dans votre vie de tous les jours.

Storyboard du court métrage de la fameuse lampe Pixar

 

Rendu final

Storyboard
Storyboard
Rendu final
Rendu final

Mais comment l’utiliser dans l’UX design ?

À quoi ça sert ?

Le storyboard permet d’imaginer comment une tranche d’histoire va se dérouler, avant même d’avoir produit ou réalisé quoi que ce soit.

Le storyboard est un outil simple, pas cher et très collaboratif, qui permet d’ébaucher son storytelling et de vous aider à dresser une expérience utilisateur.

Par exemple, retraçons le parcours d’un voyageur qui entre dans la gare pour prendre son train : il/elle ne trouve pas l’affichage, il/elle cherche son numéro de quai, le train a du retard, etc. Ce scénario vous servira de matière première pour produire un site ou une application mobile.

Storyboard du voyageur en train
Storyboard du voyageur en train

 Créer un storyboard apporte de nombreux avantages :

  • Il est rapide à réaliser : il peut s’agir d’une simple réalisation papier-crayon faite dans un minimum de 6 minutes et un maximum de 2 heures.

  • Il peut être créé seul, à deux ou en équipe (il sera d’autant plus riche).

  • Il est facile à comprendre car il communique des idées visuellement.

  • Il favorise le partage et la critique constructive avec votre équipe ou votre client.

  • Il est modifiable à volonté, un coup de gomme et c’est reparti !

Comment s’y prendre pour construire le storyboard ?

Procédez par étapes, par itération, toujours pas à pas. Vous avez juste besoin de Post-it, de feutres et d'un support plan !

Identifier des éléments à inclure

Allez d’abord piocher dans les idées de solutions que vous avez déjà sous la main, notamment vos fameux croquis d’idées que vous avez dessinés en Post-it. Il suffit ensuite d'assembler les pièces du puzzle, et d’ajouter les étapes manquantes.

Deux exemples de storyboard : le premier un peu « léger », et le second un peu « encombré ».

Minimaliste, difficile à comprendre sans explication de l’auteur

Trop de détails, ce qui nuit à la lisibilité

 

Minimaliste
Minimaliste

 

Encombré
Encombré

Comme vous pouvez le constater avec l’exemple ci-dessus, de simples croquis sont suffisants, mais contrairement au cinéma :

  • vos croquis n’ont pas besoin d’être des dessins réalistes ;

  • vous passez d’une "case" à l’autre pour illustrer une nouvelle action ou situation ;

  • vous devez ajouter du texte explicatif ;

  • vos bulles de dialogues entre personnages restent basiques.

Structurer votre histoire en plusieurs étapes

Réaliser un storyboard, c’est visualiser l’histoire. Contrairement au croquis et à la carte mentale, les storyboards vont apporter trois choses supplémentaires :

  • plonger votre interlocuteur dans le contexte, c’est comme « planter le décor » ;

  • créer de l'interaction entre les personnages ou entre vous et votre audience ;

  • présenter un scénario réaliste, donner vie à l’histoire.

Passons à la fabrication de votre storyboard
  • Prenez une feuille blanche A4, un feutre noir et des Post-it.

  • Vous allez déplacer les Post-it pour construire intuitivement une suite d'événements, comme des pièces du puzzle qui s’assemblent.

Reprenons notre exemple d’un voyageur d’affaires qui prend son train tôt le matin.

 1. Six cases pour six étapes
Placez 6 Post-it carrés de même couleur sur la feuille, en laissant la place pour mettre un titre.

2. Fin de l’histoire
Écrivez l’objectif à atteindre sur le dernier Post-it, ou tout simplement une fin heureuse, un ressenti. Par exemple, dans notre cas cela peut être attraper son train. Imaginons-le assis tranquillement dans le train.

3. Scène d’ouverture
Vous devez maintenant dessiner votre scène d’ouverture. Placez un décor de gare et votre personnage.

4. Le fil conducteur
Écrivez et dessinez une scène d’ouverture, placez un décor et un personnage ou plusieurs dans un contexte. Remplissez les autres cases comme cela vous vient.

  • Est-ce qu’il va acheter son billet au guichet ?

  • Est-ce qu’il prend un expresso au café de la gare ?

  • Se trompe-t-il de quai ?

Il est rassurant de structurer son storyboard comme une frise du temps – avant, pendant, après :

  • avant : la situation de départ (souvent un problème, un besoin, une envie) ;

  • pendant : une évolution (ce qui se passe, des évènements imprévus) ;

  • après : la résolution ou le résultat (ce qui a changé).

5. Titre : trouvez un slogan à votre histoire 😀

Même si vous dessinez des croquis explicites, mettez toujours un libellé de qui est représenté, et aussi un titre ou un slogan. Cela vous oblige à donner du sens et du contenu réel.

Exemple de titre storyboard
Exemple de titre de storyboard : "Le Tuteur"

À vous de jouer !

Entraînez-vous aussi avec le storyboard café / petit déjeuner
  • Matériel : une feuille A4, 6 Post-it, feutre noir.

  • Consignes : écrire en majuscules, ajouter des mots clés pour décrire les croquis.

  • Durée : 20-30 minutes.

Alors, ce petit déjeuner, comment ça se passe ?

Maintenant, vous allez réaliser votre storyboard sous contrainte de temps, en changeant le personnage : vous irez droit au but et serez plus créatif. Donnez-vous 2 minutes pour le premier Post-it, 2 minutes pour le second, etc. Donc 12 minutes max pour le storyboard, et ajoutez 3 minutes pour trouver le titre.

Évaluer votre storyboard

Vous n’aurez jamais bon du premier coup, car c’est à vous de faire émerger la mécanique de l’histoire. Vous connaissez en général le point de départ (A) et ce que vous souhaitez accomplir ou l’objectif à atteindre, qui est le point B. Mais le chemin pour aller de A à B reste à imaginer.

Imaginez que l'ensemble de votre storyboard doive être compris par une personne qui le découvre, sans que vous puissiez lui donner une seule explication.

Relisez-le étape par étape : qu’est-ce qui ne vous paraît pas assez explicite, et qui devrait l’être ?

Voici une liste de contrôle pour vous aider à évaluer votre storyboard. Les éléments suivants sont-ils bien présents sur votre storyboard ?

  • Écriture lisible et en majuscules.

  • Repère temporel sur chaque case (1 mois, 3 mois, 6 mois par exemple, ou encore 1 h, 2 h, 3 h ; parfois ce n’est pas utile).

  • Mots clés sur les croquis.

  • Titre ou slogan qui résume le storyboard.

  • Une seule idée, action ou tâche par case.

  • Date et auteur en petit (c’est pour disposer d’un point de repère dans le futur).

"[Storyboarding] isn't about drawing skills, this is really about honing in on your idea." -- Joe Gebbia, cofondateur d'Airbnb.

Joe Gebbia, le cofondateur d'AirBnB, présente "How Airbnb uses storyboarding" à la conférence 99U à New York [20 minutes]. Profitez de l’intégralité de la vidéo, c'est un exemple marquant de storytelling ! La partie Storyboard commence aux alentours des 9 minutes.

« Les personnes les moins créatives finissent souvent par produire les storyboards les plus extraordinaires. » -- Joe Gebbia

Ajouter du liant en vérifiant la cohérence

Après une ou deux itérations, votre storyboard est déjà plus que satisfaisant.

Et pourtant j'ai le sentiment qu’il manque un petit quelque chose ?

Souvent il manque un fil rouge, un fil d’Ariane, une idée en filigrane qui se développe et évolue. C’est le lubrifiant qui permet de fluidifier l’histoire.

  • Essayez de changer l’ordre des Post-it.

  • Ajoutez des ressentis ou commentaires des personnages en situation.

  • Déroulez le storyboard pour voir si tout s’imbrique correctement, et ajustez.

Encore quelques pistes pour améliorer la cohérence :

  • veillez à ne pas avoir trop de personnages, pour éviter toute confusion ;

  • donnez des prénoms faciles ou originaux aux personnages, pour aider votre interlocuteur à s'identifier au personnage ;

  • coupez une étape en deux si cela facilite la compréhension (ajoutez des cases) ;

  • changez la chronologie si cela aide grandement à la compréhension ;

  • ajoutez du texte au croquis qui a été mal interprété par votre partenaire ;

  • nommez chaque case (étape un, numéro, ou un mot clé qui résume l’étape).

Qu’est-ce qu’apporte vraiment le storyboard à l’UX Designer ?

Dans certains cas, débrancher votre ordinateur et travailler vos idées sur le papier sont ce dont vous avez besoin pour passer à l’étape suivante du projet. Le storyboard est un allié pour explorer un concept, apprendre à votre équipe comment marche un processus, ou pitcher une idée.

Enfin, vous le verrez par la suite, le storyboard est un outil fréquemment utilisé pour mettre en scène un parcours utilisateur et un scénario d’usage.

Storyboarder votre vie : passé, présent, futur

Il est temps de réaliser un autre storyboard, plus personnel cette fois. Il se déroule en seulement trois étapes, trois cases.

  1. Pliez une feuille de papier en 3 (comme vous pliez une feuille A4 pour la mettre dans une enveloppe). En haut de chaque tiers, écrivez PASSÉ, PRÉSENT, FUTUR.

  2. Mettez le minuteur, et donnez-vous 10 minutes pour faire un storyboard de votre vie en 3 cases (si possible, incluez une minute d’avertissement). Esquissez quelque chose qui représente votre passé (à gauche), votre situation actuelle (au milieu), et votre futur (à droite).

Résumons

  • Partez de vos croquis pour brosser un premier storyboard.

  • Utilisez les Post-it pour représenter chaque case.

  • Procédez par itération : assembler le puzzle, enrichir, évaluer et ajouter de la cohérence.

  • Pratiquez le storyboard seul, à deux ou en équipe.

  • Ne cherchez pas la perfection, mais la lisibilité et la compréhension.

Exemple de certificat de réussite
Exemple de certificat de réussite