Prototypage papier

Objectif

Le prototypage papier établit, en une heure et sous forme de comportement observé, si un design retenu mais pas encore construit tient au contact d'un utilisateur réel: ce que l'utilisateur a fait, où son doigt s'est arrêté, quel mot il a lu de travers, quel chemin il a cherché et que l'interface n'avait pas. Les deux autres voies vers cette réponse coûtent plus ou rendent moins: demander à une partie prenante ne donne qu'un avis, construire ne répond qu'au prix d'un sprint.

La question qu'il tranche a une forme précise: ce design survit-il au contact d'un utilisateur réel, et sinon, où exactement cède-t-il? La réponse arrive pendant qu'un changement coûte encore un trait de stylo.

Le livrable se compose de deux objets. Le journal des problèmes observés: les endroits où le participant a hésité, les chemins que le design n'avait pas, les mots qu'il a mal lus, les étapes qu'il a inventées. Et le deck corrigé: les feuilles reprises au stylo entre deux séances, avec les décisions de conception que ces traits consignent. Le papier, lui, se jette.

L'économie de la technique est son argument entier, et Rettig l'a énoncée en 1994: le prototypage basse fidélité vaut parce qu'il maximise le nombre de fois où l'on peut affiner le design avant de devoir s'engager dans du code. Le bénéfice tient à ceci: un artefact bon marché se corrige entre deux participants, de sorte qu'une après-midi porte trois rondes de conception là où un prototype cliquable en porte une. Le Nielsen Norman Group arrive au même endroit par l'autre bout: à budget égal, trois études de cinq utilisateurs valent mieux qu'une étude de quinze, parce que ce que l'on achète est la refonte faite entre deux rondes.

Le BABOK sépare l'approche de la méthode, et les deux sont libres l'une de l'autre. L'approche dit ce que le prototype devient: on le jette (prototypage jetable), ou on le fait grandir jusqu'à la solution livrée (prototypage évolutif). La méthode dit de quoi il est fait et ce que quelqu'un en fait: on lit un storyboard, on opère un prototype papier, on exécute une simulation. Tout prototype porte une réponse sur chacun des deux axes. Le prototypage papier est une méthode, et sur l'axe de l'approche il n'occupe qu'une case: du papier ne part pas en production, donc un prototype papier est toujours un prototype jetable. L'aiguillage entre les deux axes appartient au prototypage pris dans son ensemble.

Usage

Quand l'utiliser

• Design arrêté, rien de codé: la seule question qui reste est de savoir si un utilisateur réel sait l'opérer.
• Vocabulaire de l'interface contesté: libellés, messages d'erreur et terminologie sont ce que la séance éprouve.
• Désaccord d'équipe sur la navigation: le doigt du participant tranche, et personne n'a besoin d'avoir raison.
• Correction attendue entre deux participants: la feuille se reprend au stylo, donc trois rondes tiennent dans une après-midi.
• Parties prenantes non techniques dans la salle: le banc d'observation leur fait voir l'échec, ce qu'aucun compte rendu ne fait.
• Aucun outillage disponible: la technique ne présuppose ni licence, ni design system, ni environnement.
• Équipe réunie autour d'une table: le deck est un objet physique, et la séance en vit.

Quand ne pas l'utiliser

• Interaction fine ou continue (glisser, défiler, animer): l'ordinateur humain ne suit pas, prendre un prototype interactif haute fidélité.
• Conception encore ouverte: rien à opérer, prendre une maquette jetable ou un storyboard.
• Question de volume, de délai ou de coût: la séance ne rend aucun chiffre, prendre la simulation.

Description

Préparer le deck

Les tâches s'écrivent avant la première feuille

C'est la liste des tâches qui décide des feuilles à dessiner, et l'ordre inverse produit une démonstration: on dessine les écrans que l'on aime, puis on invente les tâches qui leur vont, et la séance confirme ce que l'équipe croyait déjà. C'est le défaut de préparation le plus courant, et il est invisible de l'intérieur.

Le fond, puis les pièces mobiles

