Loading

Compétence indispensable d’un UX Designer, le storytelling constitue un atout de l’amélioration d’une expérience utilisateur. Au fil des siècles, la manière de raconter une histoire a toujours été importante. Et l’environnement web ne fait qu‘amplifier et bonifier les méthodes de storytelling. Pour avoir une idée plus claire sachez que communication rime avec message à transmettre et histoire à faire comprendre. Or, et même si on le sait moins, l’interface d’une application ou d’un site a une possibilité infinie de “raconter une histoire“.

 

Storytelling : les dessous de l'interface web Cliquez pour tweeter

 

untitled-1

Le design est storytelling, 

 

Le pouvoir du storytelling

Comme l’UX design, le storytelling ne date pas d’hier. Par exemple, les anciennes civilisations utilisaient le storytelling. Les recueils religieux utilisent le storytelling. Les hommes politiques utilisent le storytelling. Même NewflUX utilise le storytelling.

 

storytelling-newflUX-ux

 

Le fait de raconter une histoire constitue un storytelling, avec l’envie d’attirer l’attention de l’auditeur jusqu’à la fin de l’histoire. Quand un journaliste espère que son article soit lu et compris jusqu’au bout par son lecteur (et c’est pas si facile), un site web visera un objectif qu’il espère voir accomplir par son utilisateur. Peu importe les secteurs et les services impliqués, le storytelling est applicable.  Les histoires changent mais les méthodes sont sensiblement les mêmes. Le plus difficile c’est de faire correspondre l’histoire avec l’ADN de marque, le tout en utilisant les procédés graphiques adéquates.

Concrètement les bénéfices du storytelling pour une marque :

  • Une histoire apporte de l’ordre et du sens à un récit en clarifiant les points complexes
  • Une histoire améliore la mémorisation d’un produit / service
  • Une histoire dévoile implicitement des émotions et des sensations aux clients
  • Une histoire persuade là où les faits échouent
  • Une histoire va humaniser  et personnaliser une enseigne en la rendant unique

Le storytelling appliqué au web va apporter des émotions positives à l’utilisateur en le mettant à l’aise et en installant un climat de confiance. Dans le but de générer du bénéfice et des avantages de cette conversion.

“when organizations, causes, brands or individuals identify and develop a core story, they create and display authentic meaning and purpose that others can believe, participate with, and share.”

De Pamela Brown Rutledge, dans son article : “The psychological Power of Storytelling

 

storytelling

L’histoire prend tout son sens dans le contexte qu’on lui donne. 

 

Le storytelling : un processus de longue haleine

Pour encore faire une comparaison avec les livres, le storytelling d’un site web doit rester cohérent entre l’image qu’il dégage et ce qu’il propose à ses utilisateurs. C’est comme pour la dernière de couverture d’un livre et l’histoire qu’il raconte. Pour le genre littéraire, il doit rester le même et être cohérent tout le long de l’oeuvre. Pour un site ou une application il faut que les émotions perçues restent les mêmes tout le long d’une navigation. C’est pourquoi il est préférable de l’impliquer dès la création d’une marque ou d’une enseigne.

En effet lorsque le storytelling est appliqué dès le fondement d’un site web ou d’une application, il est plus efficace. Le contenu est la base d’une histoire bien ficelée. L’écriture et sa mise en page ont un impact direct avec la perception qu’aura le lecteur. Ainsi l’architecture de l’information, les caractéristiques graphiques et la disposition de l’interface doivent être cohérentes avec l’histoire de marque. Les éléments d’interface sont à un site web ce que les pages sont à un livre, c’est-à-dire un support. Un livre pour enfant a des pages épaisses et résistantes, avec plein d’images et du texte écrit distinctement.  Le storytelling de ces livres est prévu pour les enfants et c’est ainsi que ça fonctionne, pour le web c’est pareil.

Il faut alors encore une fois bien choisir sa cible dès le départ. Dans le même principe qu’une cible marketing, il faut élaborer un persona du lecteur type.

Avec comme principaux critères d’élaboration du persona :

  • Ses habitudes de lecture d’une page
  • Ses moyens de navigation sur Internet
  • Les émotions qui le sensibilisent le plus
  • Les causes qu’il serait prêt à défendre
  • Le ton de communication qui le touche le plus

