Storyboarding

Objectif

Le storyboard met un scénario entier devant la salle, vignette par vignette, et chacun peut désigner du doigt celle qui ne tient pas. Un parcours qui traverse plusieurs étapes, plusieurs acteurs, plusieurs canaux et souvent plusieurs jours n'a, tant que personne ne l'a dessiné, aucun support que l'on puisse poser sur une table. Le cas d'utilisation l'énonce en prose, et le métier réagit mal à une prose qu'il ne voit pas. La maquette d'un écran montre un instant du parcours et laisse les intervalles dans l'ombre. Le modèle de processus décrit les activités de l'organisation, et ce que le client vit entre elles reste hors du cadre.

Ce qu'il rend inspectable, c'est précisément la matière que les autres techniques laissent implicite: ce qui se passe entre les étapes. Qui agit, sur quel canal, combien de temps dure le silence, ce que le client tient en main pendant qu'il attend, dans quel état chaque étape le laisse. Les décisions que la lecture permet de prendre sont de cet ordre: quels scénarios la solution doit servir, dans quel ordre les étapes s'enchaînent, qui possède chaque passage de relais et où le parcours se rompt. L'Agile Extension ajoute deux usages que le BABOK ne mentionne pas et qui pèsent lourd en pratique: montrer plusieurs variantes de la solution proposée, en dessinant le même scénario deux fois pour choisir entre les deux, et aligner les parties prenantes sur une vision avant que le premier écran existe.

Le livrable se compose de trois objets, et le troisième est celui que les équipes oublient. Un jeu de storyboards, un par scénario retenu, chacun formé d'une courte suite ordonnée de vignettes qui se tient debout toute seule. Un relevé de sélection, qui dit quels scénarios ont été dessinés, lesquels ne l'ont pas été et pourquoi. Et la liste des règles, des questions ouvertes et des ruptures que la lecture a fait remonter: c'est de cette liste que sortent les exigences.

En aval, le storyboard alimente trois travaux. L'élicitation des exigences que le parcours implique. La conception des interfaces que les vignettes contiennent. Et, l'usage le plus négligé des six que l'Agile Extension énumère, les tests d'acceptation: un scénario validé vignette par vignette est déjà un scénario de test, écrit dans les mots du métier et accepté par lui.

Usage

Quand l'utiliser

• Le parcours traverse des étapes, des canaux et des jours: aucune interface unique ne le porte, la séquence est le sujet.
• Cas d'utilisation et user stories restent trop abstraits: le métier ne réagit pas à ce qu'il ne voit pas.
• Un prototype formel serait inutile ou trop coûteux: le déclencheur économique de la technique, fréquent en pratique.
• Deux variantes de solution à comparer: dessiner le même scénario deux fois, côte à côte, puis choisir.
• Une salle à aligner sur une vision: le croquis se commente, le document de vision se signe sans se lire.
• Un processus existant à comprendre avant de proposer de le changer: la lecture fait apparaître les ruptures.
• Des scénarios de test d'acceptation à établir: un parcours validé vignette par vignette en est un.

Quand ne pas l'utiliser

• L'enjeu est l'utilisabilité d'un écran: prendre le prototypage papier, où un utilisateur exécute la tâche.
• La décision se joue sur une quantité: délai, débit, file d'attente. Prendre la simulation, qui mesure.
• Le parcours est acquis et il reste les règles à établir: prendre l'analyse des règles métier.

Description

Une méthode sur deux axes

Le BABOK classe les prototypes sur deux éléments distincts. L'approche dit ce que le prototype devient: on le jette, ou on le fait grandir jusqu'à la solution livrée. La méthode dit de quoi il est fait et ce que quelqu'un en fait. Le storyboarding est une méthode, aux côtés du prototypage papier et de la simulation, et les trois se distinguent par un seul critère. Un storyboard se lit: on suit une suite de vignettes et l'on avance dans le temps. Un prototype papier s'exécute par un utilisateur, qui accomplit une tâche pendant qu'un collègue joue l'ordinateur. Une simulation s'exécute par une machine, qui rend des mesures.