Le décor fixe se dessine une fois, sur une feuille: la fenêtre, l'en-tête, la navigation permanente. Tout ce qui change en réponse à l'utilisateur devient une pièce séparée, physiquement détachable: fiches cartonnées pour les dialogues, les menus et les listes déroulantes, post-it pour les infobulles et les messages d'erreur, bandelettes de papier pour le contenu d'un champ. Cette séparation est ce qui rend l'interface opérable: sans elle, il reste un dessin.

Un rhodoïd et un feutre effaçable

Posés par-dessus la feuille, ils laissent le participant saisir dans un champ, et la feuille survit intacte à la séance suivante.

Du faux texte là où le contenu n'est pas en cause, du vrai texte là où le mot est l'objet du test

Les libellés, le texte des boutons, les messages d'erreur et la terminologie du métier sont ce qu'un prototype papier trouve, donc ils s'écrivent pour de bon. Une étiquette laissée en lorem ipsum retire de la séance ce que la séance sait le mieux voir.

Dessiné à la main

Le BABOK donne la raison: face à une maquette jetable ou papier, les utilisateurs peuvent se sentir plus à l'aise de la critiquer parce qu'elle n'est ni finie ni prête à livrer. Un écran imprimé et aligné au pixel appelle la politesse. La rugosité appelle la critique, et la critique est le produit.

Le deck se range

Il se range pour que l'ordinateur humain trouve n'importe quelle pièce en une seconde: par écran, par état, avec les messages d'erreur à part. Le Nielsen Norman Group nomme le désordre comme un mode d'échec de la technique, et le mécanisme est celui-ci: l'ordinateur fouille, la fouille insère une pause, la pause casse le fil du participant et la donnée se dégrade.

Deux couleurs de stylo

Une pour le dessin, une pour les corrections faites pendant et entre les séances. L'historique des corrections est un résultat en lui-même, et il reste visible sur la feuille.

Le script de tâches

Des tâches et non des questions

Une tâche énonce un but et une situation de départ, et elle ne nomme jamais l'élément d'interface qui l'accomplit. « Reprenez le même créneau que la semaine passée » est une tâche. « Touchez Mes rendez-vous » est une instruction, et une tâche qui nomme le contrôle a déjà répondu à sa propre question.

Les tâches se tirent du travail réel, celui que décrivent les cas d'utilisation et les scénarios du métier ou les récits utilisateur déjà écrits. Elles se classent du simple au complexe, et trois à six tâches remplissent une heure. Une carte par tâche, remise une à la fois, pour que le participant découvre chaque situation au moment où il doit la traiter.

Les quatre rôles

Le participant, le facilitateur, l'ordinateur humain, les observateurs. La technique se joue ici, sur ce que chacun s'interdit.

Le participant est un utilisateur représentatif: quelqu'un dont le travail est celui que l'interface sert, recruté en dehors de l'équipe et du projet. Il exécute la tâche et il pense à voix haute, sans arrêt.

Le facilitateur remet les cartes de tâche une à une, entretient la verbalisation et conduit le débriefing. Rettig pose la règle: ne jamais dire à l'utilisateur comment faire. À la question « qu'est-ce que je fais, maintenant? », il rend la question: « que feriez-vous? ».

L'ordinateur humain est une seule personne. Elle manipule le papier: elle change la feuille, pose le dialogue, découvre le message d'erreur, en réponse au doigt et à rien d'autre. Elle se tait. Snyder fait tenir la définition de la technique sur ce point exact: la personne qui joue l'ordinateur n'explique pas comment l'interface est censée fonctionner. Si le participant touche un endroit auquel le design n'a prévu aucune réponse, l'ordinateur humain ne fait rien, et ce silence est le résultat: il vient de mesurer un chemin absent, qu'aucun avis n'aurait signalé.

Les observateurs, c'est-à-dire le reste de l'équipe (concepteurs, développeurs, responsable produit), consignent. Rettig donne une discipline mécanique: un problème par fiche. Ils ne parlent pas, ne défendent pas le design et ne répondent pas à une question adressée à la salle.

Qui s'assoit au banc d'observation se décide avant la séance

