Scénariser votre expérience utilisateur

La salle d’un fast-food, en septembre dernier. Quelques tables en bois de style Ikea, les spécialités de burgers maison dessinées à la craie sur les murs. Je suis assis là, avec mon collègue Gilles à discuter de notre travail, de nos convictions et de notre métier.

« On pourrait faire mieux. Par exemple, pourquoi affiche-t-on encore le menu dans notre tunnel d’achat ? ». Gilles à raison. Moi même j’apprécie tellement la simplicité. Une commande sur internet doit-être aussi simple que d’acheter du pain chez le boulanger. « C’est comme le champ des codes promos, c’est frustrant de ne pas pouvoir le remplir. Cela rappelle que l’on ne dispose pas de promotions. On devrait le cacher par défaut et ne l’afficher qu’au besoin. »

« Vous avez fait votre choix ? » interrompt la serveuse. « Deux burgers, et la cuisson ? ». « Avec ceci, vous souhaitez boire quelque chose ? » nous demande-t-elle encore en récupérant les menus.

Encore aujourd’hui sur beaucoup de sites de commerce en ligne après avoir cliqué sur le bouton « Ajouter au panier », l’utilisateur reste sur la page du produit qu’il a déjà acheté. Nous privilégions ces petites animations qui incrémentent, à l’autre bout de la page, un petit compteur. Fiers de nous, nous en profitons pour montrer à quel point nous maitrisons je ne sais quelle technologie ou framework JS ou CSS à la mode. Mais on se voile la face sur les problèmes de cette fausse bonne solution. Compatibilité, erreurs, l’animation qui s’exécute à l’autre bout de la page…

La jeune serveuse est plus intelligente que nous. Elle ne s’est pas créée ce problème en voulant utiliser une nouvelle technologie tendance. Une fois notre commande notée sur un carnet, elle nous débarrasse de nos menus pour nous proposer autre chose comme un supplément ou un apéritif.

Inspirés par cette serveuse, nous avons retravaillé l’expérience de nos pages. Grâce à ces nouveautés nous avons pu épurer notre tunnel de toutes recommandations de produits. Une nouvelle page a été introduite remplaçant nos fioritures et nos animations de panier. Nous avons ainsi pu introduire notre équivalent du « Avec ceci, vous souhaitez boire quelque chose ? ». Nous avons également enlevé le menu de notre processus de commande. Car finalement, on nous retire bien le menu pour nous laisser manger tranquillement au restaurant. Bref, d’une histoire, d’une scène de vie, nous avons beaucoup appris.

« Vous avez fini ? Tout s’est bien passé ? Est-ce que vous prendrez un dessert ? ». Revoilà cette serveuse qui, tout en ramassant les assiettes vides, nous propose de continuer l’expérience. C’est en me redressant sur le dos de ma chaise, repu, que je me laisse tenter par un cheesecake maison.

Vous avez réussi. Votre site est un enchaînement de belles pages que vous avez conçues avec amour et dans le respect de toutes les bonnes pratiques. Si vous êtes vraiment bon, vous avez même réussi à y intégrer un effet visuel ou une nouveauté technique intéressante, dont vous êtes particulièrement fier. Pourtant cela ne fonctionne pas. Vos utilisateurs ne comprennent pas le sens de tout cela.

Lorsque Gilles et moi avons passé la porte du restaurant à midi, nous avions faim. Nous nous posions beaucoup de questions sur notre produit et nous étions également stressés par notre matinée de travail. Nous nous sommes assis, avons commandé puis attendu nos plats tout en débattant encore de nos problèmes. Une fois nos burgers avalés, nous n’avions plus faim. C’est en assouvissant ma gourmandise avec un cheesecake que mon stress a commencé à retomber. Enfin, en sortant du restaurant nous nous sommes aperçus que la jeune serveuse avait apporté la solution à nos problèmes de travail sur son plateau.

Au début de cette histoire, trois conflits sont ouverts. La faim, les problèmes de boulot et le stress. À l’instar de vos utilisateurs, nous avons commencé à utiliser un service avec nos problèmes. Notre histoire de burgers se divise en trois actes où chacun d’entre eux a provoqué un renversement de valeurs puissant. En mangeant mon burger, je n’avais plus faim. Mais en discutant avec Gilles de notre travail j’étais peut être encore plus stressé par la charge de travail qui nous attendait. L’effet du sucre de mon cheesecake a calmé mon stress. Ainsi apaisés, nous avons pris conscience que la réponse à nos préoccupations étaient devant nos yeux.

Cette découpe d’une histoire en actes, séquences et scènes correspond aux techniques utilIsées par les scénaristes pour écrire leurs histoires. Ils manient l’art de structurer leurs récits en trois, cinq ou sept actes où chacun fait évoluer leurs personnages. En alternant effets positifs et négatifs, hauts et bas, succès et échecs au fil de l’intrigue.

« Messieurs, des cafés ?» interrompt la serveuse une fois nos desserts avalés. Nous n’en prendrons pas. Bientôt quatorze heures, il faut retourner au bureau. « Non merci, pouvez-vous nous apporter l’addition ?» demande Gilles.