Une fois qu’on sait comment atteindre nos clients, il faut savoir quoi leur raconter. Et comme dans toutes les histoires, il faut un “héros” et un “méchant”. Pour que l’utilisateur puisse s’attacher à la marque, et s’approprier sa notoriété, il faut une icône. Cela va apporter de l’originalité à votre storytelling et c’est ce qui va vous différencier des concurrents.  Si juste en changeant le nom de l’enseigne, l’ADN de votre marque est la même que vos concurrents, c’est que c’est un échec. Si une marque explique ses motivations, ses ambitions et ses techniques de création, le consommateur percevra ce désir de transparence et se sentira d’avantage rassuré. Le reflet d’une marque doit être unique et particulier. Il doit commencer à la source d’un produit pour finir dans la main du client, en passant par ses émotions, donc son cœur.

 

storytelling-by-Tanya-ZlebnikLes exemples de la vie sont les meilleurs moyens de raconter des histoires. by Tanya Zlebnik

 

Comment incorporer le storytelling à son site

Une histoire bien racontée, c’est une histoire imagée, dans tous les sens du terme. Ainsi dans l’interface web, l’illustration va prôner sur le reste quant à son impact sur l’utilisateur. Les forces cognitives d’un visuel permet à un utilisateur d’absorber 75% d’information en plus. Mais le contexte et la mise en situation des éléments constituant la page servira de fil conducteur.

L’interactivité du web permet de tirer parti de l’expérience utilisateur. Objectif : améliorer l’histoire racontée par le contenu et les visuels en guidant habilement les utilisateurs à travers le site vers leurs objectifs, grâce au défilement de l’histoire citée. De plus vous leur offrez la possibilité de créer leur propre histoire à travers la navigation d’un site ou d’une application. Raconter une histoire en s’appuyant de l’interactivité d’un site peut informer les utilisateurs sur comment se déplacer de page en page. Et ainsi rassurer l’utilisateur sur “ce qui arrive après” en apportant de l’évidence dans la continuité de la navigation ainsi que dans la structure des pages.

 

by Kevin Kalde

Un exemple de storytelling appliqué à un produit par uformit

 

La page “About” qui généralement comporte résumé, récit, épopée et équipe de l’entreprise, est trop souvent délaissée. Pourtant c’est l’élément clé d’un bon storytelling. C’est là qu’on peut créer des personnages et donner un ton éditorial à l’histoire. C’est un bon moyen d’incorporer du storytelling sans affecter directement la perception des utilisateurs lors de leur arrivée sur le site.

La vidéo est le support le plus approprié pour raconter une histoire rapidement et facilement. En background et/ou en lecture automatique, l’animation attire le regard. Néanmoins il faut rester mesuré quant à son message et sa durée, pour ne pas donner l’impression de soumettre une auto pub.

Les mots ont leur importance, et je ne parle pas des longues phrases explicatives, ou des articles de blogs ( qui peuvent aussi contribuer au storytelling). Mais je parle des mots et intitulés qui vont constituer un site. Le nom des pages, les labels des boutons/menu, les phrases descriptives ou engageantes. “Every single word matters”  c’est ce qu’on doit garder à l’esprit.

Les réseaux sociaux sont le lien entre votre histoire et vos lecteurs, un réel outil pour communiquer avec sa clientèle et avoir des retours sur leurs impressions. La connexion avec le client est facilitée et personnelle. Un bon moyen pour créer une communauté engagée autour de votre marque. L’essence même d’un storytelling, les plateformes sociales permettent d’enrichir la stratégie de communication d’une entreprise. En utilisant les particularités de chaque réseaux, les possibilités de se démarquer sont énormes.

Le storytelling est transcanal et il suit les utilisateurs tout le long de leur voyage à travers l’enseigne. Cependant il faut savoir le modérer pour ne pas le rendre intrusif aux yeux des clients.

Des exemples pour votre inspiration

SuperTopSecret place la barre très haute niveau storytelling animé. Un rendu magnifique, captivant et très peu intrusif. Je laisse à vos yeux le libre arbitre.

top-secret-storytelling

Un site d’agence pas comme les autres ! 

 

Peugeot pour la promotion de sa technologie Hybrid4 a misé à 100% sur le storytelling en animant une bande dessinée. Une immersion totale avec un lancement automatique de l’animation et du son. Bien que dans ce cas là le procédé soit totalement maîtrisé, il est très difficile d’employer uniquement le storytelling.