La technique demande à une personne d'échouer à voix haute devant l'équipe qui a conçu l'objet, et elle demande à cette équipe de regarder sans secourir. Le banc est donc l'équipe de projet. La hiérarchie du participant en est tenue à l'écart: un collaborateur qui opère l'interface sous le regard de son supérieur cesse d'explorer et se met à réussir, et la donnée est morte avant la première carte de tâche. Quand le commanditaire veut voir, il regarde l'enregistrement, ou il suit la séance depuis une pièce voisine. Dans une organisation où l'on ne contredit pas un cadre à voix haute, c'est la composition de la salle, davantage que le script, qui décide de ce que la séance rapportera.

Un cinquième chapeau se porte par n'importe lequel d'entre eux, sans ajouter personne dans la salle: l'accueil, qui reçoit le participant, recueille son consentement et fait le préambule.

Conduire la séance

1. Le préambule
   « Nous testons le design, pas vous. Aucune action n'est fausse. Si quelque chose est confus, c'est le design qui est en cause. » Puis le consentement et la confidentialité. Le papier et l'ordinateur humain s'expliquent en deux phrases, une fois et sans s'excuser.
2. Une tâche d'échauffement
   Triviale, pour que le participant prenne l'habitude de parler en agissant. Personne ne pense à voix haute spontanément.
3. La pensée à voix haute
   Nielsen la décrit ainsi: on demande au participant d'utiliser le système en pensant tout haut de manière continue, c'est-à-dire en verbalisant simplement ses pensées à mesure qu'il progresse dans l'interface. Le facilitateur relance uniquement pour entretenir la verbalisation (« à quoi pensez-vous? »). L'avertissement de Nielsen: les interruptions et les questions de clarification modifient très facilement le comportement de l'utilisateur. Une séance mal tenue mesure alors la conversation.
4. Les tâches, une à la fois, dans le silence de la salle
   Le participant lit la carte, la pose et travaille.
5. Consigner le comportement
   Ce que le participant a fait, où le doigt a plané avant de se poser, ce qu'il disait en le faisant, ce qu'il attendait et ce qui est arrivé à la place. La question « aimez-vous cet écran? » rend un avis, et l'avis se recueille au débriefing de fin de séance, où il pèse ce que pèse un avis.

La boucle entre deux participants

La séance rend le comportement, la boucle le convertit en design corrigé et les deux sont la technique. Immédiatement après, l'équipe trie les fiches d'observation, groupe ce qui revient et arrête les changements ensemble, pendant que tout le monde a la scène en tête. Le changement se porte sur la feuille au stylo, ou la feuille se redessine en dix minutes, et le participant suivant teste le deck corrigé. Aucun prototype cliquable ne tourne à cette vitesse.

Snyder pose la limite de l'exercice: regarder un seul test vaut mieux que n'en regarder aucun, mais si ce test se révèle atypique, il peut fausser la vision de l'observateur sur ce qu'il faut changer. Trois à cinq participants, avec une correction entre chacun, est la forme habituelle. Nielsen chiffre le reste: cinq utilisateurs par étude et trois études de cinq valent mieux qu'une étude de quinze.

Portée et limites de la séance

Snyder énumère ce qui remonte: la plupart des problèmes d'utilisabilité, y compris les problèmes de concepts, de terminologie, de navigation, de flux de travail et de mise en page. Il faut y ajouter l'étape que l'utilisateur attendait et que le design n'a pas.

Restent hors d'atteinte l'esthétique, la couleur et la mise en forme graphique, qui ne rendent pas sur le papier ce qu'elles rendent à l'écran; la performance perçue et les temps de réponse, qui dépendent d'une machine; et toute interaction rapide, subtile ou continue, que l'ordinateur humain ne sait pas restituer. Le prototype interactif haute fidélité prend le relais sur ces questions.

Les pièges

La salle secourt

L'ordinateur humain lâche « non, en fait il faudrait toucher là », ou le facilitateur montre du doigt. Dans la seconde qui suit, la séance a cessé de mesurer l'interface et s'est mise à mesurer l'explication. Le silence est l'instrument, et il se tient par discipline.

Des questions à la place des tâches

Une question rend un avis, une tâche rend un comportement, et le comportement est le seul produit de la technique.

Tester avec des collègues

