• 8 heures
  • Facile

Ce cours est visible gratuitement en ligne.

Ce cours est en vidéo.

Vous pouvez obtenir un certificat de réussite à l'issue de ce cours.

J'ai tout compris !

Mis à jour le 10/05/2019

Donnez vie à votre histoire dans un storyboard

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Vous êtes déjà très familier avec les storyboard grâce aux bandes dessinées, ou au film 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 ?

A 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 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 à 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 fait dans un minimum de 6 minutes et un maximum de 2h.

  • 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 des post-its, des feutres, et une planche !

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 de les 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étail qui nuit à la lisibilité

 

Minimaliste
Minimaliste

 

Encombré
Encombré

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

  • Vos croquis n’ont pas besoin d’être un dessin réaliste.

  • Vous passez d’une planche à l’autre pour illustrer une nouvelle action ou situation.

  • Vous devez ajouter du texte explicatif.

  • Vos bulles dialogues entre personnages restent basiques.

Structurer votre histoire en plusieurs étapes.

Réaliser un storyboard, c’est visualiser l’histoire. Contrairement au croquis et de 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 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-its.

  • Vous allez déplacer les post-its 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. Placez 6 post-its sur la feuille en laissant la place pour mettre un titre.

 1. Six planches pour six étapes
Placez 6 post-its 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 storyboard "Le Tuteur"

À vous de jouer !

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

  • Consignes : écrire en majuscule, 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.

Evaluer 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 votre storyboard doit être compris de A à Z 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 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 majuscule

  • Repère temporel sur chaque planche (1 mois, 3 mois, 6 mois par exemple ou encore 1h, 2h, 3h, 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 planche

  • 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, cofounder of Airbnb

Joe Gebbia, le co-fondateur de AirBnB présente "How Airbnb uses storyboarding" à la conférence 99U à New York. [20 minutes] Profitez de l’intégralité de 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-its

  • 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 trop avoir 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 planches),

  • 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 planche (é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 est ce dont vous avez besoin pour passer à l’étape suivante du projet. Storyboard est un allié pour explorer un concept, apprendre à votre équipe comme 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 planches.

  1. Pliez une feuille de papier en 3 (comme vous pliez une feuille A4 pour 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 planches (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-its pour représenter chaque planche

  • 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