11_hybrid

Une bande dessinée animée comme au ciné ! 

 

Evoenergy utilise le storytelling pour parler d’une cause environnementale qui souvent à des effets soporifiques. Pourtant ici la mise en situation de la data est totalement interactive et accompagnée. Des couleurs vives, des icones distinctifs, peu de texte et des nombres affichés en grand, tout y est pour attirer l’œil.

24_ukenergyguide

Une belle façon de montrer des datas et des graphiques 

 

ThinkGreenMeeting introduit son business grâce à la “gamification“, lorsque la souris passe sur une voiture ou un avion, il disparaît. Cela attire et intrigue l’utilisateur et dans la majorité des cas il va essayer d’en arriver au bout. A la fin du “jeu” c’est le moment d’afficher un message impactant qui a pour ambition de convertir celui qui le lit.

13_thinkgreen

C’est toujours mieux quand on peut jouer

 

Bagigia présente son produit dans tous les sens en employant le scrolling. Le contexte soigné (menu et scroll bar en cuir) rajoute un environnement à l’histoire de l’objet et crédibilise sa qualité.

16_bagigia1

Décrire pas à pas les qualités d’un produit

 

Lapka a su profiter des gros plans de haute qualité pour illustrer son produit. La simplicité et la sobriété amènent souvent l’utilisateur à se focaliser sur un seul élément. Ce qui peut être intéressant lorsqu’il s’agit de votre source de revenus. Cependant il faut faire attention à  indiquer une description du produit/service s’il n’est pas évident.

25_lapka

Une évidence qui tombe sous le sens

 

MoMa Century of the Child, un véritable musée en ligne mais qui n’en a pas l’allure. Un univers voluptueux rempli de découvertes animées et d’objets incontournables. Un vrai plaisir de navigation, bien que le site ne soit pas adapté aux petits écrans.

01_centuryofthechildUn musée où on voit pas le temps passer

 

Le storytelling est bien-sûr applicable de manière moins évidente, il suffit parfois de juste une touche pour faire la différence. Le principal c’est de provoquer un effet de surprise dans la navigation des utilisateurs, le reste viendra au fil de l’histoire.

 

En prime un outil WordPress (gratuit) pour faciliter l’écriture de vos “histoires” sur votre site. Storytelling.io 

Capture d’écran 2015-06-23 à 15.56.15

Le storytelling, le début d’une histoire sans fin… ( Merci pour le logo by David Massiani )

 

Source : dTelephathy , webmarketingToday, WebstandarsSherpa, blogDuModerateur

Do you like Hugo Vermot's articles? Follow on social!
People reacted to this story.
Comments to: Storytelling : les dessous de l’interface web
  • 19 septembre 2017

    Bonjour, l’article est parfait : c’est exactement ce que l’on recherche : exemples, compréhension rapide…
    l’outil Storytelling.io me renvoit sur un site internet et non sur un plugin. Il n’existe plus ?

Write a response
Inscription obligatoire et gratuite

Suivez toutes nos actualités

Ne manquez pas un article ! Toutes les nouveautés directement dans vos emails.

ARTICLES LES PLUS APPRÉCIÉS

Articles des membres

Devenir un community manager n’est pas une tâche facile. Cela demande beaucoup de travail, de dévouement et, surtout, de bonnes compétences. Un community manager doit posséder des compétences exceptionnelles en matière de communication, être capable de gérer des situations difficiles et de réfléchir rapidement. Ils doivent également avoir une connaissance approfondie des produits ou services […]

LES NOUVEAUX ARTICLES

  1. Actualités
Cela n’est plus nouveau, la cybersécurité est un enjeu crucial pour toutes les entreprises et organisations qui utilisent des systèmes informatiques. Mais, en même temps, l’expérience utilisateur (UX) est également devenue un facteur clé pour la bonne utilisation des systèmes. Malheureusement, ces deux objectifs ne vont pas toujours de pair. En effet, sécuriser quelque chose […]
  1. Articles des membres
Devenir un community manager n’est pas une tâche facile. Cela demande beaucoup de travail, de dévouement et, surtout, de bonnes compétences. Un community manager doit posséder des compétences exceptionnelles en matière de communication, être capable de gérer des situations difficiles et de réfléchir rapidement. Ils doivent également avoir une connaissance approfondie des produits ou services […]