Ils connaissent le domaine, le vocabulaire et le flux voulu, donc ils ne trébuchent pas là où un utilisateur réel trébuche. La séance rend alors le modèle mental de l'équipe, blanchi par un tiers, et l'équipe s'en trouve confortée.

Le deck corrigé part comme spécification

Le BABOK décrit le mécanisme: les parties prenantes se fixent sur les spécifications de conception plutôt que sur les exigences auxquelles toute solution doit répondre, et les développeurs se croient tenus de reproduire le prototype au trait près. Sur un prototype papier, cela prend une forme précise: les feuilles corrigées passent aux développeurs comme cahier des charges, et l'exigence n'est jamais écrite. Ce que la séance a établi est une exigence, « l'utilisateur doit pouvoir retrouver un rendez-vous existant depuis l'écran d'accueil »; le post-it collé sur la feuille en est une réalisation possible. La première s'écrit et se suit. Le second se jette avec le papier.

Le deck sans script de tâches

« Ce n'est que du papier », donc rien à écrire d'avance. Un deck sans tâches est une démonstration, et une démonstration est une présentation où le concepteur tient le stylo.

Un deck en désordre

L'ordinateur fouille, la pause casse le fil du participant, et l'hésitation consignée est celle du papier.

Un prototype trop soigné

Des écrans imprimés appellent la politesse, et ils appellent aussi le débat sur la police de caractères, qui n'est pas la question du jour.

Réécrire le design après un participant

Un échantillon de un, dans lequel l'atypique pèse autant que le récurrent.

Personne ne consigne

Sans fiches, la boucle n'a pas d'entrée, et la séance était du théâtre bien joué.

Considérations IA

Un modèle de langage ne peut pas jouer l'ordinateur. La fonction entière de ce rôle est de retenir: répondre au doigt, n'expliquer rien, ne réparer rien. Un modèle sollicité pour tenir l'interface expliquera, aidera, complétera et pardonnera, c'est-à-dire qu'il produira le défaut que le rôle existe pour prévenir. L'instrument est une personne qui se tait.

Un modèle de langage ne peut pas être le participant. Un utilisateur synthétique ne trébuche pas là où un utilisateur réel trébuche, parce qu'il a, de fait, déjà lu le design. Un « test utilisateur simulé » rend l'a priori du modèle, et le seul produit de cette technique est le comportement observé. Un prototype papier éprouvé contre un modèle de langage n'a rien produit.

Le service que l'outillage rend se trouve autour de la séance. En amont: dégrossir les feuilles à partir d'une exigence ou d'un récit utilisateur, à charge pour l'équipe de les redessiner ensuite à la main, la rugosité étant une propriété recherchée; auditer le script de tâches en demandant explicitement si une tâche nomme un contrôle d'interface, ce qui attrape le défaut de rédaction le plus courant; remplir les feuilles d'un contenu suisse plausible (noms, adresses, NPA à quatre chiffres, dates, heures, montants en CHF) pour qu'un champ se lise comme un vrai champ. En aval: transcrire les fiches d'observation, regrouper les trébuchements récurrents, rédiger la liste des changements. C'est ingrat, c'est là que passent les heures, et cela se délègue sans dommage.

Les données. Une séance filmée dans un cabinet, avec une patiente réelle, produit des données sensibles au sens de la nLPD, parce que ce sont des données sur la santé. Consentement explicite et aucun enregistrement de séance déposé chez un prestataire sans contrat de traitement.

Exemples

Un cabinet de physiothérapie met en ligne la prise de rendez-vous. L'écran est dessiné, rien n'est codé. Une patiente du cabinet vient une heure: une collègue joue l'ordinateur, une deuxième facilite, une troisième consigne. Cinq tâches, cinq cartes, remises une à une.

Les cinq lignes disent ce que la participante a fait. C'est la matière que la technique produit; ce qu'elle pense de l'écran se recueille au débriefing, où il pèse ce que pèse une impression.

Les deux lignes où la troisième colonne dit « rien » sont les plus chères de la séance, et elles n'existent que parce que l'ordinateur humain s'est tu. Une personne qui aurait répondu « c'est dans le menu, en haut » aurait effacé la découverte sur-le-champ, et le journal aurait rendu trois lignes au lieu de cinq.