Tout prototype porte une réponse sur chacun des deux axes, et les deux réponses sont libres l'une de l'autre. Le storyboard est un prototype jetable, toujours, parce que le papier ne se met pas en production: la méthode ferme d'elle-même la case du prototypage évolutif. La réciproque est libre: un prototype jetable prend aussi la forme d'un bout de code, d'une maquette d'écran ou d'un dessin au tableau blanc, et le storyboard est l'une de ces formes parmi d'autres. C'est le prototypage pris dans son ensemble qui gouverne l'aiguillage entre les deux axes.

La technique voyage sous quatre autres noms, et il vaut la peine de les connaître parce que le lecteur les rencontrera: carte de dialogue, hiérarchie de dialogue, parcours client, flux de navigation. L'Agile Extension les recense, et elle place la frontière avec le story mapping, qui organise les activités de l'utilisateur en une structure, là où le storyboard présente le détail d'un scénario dans un flux visuel. Les deux artefacts se ressemblent sur un mur et répondent à deux questions différentes: l'un dit ce que l'utilisateur fait en général, l'autre dit ce qui se passe cette fois-ci, dans cet ordre, avec ces délais.

Ce qu'une vignette porte

L'Agile Extension nomme trois éléments. Le scénario, qui est l'unité: un scénario, un storyboard. L'illustration, une série de boîtes ou de segments, une par étape du scénario. Et l'explication textuelle, qui accompagne chaque boîte et qui doit suffire à ce que le storyboard se lise sans son auteur.

Dans la pratique, une vignette utile porte cinq informations et pas davantage: l'étape, l'acteur qui l'accomplit, le canal sur lequel elle se déroule, l'état dans lequel elle laisse le client et le temps écoulé jusqu'à la suivante lorsque ce temps compte. Le numéro de la vignette fait la séquence, et une légende d'une ligne fait le reste. Ce qui n'est pas dans cette liste est du décor, et le décor coûte deux fois: il se dessine, puis il détourne le regard.

Le parcours tel qu'il est vécu

Les deux référentiels décrivent le storyboard du côté de la solution proposée, et l'on en ressort avec l'idée que la technique appartient au futur. Elle travaille tout aussi bien sur le présent. Les vignettes portent les mêmes cinq informations, la discipline des trois à cinq vignettes tient toujours et ce qu'elles consignent est le parcours tel qu'il se déroule aujourd'hui: on le reconstitue avec ceux qui le vivent, on le dessine, on le leur lit à voix haute. Le livrable change alors de nature. C'est la liste des ruptures que la lecture fait remonter: les attentes que personne n'avait chiffrées, les états dans lesquels le client reste abandonné, les relais dont le propriétaire n'est nommé nulle part, les règles que le back-office applique de mémoire. Posé à côté du parcours réel, le storyboard devient un instrument d'audit, et c'est de cette lecture-là que sort le plus souvent la décision de changer quelque chose.

Conduire un storyboard

1. Identifier les scénarios en jeu
   Ils viennent des cas d'utilisation et des scénarios déjà écrits, des user stories, d'un entretien avec un expert métier, d'une visite chez le client, d'un atelier. Les personas rendent ici un service direct: un scénario appartient à quelqu'un, et le parcours d'un nouvel arrivant n'est pas celui d'un client de trente ans d'ancienneté. À ce stade on énumère largement, sans trier.
2. Choisir ceux que l'on dessine
   Tous les scénarios ne demandent pas un storyboard: on dessine les plus fréquents et les plus complexes. Les deux critères sont la vraisemblance du scénario et la complexité qu'il recèle, et l'Agile Extension les énonce dans ces termes. Le reste n'est pas dessiné, et ce choix se consigne. C'est aussi l'endroit où l'unité de travail se fixe, une fois pour toutes: un storyboard vaut pour un scénario, et à l'intérieur d'un scénario les vignettes forment une séquence. La grille de six cases que l'Agile Extension publie en illustration montre le jeu de storyboards, une case par scénario. Une fois l'unité fixée, les deux référentiels disent la même chose.