Nous, concepteurs et designers d’application avons aujourd’hui bien intégré l’importance de dessiner des personas dans nos phases de création. Pour réussir, nos personna(ge)s doivent changer au cours de leur expérience avec nos services. Si ils sont frustrés ou en quête de quelque chose avant d’arriver, ils doivent bien évidemment avoir vécu un changement qui les satisfait après leur départ.

En 2006, la designer Stefanie Kraus a réalisé un travail très intéressant pour Yahoo!. En prolongement à ce travail d’étude sur les personas, elle a crée des planches de storyboard décrivant les différentes scènes de son histoire. La piste est intéressante. L’idée étant que si vous utilisez la technique des personas, mettez-les en scène afin d’identifier leurs conflits et ce qui peut faire basculer leurs valeurs. D’ailleurs, certains de mes personnages sont devenus plus que de simple fiches. Je leur ai donné vie : adresses emails, comptes de réseaux sociaux, … Ce travail schizophrène d’auteur m’apprend beaucoup sur ce que peuvent ressentir mes personas face à mes projets mais également vis à vis d’autres applications.

Quelques jours après notre expérience au burger store, Gilles me dira ces mots qui ont inspiré mon article lors d’une réunion de travail : « Une fois que j’ai passé commande au restaurant, je n’ai plus besoin de garder le menu à table. J’ai déjà fait mon choix ». Ces mots résonnent encore et ont pris une véritable dimension.

J’appréhende désormais chacune de mes pages web comme une scène. Robert McKee, scénariste consultant a Hollywood, définit une scène comme une action née d’un conflit dramatique qui se déroule dans un continuum spatio-temporel qui transforme au moins l’une des valeurs du protagoniste de façon significative. Idéalement chaque scène doit correspondre à un événement narratif.

En nous proposant un café après notre dessert, la serveuse revient vers nous pour nous inciter à avancer dans notre histoire. Elle introduit une nouvelle péripétie à ses personnages pour les faire progresser vers la fin du récit. Je suis persuadé par exemple qu’un serveur a déjà dû vous porter une addition que vous n’aviez pas encore demandé à votre table. Simplement car vous attendiez là, sans rien commander. Parfois même certains serveurs malicieux agrémentent cette péripétie d’un digestif ou d’une friandise. C’est normal : les récits fonctionnent mal quand l’intrigue stagne.

« Cela vous a plu ? » demande avec le sourire la serveuse pendant qu’elle nous invite à saisir les codes de nos cartes bancaires au moment de régler la note. Avant de nous proposer une carte de fidélité pour nos prochaines visites.

Les points à retenir

  • Utilisez vos personna(ge)s pour leur faire vivre votre service,
  • Identifiez les différents évènements narratifs de votre expérience utilisateur,
  • Chacune de vos pages doit correspondre à une scène de votre histoire,
  • Chaque page contient un renversement dramatique qui amène un changement de valeur de votre persona,
  • Vos scènes doivent être structurées en séquences et en actes.

Pour aller plus loin

4 commentaires sur cet article

  1. Stéphane Deschamps, le dimanche 6 décembre 2015 à 10:22

    Très chouette histoire, merci de l’avoir partagée.

  2. Raphaël Y., le dimanche 6 décembre 2015 à 11:49

    L’histoire est jolie et peut effectivement amener à réfléchir, mais je suis assez en désaccord avec la conclusion.
    Il faut bien voir que les utilisateurs ne vont pas faire ce que le concepteur a prévu qu’ils feraient. Ils vont aller prendre un café au milieu du processus d’achat, ou faire trois fois le tour de leur appart pour trouver cette fichue carte bancaire, ou …
    Donc il faut aussi toujours prévoir que le site Web ne sera pas utilisé comme prévu ! D’où la présence d’un menu « permanent et stable » qui sert de point de repère, d’élément de réassurance. Il ne faut pas confondre simple et simpliste.
    Imagine un site où tu commandes une partie des choses, tu attends que ça soit livré, puis tu recommandes la suite, tu attends la livraison, et enfin tu payes !

  3. Thomas Gasc, le dimanche 6 décembre 2015 à 12:36

    @Raphael : d’ou la nécessité de faire vivre tes personnages. De le remettre dans un contexte de vie pour comprendre ces usages (exemple, le cas de Yahoo !).
    Un site ou tu commandes une partie, tu te fait livrer, puis tu recommandes avant de payer. Au final, c’est une épicerie ou un bar qui te ferait crédit : c’est une autre histoire à raconter.

  4. Christophe C., le mardi 8 décembre 2015 à 18:16

    Sympa cette histoire. En « mode web » non utilisé comme prévu, ou en « mode restaurant » avec des imprévus, tu peux toujours demander l’accès au burger-menu ! :)

    Seul bémol : je n’aime pas attendre sur le web le paiement de mes achats en sirotant les dernières larmes d’un excellent vin partagé. Mais j’y arriverai peut-être un jour…