Les cinq corrections tiennent au stylo et sur les feuilles existantes: un post-it, deux libellés, un champ ajouté, un contrôle déplacé. La participante suivante teste le deck corrigé dans la foulée.

Visualisations

Trois figures portent cette technique. Le croisement des deux axes situe la technique parmi ses voisines: une méthode et une seule case sur l'axe de l'approche. La séance montre la salle et la boucle qui la traverse, du doigt du participant à la feuille changée, de l'hésitation consignée à la feuille reprise au stylo, puis au participant suivant. Le journal de séance montre ce que tout cela produit: cinq tâches, cinq comportements observés et les corrections qu'ils ont déclenchées.

La figure de la séance se relit comme une liste de contrôle, et une séance réelle doit répondre oui à ses quatre questions. Le participant vient-il de l'extérieur de l'équipe? L'ordinateur humain est-il une seule personne, et se tait-elle? Quelqu'un consigne-t-il, une fiche par problème? La feuille a-t-elle été reprise avant le participant suivant? Une séance à laquelle cette dernière boucle manque a produit une liste de problèmes, là où la technique promettait un design corrigé.

Coût

Outils

Le matériel tient dans une boîte: feuilles A3 ou A4 pour les fonds, fiches cartonnées pour les dialogues, les menus et les listes, post-it pour les infobulles et les messages d'erreur, bandelettes de papier pour le contenu d'un champ, ciseaux, étiquettes vierges ou correcteur, deux couleurs de stylo. Un rhodoïd posé sur la feuille, avec un feutre effaçable, laisse le participant saisir dans un champ sans abîmer le deck. Un appareil photo ferme la séance: on photographie chaque état du deck, parce que le deck est l'archive.

Pour un banc d'observation distribué, une caméra de document (ou un téléphone monté en potence) et un appel vidéo suffisent à faire voir la table. La séance y perd: la latence de l'ordinateur humain augmente, le doigt du participant devient un curseur, et les observateurs cessent de réagir ensemble. Cela se pèse contre le coût du déplacement.

Le journal de séance vit dans un tableau ou une feuille de calcul, une ligne par problème observé. Les corrections qui deviennent des demandes de changement passent ensuite au suivi des items, qui existe pour cela.

Les outils de maquettage interactif (Figma, Axure et leurs pareils) sont la sortie de la technique. Dès que les feuilles deviennent cliquables, l'ordinateur humain disparaît, et avec lui le silence qui était l'instrument. On y passe quand l'interaction devient trop fine pour le papier, et ce passage est un changement de technique, décidé comme tel.

Sources

• IIBA, A Guide to the Business Analysis Body of Knowledge (BABOK Guide) v3, §10.36 Prototyping: le prototypage papier comme l'une des méthodes de prototypage, la séparation de l'axe de l'approche et de l'axe de la méthode, l'observation que les utilisateurs se sentent plus libres de critiquer une maquette qui n'est ni finie ni prête à livrer et le risque que la conception prenne la place de l'exigence.
• Carolyn Snyder, Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces, Morgan Kaufmann: le traitement de référence, la définition de la technique comme un test d'utilisabilité dans lequel une personne joue l'ordinateur sans expliquer l'interface, ce que la séance trouve, ce qu'elle laisse et la limite de la séance unique.
• Marc Rettig, Prototyping for Tiny Fingers, Communications of the ACM 37(4), avril 1994, pp. 21-27: l'origine du prototypage papier, les rôles de la séance, la règle du facilitateur qui ne dit jamais comment faire, un problème par fiche et l'argument économique de la technique.
• Jakob Nielsen, Thinking Aloud: The #1 Usability Tool, Nielsen Norman Group: le protocole de la pensée à voix haute et l'avertissement sur les interruptions qui modifient le comportement de l'utilisateur.
• Nielsen Norman Group, UX Prototypes: Low Fidelity vs. High Fidelity: les limites de l'ordinateur humain, le rôle du rangement du deck et le moment où le prototype interactif haute fidélité prend le relais.
• Jakob Nielsen, Why You Only Need to Test with 5 Users, Nielsen Norman Group: le nombre de participants par étude et le fait que trois études de cinq valent mieux qu'une étude de quinze.