3. Dessiner
   Une série de boîtes, une par étape. C'est ici que l'évidence empirique prend le relais des référentiels. Trois à cinq vignettes. Truong, Hayes et Abowd ont fait varier le nombre de vignettes de une à sept: en dessous de trois, la compréhension s'effondre; au-delà de cinq, la compréhension, la qualité perçue et l'engagement du lecteur baissent tous les trois. Les storyboards que les praticiens produisent réellement vont de une à plus de vingt vignettes, mais ceux des experts se serrent entre deux et six, et la règle que ces experts énoncent eux-mêmes est qu'une fonctionnalité qui demande plus de cinq vignettes doit être coupée en plusieurs storyboards. Le test de la découpe est simple: une seule phrase courte doit suffire à décrire chaque vignette. Si elle n'y suffit pas, la vignette contient deux étapes.
4. Dessiner peu
   Le niveau de détail est minimal, et cela se décide. Les experts retirent du détail délibérément, ils préfèrent le bonhomme-bâton au dessin et le filtre à la photographie, parce que retirer du détail est la manière dont on dirige le regard. Le détail superflu coûte du temps au dessinateur et détourne le lecteur des points qui comptent. Deux décisions se prennent explicitement à ce moment. Les personnages: les faire figurer concentre le lecteur sur l'expérience vécue et engendre de l'empathie, les omettre concentre le lecteur sur la disposition de l'écran et sur le détail technique. On les met quand on veut une réaction à l'expérience, on les retire quand on veut un avis sur l'utilisabilité ou sur l'esthétique. Le temps: on ne le dessine explicitement que lorsqu'il fait partie de l'histoire. Une horloge inutile distrait; une horloge nécessaire décide, et Truong et ses coauteurs mesurent que 35,9% des lecteurs changent leur interprétation de la scène selon qu'un délai est dessiné ou non.
5. Ajouter le texte
   Chaque vignette reçoit ce qu'il faut pour être lue sans son auteur: la légende de l'étape, les interactions optionnelles, celles qui sont indisponibles, les demandes des parties prenantes qui ne relèvent pas du scénario principal, les notes sur une étape particulière. L'écart que le texte produit est considérable: avec texte, 84,4% des lecteurs identifient correctement l'histoire racontée, contre 65,7% sans texte, et l'ajout d'un texte à un storyboard qui n'en avait pas améliore 39,7% des réponses. Les formes courtes l'emportent sur les longues, une bulle ou une ligne valant mieux qu'un paragraphe. Le contrepoids doit être connu: le texte oriente le lecteur, et lorsque l'objet de la séance est d'obtenir une réaction non prévenue à l'interface elle-même, les vignettes restent muettes par décision.
6. Valider avec les parties prenantes
   Le storyboard se lit à voix haute devant des gens qui ressemblent au public visé, exactement comme n'importe quel prototype destiné à l'évaluation, puis l'auteur revient vers le groupe et recommence. L'itération fait partie du processus: la norme ISO 9241-210 traite la production de solutions de conception et leur évaluation avec des utilisateurs comme un cycle, et ce cycle est la conception centrée sur l'humain. Une lecture unique, applaudie poliment, ne vaut pas validation. La technique survit d'ailleurs très bien à une équipe dispersée, mieux que la plupart: un petit jeu de vignettes ordonnées se reproduit sans perte sur une toile partagée, et tout le monde peut désigner la même vignette.

Ce qui fait échouer un storyboard

Le glissement vers le « comment »

Les deux référentiels le signalent indépendamment et à deux hauteurs: le BABOK observe que le prototypage s'enlise dans le « comment » au détriment du « quoi », l'Agile Extension au détriment du « pourquoi ». Les vignettes sont un support de discussion, et la discussion porte sur le parcours.

Le flux visuel masque les règles

C'est la limite la plus coûteuse de la technique, et l'Agile Extension la nomme: l'attention se concentre sur l'enchaînement des images et les règles et contraintes significatives passent inaperçues. Un storyboard peut avoir l'air complet en étant vide de toute règle. La parade est procédurale: relire le storyboard une seconde fois en ne posant qu'une question à chaque vignette, quelle règle décide de cette étape, et router ce qui remonte vers l'analyse des règles métier.

Trop de détail

Le réflexe du débutant est que le dessin fini communique mieux. L'évidence dit le contraire, et le BABOK ajoute la conséquence: un prototype élaboré et détaillé engendre des attentes irréalistes sur la solution finale, et les parties prenantes se fixent sur des spécifications de conception au lieu des exigences. Le croquis grossier se critique; le dessin léché se signe.

Trop de vignettes

Au-delà de cinq, la compréhension et l'engagement baissent ensemble. Un scénario qui demande dix vignettes est deux scénarios, et le remède est de le couper.

Storyboarder tous les scénarios

On produit un mur que personne ne lit et l'on brûle le seul avantage décisif de la technique, son coût.

Le texte ajouté en dernière minute

Un storyboard muet est compris par deux lecteurs sur trois, un storyboard légendé par plus de quatre sur cinq. Le texte fait partie de l'artefact, au même titre que le trait.

« Personne ici ne sait dessiner. »

C'est le refus le plus courant et il repose sur une erreur de fait: les bonshommes-bâtons et les rectangles sont exactement ce que l'évidence recommande. Le talent graphique ne figure dans aucune des conditions de réussite de la technique.

Considérations IA

La partie chère du storyboarding est la découpe: décider où le scénario se coupe, combien d'étapes il compte, ce que chaque vignette doit porter. Débutants comme experts désignent l'histoire comme la difficulté réelle. C'est précisément là qu'un modèle rend son meilleur service: on lui donne un cas d'utilisation, un jeu de user stories, la transcription d'un entretien ou une description de processus, et l'on obtient une proposition de découpe en trois à cinq étapes, chacune avec sa phrase. C'est une découpe de départ, avec laquelle on peut se disputer.

Trois autres usages tiennent debout. La production de variantes: le même scénario dessiné deux fois, une fois avec le contrôle d'identité au guichet et une fois par appel vidéo, coûte peu à faire produire en parallèle, et le choix entre les deux devient une décision humaine posée devant deux artefacts. Le resserrement des légendes: les formes courtes l'emportent, et un modèle comprime bien une étape en une ligne, dans les trois langues du pays si le parcours doit être lu en français, en allemand et en anglais. L'énumération des scénarios enfin, comme liste à élaguer avant que les deux ou trois qui seront dessinés soient choisis.

La sélection des scénarios est une décision d'affaires: la fréquence et la complexité sont des propriétés de cette organisation et de cette clientèle, un modèle n'a accès ni à l'une ni à l'autre et sommé de choisir il choisira le scénario typique, alors que la valeur de la technique est dans le scénario ingrat. Le fini est le danger. Une image générée est polie par construction, et un artefact poli cesse d'être critiqué pour devenir une spécification: si l'on dessine par la machine, on repousse la fidélité vers le bas délibérément, sans quoi l'on a fabriqué le piège que la technique existe pour éviter. La validation se fait avec des personnes. L'approbation d'un storyboard par un modèle ne vaut rien, parce que ce qui est validé est le parcours, et le parcours appartient à ceux qui le vivent. Enfin, un modèle invente le passage de relais plausible: il ignore que cette banque expédie la carte par la poste et que le contrôle du permis lui coûte six jours de calendrier. Chaque fait du parcours se vérifie auprès de l'organisation, faute de quoi le storyboard enseigne avec assurance un processus qui n'existe pas. Les transcriptions d'entretien et les parcours clients portent enfin des données personnelles, et elles ne partent pas dans un modèle public.

Exemples

Une banque de détail veut refondre l'ouverture de compte, et elle commence par dessiner le parcours tel qu'il se déroule aujourd'hui. Cinq scénarios sont sur la table, deux sont retenus sur les deux critères et c'est le relevé de sélection qui le dit.

Le scénario du permis B traverse quatre étapes, trois canaux côté client et onze jours, ce qui est exactement la forme que la technique existe pour rendre visible. Quatre vignettes tiennent dans la bande de trois à cinq, et le délai est dessiné entre chacune parce qu'ici le temps fait partie de l'histoire: c'est le silence de six jours qui a déclenché la discussion.

La lecture à voix haute a produit ce que la technique produit réellement, qui est une liste. Entre la troisième et la quatrième vignette, le client attend six jours sans nouvelle, sans savoir que son compte existe déjà et qu'il est bloqué. Son premier salaire, CHF 6'200 versés le jour 8, tombe à l'intérieur de ce silence, avant que le contrôle du permis soit revenu, et la règle qui décide du sort de ce versement n'était écrite nulle part: le chef de produit la croyait connue, le back-office l'appliquait de mémoire et les deux versions différaient. Une seconde lecture, conduite en ne demandant à chaque vignette que la règle qui décide de l'étape, a fait remonter onze règles dont quatre n'étaient documentées nulle part. Elles sont parties à l'analyse des règles métier et les questions restées ouvertes au suivi des items.

Visualisations

La technique produit deux objets, et chacun prend la forme qui découle de sa nature. Le storyboard lui-même est une suite de vignettes positionnées dans l'espace, orientées par le temps: les délais entre les vignettes portent une partie du sens, l'espace qui les sépare est proportionné à leur durée et une liste à puces détruirait les deux. Il se dessine. Le relevé de sélection est fait de lignes et de colonnes, avec une colonne de fréquence et une colonne de complexité qui se comparent d'un coup d'œil, et ce qui est fait de lignes et de colonnes se rend en cellules.

Coût

Outils

L'outillage minimal est le papier, avec un crayon, des cartes et un mur. C'est l'outil que l'évidence recommande: des cartes se réordonnent, et réordonner les vignettes est l'opération centrale de la technique. La grossièreté du trait est une propriété recherchée, parce qu'un croquis grossier se critique sans gêne. Le tableau blanc occupe la même place dans un atelier colocalisé où l'histoire se dispute encore.

Le logiciel de présentation mérite plus de considération qu'il n'en reçoit: une diapositive par vignette, les notes en dessous, la forme est native, les diapositives se réordonnent d'un glissement et l'outil est installé sur toutes les machines de l'entreprise, ce qui pèse davantage que n'importe quelle fonctionnalité. La toile collaborative en ligne (Miro, Mural, FigJam et leurs semblables) est ce qui fait survivre la technique à une équipe dispersée: un petit jeu de vignettes ordonnées s'y reproduit sans perte, et chacun peut désigner la même vignette au même moment.

Les outils de conception (Figma et ses pareils) interviennent une fois le storyboard stabilisé, quand ses écrans nourrissent la conception des interfaces. Le risque y est nommé une fois pour toutes: dès que l'outil rend les vignettes finies, l'artefact cesse d'être critiqué. Les générateurs d'images posent le même problème, en plus rapide.

Aucun outil n'est requis. Un storyboard dessiné sur quatre feuilles A4 et scotché à un mur est une instance complète de la technique.

Sources

• IIBA, A Guide to the Business Analysis Body of Knowledge (BABOK Guide) v3, §10.36 Prototyping: le storyboarding comme méthode de prototypage, la séquence d'activités qu'il détaille visuellement et textuellement et les limites de l'enlisement dans le « comment », des attentes irréalistes et de la fixation sur la conception plutôt que sur les exigences.
• IIBA, Agile Extension to the BABOK Guide, §7.17 Storyboarding: le traitement complet de la technique, ses alias, ses six usages, son déclencheur économique, ses trois éléments, ses cinq étapes de création, la frontière avec le story mapping et la limite des règles que le flux visuel masque.
• Khai N. Truong, Gillian R. Hayes, Gregory D. Abowd, Storyboarding: An Empirical Determination of Best Practices and Effective Guidelines, Proceedings of DIS '06, ACM, pp. 12-21: l'étude empirique de ce qui rend un storyboard lisible, le nombre de vignettes, le niveau de détail, l'effet du texte, la présence ou l'absence de personnages et la représentation du temps.
• ISO 9241-210:2019, Ergonomie de l'interaction homme-système, partie 210: conception centrée sur l'opérateur humain pour les systèmes interactifs: la production de solutions de conception et leur évaluation avec des utilisateurs comme cycle itératif, ce qui fait de la validation une étape du processus.