Galileo.ai fait la promesse, tout comme Relume, de générer un site à partir d’un descriptif. Voici donc l’essai de Galileo.ai.
Plus exactement, Galileo est plutôt un outil de génération de wireframes soit à partir d’un prompt, soit à partir d’une image. Cela revient au même, car l’image est simplement analysée par une IA puis transformée en prompt. A partir de là, Galileo va faire le même travail de conception et, à partir d’un simple phrase générer plusieurs wireframes.
Essai de Galileo.ai : Une interface inspirée de chatGPT
L’interface ressemble beaucoup à celle de chatGPT à une différence près, c’est qu’il est possible d’éditer les wireframes qui sont générés. On retrouve la même organisation de page, ce qui n’est pas à l’avantage de Galileo, quand on considère l’ergonomie assez faible de chatGPT.
On l’a donc essayé pour vous et, honnêtement, on n’a pas été très emballé.
Deux mode de génération possible
Galileo.ai fonctionne sur le même principe technologique que Relume. C’est à dire qu’après avoir analysé un prompt, le programme se charge de générer des composants UI avec des images et du texte, eux aussi générés par une IA.
Evidemment, ça fonctionne parfaitement bien du moment qu’on ne cherche pas à avoir de résultats précis. C’est à dire que oui, l’IA sait générer un wireframe, mais c’est comme ouvrir un œuf surprise, on ne sait pas vraiment ce que l’on va obtenir.
Un outil très facile à prendre en main
Pour voir comment cela se passe, nous avons essayé de refaire le site de Wexperience.
Démarrage du dialogue avec Galileo
Notre premier prompt consiste à décrire ce que fait notre agence.
Le deuxième prompt est simplement une invite à générer notre site. Rien de plus facile et simple.
Galileo propose de lui même une arborescence de site et demande plus de détails. A ce stade là, nous pensons qu’il a déjà suffisamment d’informations pour se débrouiller.
Suite au premier prompt, Galileo propose de lui même une arborescence de page et de contenus. Il ne nous reste qu’à valider ou à ajuster la demande. Cela rappelle vraiment très fortement la manière d’interagir avec chatGPT.
Interface de génération de wireframes. L’inspiration vient de Midjourney. 4 maquettes de pages sont générées en même temps. C’est beaucoup moins fun que ce que propose Relume où l’on voit se générer les pages devant nos yeux.
En quelques secondes, on récupère plusieurs propositions de maquettes mobiles.
Après quelques moulinets, le résultat apparait. Bien sûr, nous n’avons pas utilisé un prompt très précis… mais, étant donné l’interface sous forme de chatbot, ça aurait été assez compliqué et fastidieux.
Le résultat est plutôt simpliste et sans intérêt. Les maquettes proposées sont très génériques, et leurs contenus pas du tout spécifiques. On comprend alors que Galileo n’est pas du tout allé chercher les contenus de notre site actuel et propose une sorte de résultat standard sans grand intérêt.
On a d’ailleurs refait le test avec un autre sujet et le résultat n’est pas franchement plus convaincant.
Il n’est pas possible d’éditer directement les maquettes dans Galileo. Deux possibilités s’offrent alors : apporter quelques modifications à l’aide de boutons de raccourcis ou bien copier-coller la maquette dans Figma.
Modification des maquettes par prompts
La manière la plus originale de modifier une maquette, c’est de pouvoir le faire à partir d’un autre prompt. Exactement comme dans Dall-E. C’est un avantage évident par rapport à Relume, car elle tire parti à plein des avantages de l’IA génératives.
Exemple de prompt de modification d’une maquette.
Après instruction à Galileo, la prise en compte du prompt n’est pas tout à fait complète. On avait demandé du jaune, mais rien n’a changé. Par contre, le bouton « Contactez-nous » a bien été ajouté.
Modification des maquettes par boutons de style
Fonctionnalité intéressante de Galileo, la possibilité d’éditer les contenus d’un résultat avec quelques boutons de style.
L’outil semble vraiment s’adresser à des gens sans connaissance de conception plutôt qu’à des professionnels du design. Comme vous le voyez, le petit bouton Figma permet de copier-coller les templates dans Figma. C’est plus intuitif que dans Relume, mais ça ne permet pas de récupérer tous les wireframes en une fois.
Essai de la fonctionnalité de génération de maquette par insertion d’image
Galileo permet aussi de trouver de l’inspiration en utilisant d’autres maquettes de site. Par curiosité, nous avons aussi essayé cette fonctionnalité en proposant de refaire notre site en partant de sa homepage actuelle.
Interface de création de template à partir d’un autre template de site. Non seulement, il est possible pour l’utilisateur de télécharger une capture d’écran, mais il peut aussi y ajouter un prompt et paramétrer un thème.
Résultat d’un template généré à partir d’une capture d’écran de template.
Nous n’avons fait qu’un essai, mais le résultat ne nous semble pas probant, tant il est éloigné de la proposition de départ. A tel point que l’on peut se demander l’intérêt d’une telle fonction.
Conclusion : un produit encore en gestation qui s’adresse à une population de non designers
Pour nous, Galileo.ai est encore loin d’être un outil utilisable. Le peu de tentatives que nous avons réalisées nous laissent vraiment sur notre faim.
Il faudra sans doute attendre encore pas mal de temps avant de pouvoir en tirer quelque chose, contrairement à Relume qui est vraiment exploitable.
On ne voit pas bien qui pourrait utiliser Galileo dans un mode projet. L’outil semble encore bien trop sommaire pour être exploité de manière professionnelle.
Cet article est une analyse UX d’AirBNB Winter edition, la dernière version de l’application mise à jour en novembre 2023. Vous trouverez l’analyse en détail des améliorations apportées et quelles leçons en tirer.
Il est toujours intéressant de regarder ce que fait AirBNB en matière d’UX, car c’est vraiment une entreprise drivée par le design. Et contrairement à beaucoup d’autres sites ou apps, on peut être sûr que lorsqu’elle fait une mise à jour, celle-ci a largement été éprouvée.
Quelles sont les évolutions qui ont eu lieu et quels enseignements en tirer ?
Meilleure mise en avant des meilleurs hôtes
On ne fait jamais assez bien les choses. 😁
Un des problèmes évident d’AirBNB, c’est de parvenir à garantir la prévisualisation d’un logement par rapport à la réalité. Et pour cela, les équipes de recherche d’AirBNB se sont rendus compte que les utilisateurs ne pouvaient pas se fier uniquement aux photos.
Un nouveau label qualité
Elle a donc fait des recherches et en a tiré la conclusion qu’il fallait créer un nouveau niveau de notation des hôtes qu’ils ont appelé Coup de cœur des voyageurs.
C’est une sorte de label qui est décerné par les clients de AirBNB aux meilleurs hôtes.
Une fois ce choix adopté, se posait ensuite la question de savoir comment le faire connaître aux internautes et comment les aider à le repérer dans les longues listes de logements.
Mise en avant par un « sticker » dans les listes produit
Ne vous attendez pas à quelque chose d’extraordinaire. Les meilleurs hôtes sont désormais repérables par une nouvelle étiquette « Coup de cœur des voyageurs » ajoutée aux photos dans les listes de logements.
Ça n’est évidemment pas grand chose d’un point de vue design, mais ce qui est intéressant ici, c’est le processus qui a mené à un tel choix. On est parti d’un problème : la déception de certains clients par rapport aux photos, pour arriver à une solution : la création d’un nouveau statut pour les hôtes.
Ne restait plus alors qu’à le mettre en œuvre d’un point de vue design, ce qui n’était pas le plus compliqué.
Analyse UX d’AirBNB : commentaires et évaluations repensées
On sait aussi très bien que les choix des clients d’un site se font beaucoup en fonction des avis laissées par les autres clients. C’est même primordial ! Ne pas avoir d’avis sur un site de ecommerce, c’est comme de n’avoir pas d’autres personnes en rayon dans un magasin. C’est louche !
371 millions de commentaires à gérer
AirBNB a constaté que même avec 371 millions de commentaires (!!!) laissés sur son site, beaucoup d’utilisateurs ne parvenaient pas à y trouver leur compte et avaient encore du mal à prendre une décision.
La nouvelle version de l’app essaie de rendre les choses plus compréhensibles et plus perceptibles (n’oubliez pas qu’en UX, tout se passe dans la tête des gens).
Ainsi est-il possible désormais de mieux comprendre quel type de client (couple, famille, etc.) a laissé un commentaire. Ce qui est important pour celui qui regarde les commentaires. Il est plus facile de juger un avis si on sait par qui il a été émis.
Ce n’est pas le design qu’il faut regarder, mais le travail de recherche qui a été fait avant
Là encore, on ne va pas sauter au plafond pour le résultat en terme de design. On ne fera que répéter une chose : le design n’est que la partie émergée de l’iceberg de l’UX. Il n’est que l’aboutissement de la recherche. Autrement dit, un design sans recherche, c’est un peu comme un iceberg sans fond… hum hum… si vous voyez ce qu’on veut dire.
Trop de gens l’oublient et pensent que le design peut sortir tout droit du cerveau de l’UI designer… alors que c’est impossible. Un design, on vous le répéte, n’est que l’expression d’un besoin utilisateur qui nécessite de longue s recherches personifié en une suite de signes graphiques (hou là là, on vous prend la tête là, mais c’est pourtant vrai).
Des outils qui simplifient l’expérience des hôtes
Il ne faut pas l’oublier : AirBNB, ça n’est pas que pour des gens qui cherchent un logement, c’est aussi pour ceux qui en proposent un. Et là aussi, la société californienne a fait beaucoup d’efforts pour rendre leur expérience plus simple, mais aussi (et c’est très important) pour les aider à mieux louer leur logement.
L’UX = utilisation de la technologie et du design
Et l’UX, si vous l’aviez aussi oublié, c’est l’utilisation conjointe de la recherche (on vient d’en parler) et de la technologie. On parle, par exemple, beaucoup d’IA, en ce moment. Et souvent à tort et à travers. Mais, ici, par exemple, on comprend très bien comment elle aide à améliorer l’UX.
En effet, pour faire gagner du temps, l’IA d’AirBNB, après avoir été nourrie de millions de photos de logement, peut automatiquement détecter à quelle pièce d’un logement se rapporte une photo de pièce. Et cette technologie de deep learning permet tout simplement d’accélérer le processus de saisie d’infos pour un hôte en lui épargnant le temps perdu à le faire lui même à la main (et souvent, en ne le faisant pas).
Conclusion
En fait, il y a réellement beaucoup de nouveautés dans la nouvelle app d’AirBNB et le plus intéressant dans ces innovations, c’est qu’elles ne se voient pas. C’est à dire que les utilisateurs finaux ne vont sans doute même pas s’en apercevoir, mais simplement les utiliser en ayant une impression renforcée de facilité de service.
Une bonne UX, c’est quelque chose qui ne se voit pas. C’est quelque chose que les utilisateurs ressentent sans savoir pourquoi ils le ressentent.
Des petits labels qualité pour pallier la mauvaise qualité des photos
Une présentation des avis clients plus fine et plus centrée utilisateur
L’utilisation de l’IA pour supprimer des interactions compliquées pour les hôtes
C’est aussi et surtout un long travail de recherche dont le résultat d’un point de vue UI n’est que la pointe visible… un tout petit bout d’un long aboutissement, dont les simples différences amélioreront la qualité de service pour des millions de personnes.
En résumé : posez-vous les bonnes questions et le reste viendra. N’essayez pas d’améliorer votre interface par de coups, des astuces, des imitations, des copies ou des trucs. Faites un véritable travail de recherche. L’UX, c’est ça. Pas du remplissage d’interface avec des boutons.
Relume est une application de design utilisant l’IA. Son processus d’onboarding est particulièrement efficace. Analyse pour vous ici par l’équipe de Wexperience.
Le processus complet d’essai de Relume sans inscription
Puisqu’on vous a parlé de Relume dans un autre article, il y a encore quelque chose d’autre à en dire et c’est au sujet de son processus d’onboarding. Et c’est notre rôle de dire tout la vérité sur ce que l’on voit quand le voit 😉
Outre le fait que le Relume s’avère un outil prometteur pour la conception de sites, on a aussi remarqué que Relume avait mis en oeuvre un technique d’onboarding vraiment maline pour pousser ses visiteurs à s’inscrire puis à se transformer en abonné.
On sait à quel point, c’est difficile d’onboarder (on en avait déjà parlé ici), et ça vaut le coup d’examiner en détail quand d’autres le société le font bien.
Alors Relume, champion de l’IA, mais aussi champion de l’onboarding ?
D’abord, première chose, premier principe : vous êtes les dealers, qu’est-ce que vous faites de mieux pour convaincre vos clients pour revenir ?
Point fort : laissez vos utilisateurs utiliser votre service sans inscription
Le mieux pour convaincre un utilisateur d’essayer votre service est, justement de le laisser essayer. Et c’est justement ce que fait Relume.
Dès la page d’accueil (la landing page), vous pouvez commencer à l’utiliser SANS passer par un processus d’inscription.
Autrement dit, à ce stade, on ne vous vend ni promesse, ni tarif, on vous demande juste d’essayer.
Et, l’effet est magique.
En quelques mots, entrez une description de votre société ou de votre site et l’IA generative de Relume se charge asap de générer une arborescence de site avec des titres et des contenus pour pour chaque page.
Notez bien l’effet magique : la génération se fait en temps réel, mais prend un peu de temps, comme dans chatGPT, ce qui renforce encore un peu plus cette notion de magique… et donne de la valeur au travail accompli par l’IA pour générer les contenus.
Montrer ce travail, c’est comme de vous laisser entrer dans une boutique Au Merveilleux de Fred où pouvez voir se réaliser devant vous les gâteaux que vous aller déguster.
L’expérience est très différente de ce qu’elle aurait été si on avait laissé apparaitre les résultats immédiatement.
Ce qui a apparait alors est une arborescence très clairement affichée et très simple à comprendre dans laquelle vous pouvez encore une fois agir immédiatement. La démo vous laisse beaucoup de latitudes pour essayer le produit, et, Ô astuce suprême, le design de l’interface a été suffisamment simplifié pour que tout cela se fasse naturellement, sans courbe d’apprentissage.
Cela encourage à continuer de l’utiliser et permet également de vendre l’argument « simplicité »/ »puissance » de l’outil simplement en l’utilisant.
L’application vous donne clairement l’impression que vous êtes en contrôle de quelque chose de puissant et fait monter votre satisfaction au top !
Après l’arborescence générée, au tour des wireframes
La génération de template « live » fait sans aucun doute partie du processus d’onboarding de Relume. En rendant « vivant » le cœur du moteur de génération de template, Relume crée l’émotion nécessaire pour embarquer l’utilisateur.
Et là, c’est encore plus magique. Un simple clic sur un bouton d’IA voit se transformer chaque nœud de l’arborescence en véritable page, dont la structure et l’apparence correspondent exactement aux contenus que vous avez défini.
Là encore, l’expérience a été bien travaillée puisque l’utilisateur peut voir en temps réel ce qui se passe « dans la machine »… il la voit littéralement travailler et afficher au fur et à mesure le morceaux de page qui s’assemblent. Cette façon de faire en ajoue au côté « magique » du produit.
A ce stade, vous devriez être séduit et avoir envie de profiter du fruit du travail de l’IA.
Car, rapellons-le, le but de Relume, c’est de générer des maquettes exportables directement dans Figma ou dans Webflow.
Et c’est là que s’accentue la pression pour vous faire ouvrir un compte.
Une fois que vous avez utilisé la fonctionnalité de Relume, vous allez vous heurter rapidement à de nombreux blocage dans l’utilisation de l’application. Et chaque fois un petit message viendra vous rappeler subtilement qu’il faut passer à la version supérieur.
Créer de la frustration pour déclencher l’inscription
Au fond, le processus d’onboarding de Relume est simple :
Faire utiliser le service au maximum jusqu’à la phase de finalisation que l’on prive d’accès tant que l’inscription n’est pas réalisée
Faire vivre une expérience émotionnelle grâce aux animations
Ne pas demander d’inscription pour essayer la version gratuite
Avoir une ergonomie extrêmement simple et permette une prise en main qui laisse entrevoir rapidement les capacités et possibilités de l’outil
En gros, faire monter l’excitation au maximum, mais bloquer l’utilisateur au moment où celui-ci sera en « transe » par rapport au produit.
Comment cela se fait ?
Bloquer l’accès à des fonctionnalités par un message lui proposant de passer son compte gratuit en compte payant.
Les message d’incitation à passer au plan supérieur ne sont pas intrusifs, ni voyants. Le prix n’est pas affiché. En revanche, ils apparaissent toujours suite à une action de l’utilisateur et le bloque de manière à lui montrer les limites de la version d’essai.
Dans la version gratuite, on ne peut pas générer tous les wireframe. Cliquez sur un wireframe essayer de le générer et le message d’incitation à payer à un compte pro apparaît.
Dans la version gratuite, toutes les fonctionnalités de l’applicatif sont visibles et cliquables. L’utilisateur ne peut pas savoir quand elle sera payante. Il doit « apprendre » au fur et à mesure à découvrir ce qui est payant où ne l’est pas.
La conversion se fait à ce stade. On retrouve une offre à trois niveau avec la mise en majeur de l’offre du milieu qui va sans doute constituer la majorité des enregistrement, car elle donne immédiatement l’accès à l’ensemble des fonctionnalités de l’app.
Comme on l’a dit, Relume s’adresse sans doute aux petites agences qui veulent produire rapidement des sites personnalisés, mais en réduisant les coûts de production. Le public cible d’utilisateurs est donc composé de designers et d’indépendants qui recherchent des solutions rapide à mettre en œuvre et facile d’apprentissage.
Conclusion : un produit pensé pour l’onboarding
A l’heure où des milliers de solutions tentent de vous soutirer des sous de votre porte-monnaie, il devient extrêmement difficile de convaincre son public, mais Relume s’en sort bien.
Les points forts à noter sont :
Une utilisation intelligente des animations pour créer de l’émotion
Un design très sobre et pas du tout racoleur. C’est le produit qui racole par ses fonctionnalités et sa puissance, pas l’esthétique
Suffisamment de marge de manœuvre laissé à l’utilisateur pour qu’il puisse vraiment tester l’application sans s’inscrire
Possibilité d’utiliser l’app sans s’inscrire
Ce qui est intéressant par dessus tout, c’est de voir à quel point l’expérience du produit a été pensé autant pour son usage que pour sa présentation commerciale. C’est une chose que peu de startup font.
On a été assez époustouflé par la promesse de Relume.io, un service en Saas qui promet (presque) de révolutionner le design et la conception de site.
Relume, c’est quoi ?
Relume.io est un service en Saas qui promet de changer la manière de travailler des designers d’interfaces web. Mais l’argument principal de Relume est, vous l’avez deviné, l’IA. Encore et toujours ! Décidément, on n’en sort pas.
En gros, pour simplifier, ce que promet Relume, c’est de demander à l’IA de créer entièrement l’architecture d’information d’un site, de l’arborescence jusqu’à la génération des pages soit sous Figma, soit directement dans Webflow, l’outil de génération de sites. Et c’est plutôt efficace ! D’après ce qu’on a pu en voir lors de nos premiers essai.
Dashboard projet de Relume avec une arborescence complète de site, généré par l’IA
Comment ça marche ?
L’onboarding de Relume permet de vous embarquer directement dans l’utilisation de l’outil, comme c’est désormais souvent le cas dans les outils en Saas.
Vous entrez le nom de votre site, décrivez en deux ou trois phrases ce qu’il propose, et c’est parti ! Il ne vous reste plus qu’à appuyer sur le bouton magique de l’IA et l’aborescence du site se génère automatiquement sous vos yeux (on ne va pas se mentir, l’UX a été très très soignée et vous embarque facilement).
Ensuite, vous pouvez commencer à travailler.
Soit, vous laissez faire l’IA qui va continuer à générer de nouvelles pages pour vous. Et de nouveaux contenus !
Car, oui, ça on ne vous l’avait pas dit. Relume génère aussi tous les textes pour vous, y compris, bien sûr, les libellés de boutons. Ce qui peut vous faire gagner beaucoup de temps, mais… on y reviendra.
Soit, vous vous occupez plus ou moins de configurer vous même l’aborescence et d’y injecter vos propres textes. Nulle doute que c’est cette façon là de travailler qui va être privilégiée, car, soyons honnêtes, les textes générés par l’IA sont extrêmement généralistes et pas très personnalisés.
Export du sitemap dans Figma. La structure est propre et facile à lire
Disons que pour quelqu’un qui n’aime pas écrire, ça va faire gagner beaucoup de temps. Mais si vous disposez d’un UX ou d’un copy writer, mieux vaut lui laisser la main (sinon, ça servirait à quoi de le payer ?).
Bref, l’intérêt de tout ça est de pouvoir travailler en vue d’oiseau sur votre site (en en ayant une vue globale). Et, grâce à une interface originale et très intuitive, de pouvoir facilement concevoir l’intégralité de votre site rapidement. C’est déjà un point fort… et il n’y aurait pas eu l’IA que ça aurait déjà été un point fort quand même.
Mais, bien sûr, c’est ce qui vient après qui est bluffant, et même, on oserait dire, satisfaisant.
Une fois que votre aborescence est prête, il n’y a plus qu’à la « mettre au four »… à la faire gonfler 🙂
Génération automatique de pages et illusion de l’effort
Appuyez à nouveau sur un bouton magique, et là, Ô miracle, ce sont les wireframes de toutes vos pages qui sont générées en quelques instants après.
Ce qui est amusant, c’est de voir se réaliser le processus en temps réel, page après page, comme si un super-artisan était en train de fabriquer les pages devant vous. Si vous ne le saviez pas, c’est une très bonne utilisation de l’illusion d’effort. Si les pages étaient générées instantanément, cela donnerait l’impression que la génération est trop facile et n’a pas de valeur. Voir l’IA « travailler » devant donne l’illusion de l’effort et donne de la valeur au résultat.
Une fois que c’est fait, ensuite, là encore vous pouvez intervenir pour modifier les contenus dans les grandes masses, mais pas en entrant dans les détails. Les détails, c’est dans Figma que ça se passe.
Wireframes générés automatiquement dans Relume. Il ne reste plus qu’à exporter dans Figma.
En résumé, cette première partie est une sorte d’outil de conception de sites qui accélère toute la conception de l’architecture d’information. L’IA est là pour remplir les cases en écrivant l’ensemble des contenus à votre place… mais, comme on l’a déjà dit… même si ça fait gagner du temps, les textes demanderont forcément de la relecture et des correctifs… mais ça, c’est comme avec chatGPT. Il ne faut pas espérer que l’IA vous sorte un texte parfait.
Mais ça n’est pas fini. Attendez ! Relume peut faire beaucoup mieux que ça. Et, en effet, la promesse de Relume, ça n’est pas que d’accélérer la phase de conception, mais aussi la phase de production.
Exportation sous Figma et Webflow
C’est là qu’entre en jeu le module d’exportation.
Là, vous avez deux choix :
Soit exporter votre site sous Figma
Soit directement dans Webflow
C’est assez simple.
Lorsque vous cliquez sur le bouton exporter dans Figma, Relume vous demande d’installer un plugin… Et hop, en deux clics, c’est fait ! Et ensuite, il ne vous reste plus qu’à récupérer les templates de votre projet dans Figma. Vraiment très facile !
Vue du plugin Relume dans Figma
La structure et la hiérarchie des templates est très propre (à première vue) et ensuite, il ne vous reste plus qu’à travailler le style de vos pages avant de pouvoir à nouveau les exporter directement dans Webflow.
L’autre choix consiste à exporter directement votre site dans Webflow… ce qui, là aussi, vous fera gagner énormément de temps ! Puisque vous aurez presque instantanément un site prêt à l’emploi. (qu’il faudra quand même retravailler graphiquement). Et là, c’est encore plus simple, puisque l’exportation se fait par simple copier-coller de Relume vers Webflow
Avantages
On ne pourrait voir que des avantages à Relume.
L’intérêt est sans doute qu’il permet à quelqu’un assez peu expérimenté dans le design et la programmation de créer rapidement un site qu’il pourra ensuite personnaliser comme il le voudra.
L’interface est très intuitive. Très agréable. Et les petits boutons d’IA donne vraiment l’impression que c’est la machine qui fait tout.
On peut imaginer que pour des entreprises sans ressources internes dans le numérique, Relume fera très bien l’affaire. Après, il suffit d’un minimum de formation dans Figma ou dans Webflow pour s’en sortir et mettre son site en production.
Avantage non négligeable, Relume permet aussi de générer du texte en français.
L’exportation dans Webflow se fait par simple copier-coller
Inconvénients
On en voit principalement trois.
Même si Relume fait gagner du temps… on peut se demander si c’est vraiment un avantage pour les projets un peu plus compliqué que des simples sites vitrines. Tout ce qui est généré, ce sont des pages statiques… ça ne permet donc pas d’aller très très loin, pour l’instant, en tout cas
Les textes générés par IA, c’est sympa, mais comme très souvent, ce sont des textes très banals, très plats, sans vraiment de détail spécifique dans l’information. Et il faut forcément repasser derrière, si on veut quelque chose de vraiment pro.
Les maquettes générées sont très génériques et pas franchement originales. Ça peut convenir pour traiter des cas très courants, mais pas du spécifique. Auquel cas, il faudra revenir à Figma pour travailler les templates.
Conclusion : un outil puissant, mais pas pour tous les besoins
L’IA, dans Relume, nous semble plus un argument marketing qu’une vraie utilité. Car, hormis la génération de texte (et encore, c’est juste du GPT4), son apport n’est vraiment pas évident. N’importe quel algorithme ferait aussi bien l’affaire. Et pas besoin de sortir l’artillerie lourde pour sortir des architectures d’information somme toute très banales.
Non, l’intérêt de Relume réside plutôt dans le gain en productivité qu’il génère pour des projets webs assez simple. Son UX est très soignée et permet rapidement de générer quelques pages pour un site que, dans tous les cas, il faudra retravailler derrière.
C’est donc plutôt un outil qui s’adresse aux agences qui veulent gagner en productivité pour des projets de sites vitrine ou d’information. Pour des projets plus complexe, il n’est pas sûr que l’apport de Relume soit vraiment intéressant.
Cet article vous explique ce qu’est le modèle HEART et comment il peut vous apporter santé, bonheur et prosperité quand vous êtes en charge du développement d’un produit digital.
Lorsqu’on se lance dans le projet de réussir un service en Saas, l’une des plus grandes difficulté est d’arriver à mesurer les bons paramètres, les bons indicateurs, ceux qui vont vraiment vous guider vers la voie du succès. Or, ces bons paramètres ne sont pas si facile à définir et beaucoup d’équipes digitales s’y sont cassés les dents.
C’est en constatant le même problème au sein de Google, que les chercheurs Kerry Rodden, Hilary Hutchinson et Xin Fu ont mis au point la méthode HEART. Une méthode qui va vous faire aimer le product design.
Qu’est-ce que le modèle HEART ?
HEART est l’acronyme pour :
H : Hapiness
E : engagement
A : Adoption
R : Retention
T : Task
C’est un modèle très simple et très facile à communiquer qui permet de mesurer les paramètres de succès d’une application ou d’un site web.
Il est particulièrement indiqué pour les services en Saas, mais peut-être adapté pour des logiciels professionnels ou des sites webs du secteur public. Bref, avec un peu d’astuce, on peut s’en servir dans de nombreuses situations.
Comment marche le modèle HEART ?
L’avantage du modèle HEART est qu’il est simple à comprendre et à mettre en œuvre.
Pour chaque lettre de l’acronyme, il suffit de mettre en face trois critères :
Les objectifs
Les signaux
Les mesures
Pour chaque dimension du modèle, vous allez donc devoir déterminer quels sont ces critères. Et c’est l’atteinte des objectifs dans chaque dimension qui vous permettra de mesurer le succès de votre produit/app/site web/logiciel.
Les objectifs dans le modèle HEART
Si l’on prend la dimension « Happiness » que l’on peut traduire par satisfaction, les objectifs à mesurer seront justement cette satisfaction. Mesurer cela, c’est poser la question à vos utilisateurs de savoir s’ils sont contents ou pas d’utiliser votre produit (J’utiliserai le terme produit désormais pour signifier site web, service, app, logiciel, etc).
C’est la dimension dont l’objectif est le plus simple à mesurer… c’est aussi celui qui est la résultante des autres objectifs… Évidemment, il devrait être à la fin de notre liste… mais, dans ce cas, l’acronyme ne ferait plus HEART… et ça serait moins joli.
Pour rappel, la satisfaction, c’est aussi le dernier critère des critères UX de Bastien & Scapin ou d’Amélie Boucher.
Si votre produit est un service de vente de billet de train en ligne, votre objectif sera tout simplement de faire que les gens soient content de commander un billet, que cela se fasse simplement, sans accroc. Ce qui nous amène au signaux.
Les signaux dans le modèle HEART
Les signaux sont les faits concrets que l’on va observer pour déterminer si les objectifs sont plus ou moins atteints.
Dans le cas de notre application de vente de billets de train, les signaux à observer peuvent être :
un bon feedback des utilisateurs
un bon niveau de recommandation
le plaisir perçu d’utilisation
3 indicateurs suffisent, mais vous pouvez essayer d’en utiliser plus. Tout dépend de votre produit.
Les mesures dans le modèle HEART
C’est grâce à la mesure que vous allez pouvoir déterminer si vous atteignez vos objectifs. Les mesures sont des quantités observables sur une durée plus ou moins longue. Dans le cas de Happiness, vous avez d’ailleurs intérêt à la mesurer dans le long terme, car elle est très sensible au changement et l’observer sur du court terme peut être trompeur.
Le feedback des utilisateurs peut-être mesuré par les notes de satisfaction d’une app
Le niveau de recommandation peut-être mesuré par le Net Promoter Score
Le plaisir perçu peut-être mesuré par un sondage en ligne
Comme vous le voyez, l’avantage d’un tel modèle, c’est de rendre simple la mesure du succès d’un produit en le décomposant en plusieurs dimensions.
Détail des dimensions du modèle Heart
Hapiness
Regarde le niveau de satisfaction des utilisateurs
Engagement
Se préoccupe de l’intensité avec laquelle les utilisateurs utilisent le produit. Combien de fois par jour, par semaine y reviennent-ils. L’utilisent-ils pendant une heure, cinq minutes ? Combien d’actions accomplissent-ils ? Etc.
Adoption
Se préoccupe du taux d’adoption du produit. Combien de personnes sur une période donnée adoptent le produit. En général, cet indicateur se mesure par le nombre de nouveaux comptes ouverts sur une app ou sur le nombre de nouveaux utilisateurs au sein d’une entreprise. Plusieurs moyens existent de mesurer l’adoption. Pris seul, cet indicateur est souvent trompeur et induit en erreur sur le succès d’utilisation d’un produit.
Retention
La rétention mesure la capacité de votre produit à garder ses utilisateurs. Combien de fois sur une période donnée reviennent-ils sur le produit ? A quel moment l’abandonnent-t-ils ? Ne l’utilisent-ils plus ? La rétention est le complètement indispensable à l’adoption. A deux, ces indicateurs sont un bon moyen de savoir si vous avancez dans la bonne voie.
Tasks
Ici, il s’agit de mesurer et d’évaluer si vos utilisateurs arrivent bien à faire ce qu’ils ont à faire. Tasks mesure la qualité de réussite des tâches principales de votre produit. Meilleur sera ce niveau, meilleur seront le taux de rétention, d’engagement et de bonheur.
Le modèle HEART : 1 exemple pour une app
Objectifs
Signaux
Mesure
H
Les utilisateurs trouvent l’app fun, facile à utiliser et utile.
– Les utilisateurs répondent aux questionnaires en ligne. – Ils notent l’application – Ils laissent des commentaires
– Bon NPS – Note de l’app supérieure à 4,5 – Commentaires sont en majorité favorables
E
Les utilisateurs sont satisfaits par les contenus et continuent à utiliser l’app
– Les utilisateurs passent du temps sur l’app
– Temps moyen de session -Fréquence moyenne de session – Nombre de micro-conversions réussies
A
Les utilisateurs perçoivent de la valeur dans le produit et l’utilise
– Téléchargements, installations de l’app – Inscription – Utilisation d’une nouvelle fonctionnalité
– Taux de téléchargement – Taux d’inscription – Taux d’utilisation de la fonctionnalité
R
Les utilisateurs continuent à effectuer une ou plusieurs actions clés sur l’app et reviennent régulièrement l’utiliser
– Les utilisateurs reviennent sur l’app – Ils se réinscrivent – Ils gardent leur abonnement
– Taux de churn – Taux de réinscription
T
Les utilisateurs parviennent rapidement et facilement à effectuer les actions clés de l’application
– Observation de la facilité à trouver des contenus – Complétion des tâches faciles
– Nb de clics pour accéder à un contenu – Vitesse d’accomplissement – Nombre d’erreurs par tâche
Quelques techniques pour améliorer vos indicateurs
Gamification pour améliorer la rétention
Un des moyens d’augmenter la rétention est d’encourager les utilisateurs à revenir et à utiliser vos services. Voici un exemple de la manière dont Google s’y prend pour attirer les développeurs sur sa plateforme de développement.
Au chargement de la page, et avant l’inscription au service, Google apprend au futur utilisateur qu’il pourra « gagner des badges » et « Personnaliser son expérience »
Mesurer la satisfaction
Les moyens de mesurer la satisfaction d’une app (Happiness) sont nombreux et assez directs.
On peut la recueillir à tout moment en plaçant sur le parcours utilisateurs des feedbacks comme des applaudissements, des pouces levés, des étoiles, etc.
Ainsi, sur Medium, la plateforme de blogging, l’utilisateur peut applaudir le contenu d’un article. Cela donne une note de satisfaction non seulement à l’auteur, mais aussi à la plateforme qui peut évaluer la qualité des contenus publiés.
Faites essayez le produit sans obliger l’utilisateur à s’inscrire
Un des moyens pour augmenter l’adoption est non seulement de faciliter l’inscription, mais surtout de donner envie d’utiliser le produit. Pour cela, rien de tel qu’une petite démonstration gratuite qui laisse une bonne impression et donne envie de continuer. C’est ce que fait très bien l’application d’apprentissage de langue Duo Lingo. Elle permet de l’utiliser une première fois sans avoir à s’inscrire.
Plutôt que de faire des promesses, Duo Lingo vous propose de l’essayer en faisant un premier exercice d’apprentissage. Cela est plutôt malin. Faire « goûter le produit » avant de le vendre.
C’est une offre que souvent personne ne refuse. Et si elle se passe bien, elle augmentera le nombre de chances qu’un utilisateur s’inscrive à la plateforme.
Exercice dans inscription sur Duo Lingo
Augmenter l’engagement avec l’UX writing
On néglige souvent le fameux « tone of voice » des sites ou des apps. Mailchimp, la solution d’email marketing, fut le service le plus connu à travailler en profondeur un ton de voix capable d’améliorer l’expérience utilisateur et d’améliorer l’engagement. En France, la figure la plus connue du « tone of voice » est backmarket, dont le ton légèrement humoristique rend également l’expérience différente et crée une relation avec l’utilisateur plus personnelle.
Les tests utilisateurs pour vérifier et améliorer vos tâches
Pour vérifier et valider la qualité de l’UX sur des tâches spécifiques, il faut se servir des metrics des web analytics. Mais le meilleur moyen de s’assurer que l’on arrive concrètement à rendre facile d’utilisation des tâches particulières reste de les examiner à la loupe des tests utilisateurs.
Un bon produit, un site ou une app, de toutes les manières doit passer régulièrement sous les fourches caudines des tests utilisateurs. Même une équipe restreinte, sans UX researcher, peut s’y consacrer. Nous y avons consacré un livre blanc que vous pouvez télécharger sur notre site.
Conclusion
Ce qu’il faut retenir de cet article.
Le modèle HEART est un modèle particulièrement adapté pour les solutions en Saas qui nécessitent un effort particulier sur l’UX.
Il permet de décrire le comportement utilisateur sous plusieurs angles et donne une vision exhaustive de ce comportement.
Il empêche de se concentrer sur un indicateur unique et permet d’éviter des erreurs que beaucoup de startups commettent par une vision trop restrictive de l’UX
Il est simple à déterminer et à mettre en œuvre.
Il peut être appliqué sur un produit en entier ou bien une simple fonctionnalité
Beaucoup de services échouent à fidéliser leurs utilisateurs. Une des meilleures méthodes pour y parvenir est le streak… une manière de gamifier un produit ou un service en rendant vos utilisateurs accrocs. On vous dit tout, dans cet article !
(cet article a d’abord eté publié dans notre newsletter, abonnez-vous !)
Comment rétribuer et fidéliser ses utilisateurs ?
Un intéressant article de Nir Eyal, l’auteur du fameux Hooked, nous rappelle à quel point de nombreux programme de fidélités et surtout de nombreuses apps utilisent mal les système de fidélisation à travers des programmes de point. On pourrait être étonné que tant de monde fasse l’erreur, mais c’est sans doute parce que beaucoup d’entre nous se contentent de reproduire ces programmes sans réellement se poser la question de leur mécanique psychologique.
Ce que dit Nir Eyal, c’est qu’un programme de rétribution et de fidélisation fonctionne non pas tant par la valeur de ce qui est donné, mais comment elle est donné. Et l’important, c’est de donner à vos utilisateurs une notion de progression.
Donner une notion de progression
Non seulement, il est important de les récompenser, mais en plus de cela, il faut leur donner la notion de progression. C’est à dire que vos utilisateurs ne veulent pas seulement avoir des points, ou des remises, il veulent avoir la sensation qu’ils « bâtissent un capital ».
Nir Eyal nous donne l’exemple d’une station de lavage qui avait expérimenté deux modes de rétribution afin de comparer leur impact.
Dans le premier système qu’elle avait inventée, station de lavage offrait un lavage gratuit au bout du huitième lavage.
Dans son second système, la station proposait d’obtenir un lavage gratuit tous les 10 lavages, mais en plus, d’obtenir 2 crédits gratuits.
Quel fut le système le plus fidélisateur selon vous ?
En terme d’offre, les deux systèmes sont parfaitement équivalents, mais une majorité de clients préféra le deuxième système. Pour quelle raison ? A cause de l’effet de dotation. Le fait de permettre aux gens de sentir une progression.
Comme beaucoup de services en ligne le font, ce système est bien plus engageant, car non seulement il donne l’impression de capitaliser sur quelque chose, de thésauriser sur quelque chose de gratuit, mais, en plus, il a l’avantage de solliciter un autre biais cognitif: l’aversion à la perte.
Streaks, une app qui utilise le Streak pour vous encourager à prendre de bonnes habitudes
Jouer sur l’aversion à la perte et l’effet de dotation
Exemple donné par Paypal, celui-de Paypal qui, une fois votre inscription terminée, vous montre que vous êtes à 80% d’avoir complété votre profil.
Ce seul indicateur, savamment affiché, permet d’augmenter le taux de complétion du profil, et nombreux sont les utilisateurs qui ajoutent spontanément leur numéro de téléphone.
Autre exemple donné par Nir Eyal, et que nous connaissons tous, celui de LinkedIn qui permet également de visualiser la taux de complétion de son profil, mais qui utilise, en plus, d’autres ressorts pour nous faire donner des informations, enrichir la plateforme et surtout pour nous faire passer au niveau Premium (payant).
Subtilement, Linked nous fait voir l’avantage d’avoir un profil bien rempli : « 6 visiteurs ont visité votre profil la semaine dernière »… mais, mais, mais.. en indiquant juste en dessous :
que c’est moins 11% par rapport à la semaine précédente
que ça ne vous arriverait pas si vous aviez accès à l’offre Premium, ou en tout cas, que d’avoir un profil plus complet vous vaudrait plus de visites
Ces mécanismes peuvent être déclinés de différentes manières et permettent de fidéliser les utilisateurs qui est un des buts largement avoués, disons-le bien, du succès d’une entreprise ou d’un produit.
Créer des habitudes est difficile
Créer des habitudes est difficile, Nir Eyal a écrit tout un livre dessus, et garder un utilisateur, lui faire utiliser une plateforme/un produit et même une app est un challenge.
Evidemment, ici, nous parlons d’habitude pour créer des produits « marketing », mais créer des habitudes peut tout autant avoir de valeur pour des outils professionnels de productivité.
Dans les mécanismes pour créer des habitudes se trouvent le mécanisme de récompenses variables qui est indispensable, mais ainsi que le dit Nir Eyal ce qu’il apelle le « Framing », c’est à dire offrir un cadre où l’utilisateur peut s’investir et capitaliser quelque chose vient encore renforcer ce mécanisme. Et il est très puissant.
Qu’est-ce que le Streak ?
Coïncidence ou pas, un autre article traitait du même sujet cette semaine.
Le Streak (que Nir Eyal nomme le framing) est une technique qui permet, justement, d’encourager le framing.
Et elle est encore plus subtile et puissante.
Le Streak qu’on peut traduire par traînée, en français… ce qui n’est pas bien joli, est un moyen de pousser les utilisateurs à utiliser le plus régulièrement votre plateforme par des séries continues d’accomplissement.
Qu’est-ce que cela veut dire ?
Dans une plateforme d’apprentissage comme Duo Lingo, qui est passée maître en la matière, c’est tout simplement d’encourager vos utilisateurs à s’exercer tous les jours en leur permettant d’accumuler des points jour après jour, mais en leur faisant miroiter le risque de perdre ses bénéfices entièrement dès que le Streak est cassé… c’est à dire dès que la personne oublie de s’entraîner plus d’un certain nombre de jours.
Apple Fitness encourage la prise de bonnes habitudes en tentant de nous faire atteindre quotidiennement un score
Un jeu de quitte ou double
C’est un peu quitte ou double.
Ce mécanisme très puissant est très bien expliqué dans l’article How to design an effective streak with behavioural science.
Plusieurs apps ou site l’utilisent avec beaucoup de succès.
Le principe des streaks est de faire prendre et d’encourager les habitudes. Et c’est un très bon moyen lorsque vous souhaitez introduire une nouvelle feature dans votre produit.
L’avantage du streak est de créer progressivement un engagement dont l’utilisateur peut devenir fier. En stockant des points dans son profil, en l’enrichissant jour après jour… non seulement vous lui faites ressentir sa progression, mais lui donnez aussi une source de fierté en lui permettant de comparer sa progression à sa communauté.
Visualisation ludique d’un parcours de progression sur Duolingo
Le streak joue aussi sur le Endowment effect, le biais de dotation, qui fait que l’on valorise plus ce qui nous appartient que ce qui appartient à d’autres (vous aimez plus vos enfants que ceux des autres, non ?).
En permettant à vos utilisateurs de se créer ce fameux capital, vous leur donnez l’impression qu’ils possèdent quelque chose qu’ils sont moins enclins à perdre. Perdre son streak est, de ce point de vue, terrifiant pour l’utilisateur, et est donc bien un moteur pour qu’il continue d’utiliser votre app. Je vous passe le fait de la moralité de cette façon de faire, mais ça, c’est à vous de voir avec votre conscience 😉
Toutefois, si on prend le bénéfice qu’un utilisateur à utiliser une app comme Duo Lingo ou Apple Fitness, on ne saura leur reprocher de nous encourager par certains moyens à nous améliorer (apprendre une langue ou prendre soin de soi).
Dans Apple Fitness, les petits cercles colorés nous aident visuellement à atteindre nos objectfs… sans nous mettre la pression 🙂
Un autre exemple intéressant que nous donne l’article est Streakapp qui est une app qui est réellement dédiée qu’à cela : créer des Streaks pour toute sorte d’activité. Amusant, non ?
Vous voulez arrêter de fumer ? De boire ? Vous voulez marcher plus ? Etc ? Vous configurez Strakapp pour cela et vous voilà en route pour changer vos habitudes… sachant que Streak utilise le même principe de rétribution/rémunération pour vous encourager à changer.
Et l’UX dans tout ça ?
Il est primordial, évidemment. Pas de bon streak, pas d’engagement si l’information n’est pas clairement affichée et si l’expérience est mal pensée.
Duo Lingo utilise, par exemple, énormément d’animations et d’effets visuels pour créer une expérience fun et dynamique. C’est une véritable source d’inspiration.
La politique RSE des entreprises est une attente grandissante des consommateurs, mais celle-ci n’est pas toujours bien mise en valeur.
Avoir une politique RSE, c’est bien.
Le faire savoir, c’est mieux.
Et bien le faire savoir, c’est encore mieux !
L’année dernière, on a testé plus de 30 sites et sur la plupart, la politique RSE était mal affichée, mal présentée. Dans cet article, nous allons voir comment bien présenter sa politique RSE.
Les erreurs que nous avons le plus fréquemment rencontrées
Chaque années, nous conduisons plusieurs dizaines de tests utilisateurs UX sur les sites de nos clients. Bien que nous n’analysions pas expressément l’affichage de leur politique RSE, il se dégage pourtant souvent les mêmes défauts, spontanément remontés par nos testeurs.
Erreur #1 : La politique RSE est cachée.
La politique RSE ne doit pas être cachée ni montrée trop ostentoirrement. Mais un des défauts que nous avons rencontrés est qu’elle est souvent mise en bas de page. Cela la rend presque invisible. Même si les utilisateurs peuvent penser à aller la chercher là, il semble tout de même important de la placer plus haut dans la page, voire ne pas hésiter à la mettre dans le menu principal, car c’est une information qui a tendance à être de plus en plus recherchée et qui va influencer positivement votre visiteur vis à vis de votre société.
Sur le site de Promod, la politique RSE est affichée directement dans le menu principal de navigation. Très visibles dans la version desktop, il faut cependant ouvrir le menu, dans la version mobile, pour la voir. Elle y occupe une place importante.
Erreur #2 : Les termes utilisées sont trop marketés
Comme pour tout en UX, mieux vaut éviter les termes marketés, que ce soit pour le nom de votre politique RSE ou même par l’emploi de termes explicatifs dont la signification risque de ne pas apparaître clairement.
Deux conseils :
-> Ne donnez pas à votre politique RSE un nom « marketing »… pour faire chic ou stylé 🙂 Mieux vaut employer un terme que tout le monde reconnait et comprend que d’essayer d’être à la mode. Cela réduira, en outre, le risque d’être soupçonné de greenwashing.
-> N’inventez pas non plus de « faux label »… un de nos clients avait cru bon d’inventer un terme synonyme de RSE que les utilisateurs auraient pu assimiler à un label officiel… or, ça n’était pas le cas. Et ce choix a été assez mal interprété par les utilisateurs du site qui y voyaient une tentative de tromperie.
Erreur #3 : Le site n’explique pas assez ce qu’est la RSE
Si le terme RSE se rapporte pour vous à des choses claires et précises, n’imaginez pas que ça soit la même chose pour vos clients. Le terme RSE lui même n’est pas forcément connu ou reconnu.
Faites preuve de pédagogie : n’hésitez pas à consacrer une page ou plusieurs pour expliquer ce que concrètement votre politique RSE signifie.
Prenez vraiment du recul et mettez-vous vraiment à la place de vos clients pour produire des contenus qui vont répondre à leurs interrogations.
Et si, dans certains domaines (habillement, par exemple), il est facile de s’imaginer ce que peut être une politique RSE, dans d’autres, ça peut être moins évident. Un de nos clients dans l’assurance expliquait en long et en large sa politique RSE, mais ces explications étaient assimilées à du greenwashing car les visiteurs du site n’imaginaient pas bien le lien entre assurance et RSE.
Dans les pages produits, de nombreuses explications sont données en toute transparence. Les produits RSE sont clairement identifiés par la marque Promod for Good
Erreur #4 : Les indications visuelles de la RSE ne sont pas assez explicites
Il existe pléthore de logos, de symboles, de labels à l’appui des politiques RSE, mais ceux-ci ne sont pas tous forcément lisibles pour vos clients.
Dans nos tests, souvent ces logos étaient mal compris ou mal placés.
Par exemple, dans les fiches produits, ils sont souvent noyés au milieu d’autres éléments d’information.
Ils se sont également pas reliés à des notices explicatives qui permettent de mieux les comprendre.
Pour que ceux-ci orientent vraiment vos utilisateurs, vous devez donc prendre soin :
De bien les isoler visuellement dans les fiches produits et de les positionner à un endroit où ils prennent sens par rapport à votre descriptif
De bien les expliciter avec un court texte les accompagnant, mais également un lien renvoyant vers une définition et des explications plus précises.
Tresecodesign affiche clairement sur chacune de ses fiches produit, à côté du prix, l’indice d’ecoimpact
52% des ecommerçants mettent la RSE en tête de leurs priorités d’investissement
D’après une récente étude de la FEVAD, c’est vraiment l’investissement prioritaire pour les grands ecommerçants. Or, si ces entreprises ont très bien compris la nécessité de se moderniser et d’être plus respectueuses de l’environnement, beaucoup, comme nous l’avons vu, tâtonnent dans leur manière de mettre en lumière cette politique RSE.
Alors que c’est une réelle demande sociétale, il est donc primordial de mettre en œuvre des bonnes pratiques pour que les clients et utilisateurs de ces sites soient clairement informés de cette politique.
Nous ne saurions que vous recommander de jauger votre démarche RSE en intégrant à vos études utilisateurs des questions afférentes à ce sujet.
Conclusion : faites la démarche RSE de votre démarche RSE
La meilleure des règles à adopter, c’est d’être soi même dans une démarche RSE pour afficher votre démarche RSE : transparence, honnêteté, clarté, écodesign seront vos maître mots dans la conception et le design de vos pages RSE.
Et si cela est vital pour vous, n’hésitez pas à faire une étude en ligne ou en présentiel auprès de vos clients et prospects afin de bien comprendre dans le détail comment vous pouvez encore mieux les guider et les renseigner dans leur désir d’améliorer le sort de notre société.
Walmart vient d’annoncer sur son blog la refonte de son application et de la homepage de son site.
Selon son directeur du ecommerce, Tom Ward, l’objectif était de la rendre plus engageante, mais aussi de coller plus aux habitudes des utilisateurs.
« Nous améliorons la façon dont nos clients peuvent explorer les allées sans fin de Walmart.com avec un nouveau look élégant et une expérience qui offre une façon plus attrayante de parcourir et de découvrir notre incroyable assortiment.
Qu’est-ce qui change ? En quoi est-ce mieux ?
Pour résumer, l’apparence de l’app et de la nouvelle HP tendent vers la simplification de l’apparence.
La nouvelle HP sur la version desktop semble plus esthétique, grâce au jeu de couleurs sur le fond des blocs
Moins de choses visibles à l’écran
C’est ce qui ressort en premier. On a moins d’informations à l’écran et l’apparence des contenus est plus homogène : moins de tailles de typo, moins de différents types de bloc. Des blocs plus grands et plus espacés donnent aussi l’impression d’une réduction d’information.
Une apparence plus esthétique
Conséquence de la simplification, la nouvelle interface est plus esthétique. Plus facile à appréhender du regard, elle nous parait plus belle.
Mais un deuxième facteur joue aussi, c’est l’utilisation d’harmonies colorées. Les différentes pages d’accueil ont toutes un ton uniforme dans différents camaïeux de couleurs. Ce choix réduit la charge cognitive de l’utilisateur pour parcourir l’écran et rend sa vie plus facile
Une incitation au scroll
Conséquence de la simplification : les contenus occupant plus de places, l’utilisateur est obligé de scroller plus. Mais cela n’est vraiment pas un problème aujourd’hui, le scroll vertical étant de plus en plus communément répandu, grâce aux réseaux sociaux. C’est une façon de se rapprocher de ses utilisateurs en collant plus à leurs pratiques et habitudes.
L’ancienne version de la HP sur desktop paraît bien archaïque d’un seul coup !
Qu’est-ce qu’on en retient ?
-> un petit changement plutôt qu’une refonte complète
Les grand sites comme Walmart ne font pas de refonte complète. Le risque de mécontentement est trop grand et trop difficile à gérer. Ici, la nouveauté est minime et le retour en arrière peut facilement être fait en cas de trop mauvaises réactions des clients.
-> un pas de plus vers la simplicité
La tendance n’est pas neuve, mais elle se confirme ici, avec la chasse à l’embonpoint, aux pages trop lourdes, trop surchargées auxquelles nous avait souvent habitués la grande distribution. C’est à comparer avec Auchan et Carrefour, qui ont au moins 3 ans de retard en la matière.
-> Un souci marqué pour l’esthétique
Oui, l’esthétique est un facteur d’utilisabilité. Et même s’il est difficile de « faire de l’art » avec un site de grande distribution, n’empêche que l’on peut arriver à autre chose que la reproduction d’un prospectus de promotions. En revanche, difficile de dire si cela est plus efficace, commercialement parlant.
Faut-il s’en inspirer ?
On a déjà parlé en long en large sur ce blog de savoir s’il faut ou pas copier les grandes marques –> voir l’article
En UX, il n’y a pas de recettes toute faite, hormis sur des best-practices mineurs. En général, offrir une interface conviviale, simple, esthétique, correspondant à sa marque et ses clients ne peut pas être simplement l’application d’une copie des meilleurs.
Il faut donc toujours avoir plusieurs préoccupations pour réussir :
👉 Savoir clairement définir les objectifs de chaque page et de chaque parcours sur son site : taux de rebond ? D’engagement ? Etc. ?
👉 Savoir transformer ces objectifs en indicateurs objectifs
👉 Creuser le détail des comportements utilisateurs avec des tests utilisateurs
👉 Designer/prototype, retester si l’enjeu est important
AB tester avant la mise en production, mais, mieux encore, proposer des interfaces personnalisées pour chaque cohorte de visiteurs.
Wexperience a déjà accompagné plus de 150 clients dans le domaine du ecommerce. Vous avez un projet d’optimisation de l’UX sur votre site ou app, prenons rendez-vous !
Spotify vient de faire une refonte majeure de son app (Spotify’s New Experience Inspires Deeper Discovery and Connection), et c’est très intéressant de voir comment le géant suédois de la musique a répondu à diverses problématiques pour créer encore plus d’engagement sur leur app :
Simplifier l’interface
Se mettre dans les habitudes des nouvelles générations
Augmenter la découvrabilité
Mieux mettre en connexion artistes et fans
Donner plus de possibilités d’expression aux créateurs
Qu’est-ce qui a changé ?
Principalement la manière de naviguer entre les différents contenus (musique, podcasts, livres audio).
Désormais, on a affaire à une interface à la Tiktok (ainsi que beaucoup d’autres l’ont déjà fait) pour s’adapter aux habitudes d’une part grandissante des utilisateurs.
Au lieu d’avoir des listes de contenus, ce sont désormais des extraits de quelques secondes qui peuvent être consultés un par un, puis scrollés… exactement comme sur Tiktok.
L’objectif, d’après Spotify, serait de permettre à ses utilisateurs de pouvoir se faire plus facilement une opinion d’un contenu.
On peut donc écouter le début d’une chanson, d’un podcast ou d’un livre audio sans lancer directement la lecture complète de ce morceau.
Spotify a séparé en 3 sections son interface de découverte : musique, podcasts et livres audios. Les contenus peuvent ensuite être parcourus à la manière de Tiktok
Est-ce que c’est mieux ou moins bien ?
Toujours difficile de juger une interface sans avoir les retours utilisateurs, mais ce qu’on peut dire, c’est que :
C’est une interface qui permet une navigation plus ludique, plus fun, à l’instar de ce qu’on trouve sur les réseaux sociaux
Ça permet effectivement de préécouter chaque contenu et de s’en faire une meilleure opinion
On retrouve des fonctionnalités de partage plus faciles à utiliser
En un sens, c’est mieux. Les longues listes anonymes qui étaient la norme dans la version précédente, ont disparu pour faire place à des listes plus visuelles, plus interactives et ayant un meilleur pouvoir émotionnel.
On a fait notre propre test de la navigation à la Tiktok. Aucune surprise, ça fonctionne bien, et ça permet effectivement de mieux découvrir les contenus.
Devez-vous faire ça ? (Faut-il copier Tiktok ?)
De plus en plus d’apps utilisent le mode de navigation à la Tiktok, même Amazon s’y est mis (lire notre article).
A partir du moment où vous avez des contenus en vidéos/audio et que vous voulez permettre à vos utilisateurs de passer du temps à découvrir des produits, des offres (je pense au voyage, mais aussi au bricolage ou à la beauté), il y a un intérêt à créer une telle interface (avec des contenus qui seront facilement exploitables, en plus, sur les réseaux sociaux, et vice versa).
C’est évidemment un moyen d’accrocher vos visiteurs et d’améliorer votre relation avec eux en créant une expérience basée sur plus d’émotions.
Un moyen de coller aux habitudes des nouvelles générations
Tiktok a beau être dans le viseur des législateurs en Europe et aux Etats-Unis, il n’en reste pas moins que l’application est très populaire et de plus en plus utilisée pour toutes sorte d’usages : divertissement, communication, recherche, découverte, etc.
Et il ne faut pas rester planté sur l’idée que Tiktok est réservé aux jeunes… créée en 2016, l’application est de plus en plus utilisée par des générations plus âgées… notamment celles qui feront les acheteurs/consommateurs de demain. Chaque réseau social a sa génération, et Tiktok (sauf si elle finit par être interdite) sera celle des consommateurs des 10 années à venir.
S’adapter à leurs habitudes est donc primordial. Ne pas le faire présente un risque de passer à côté de millions d’utilisateurs.
Envie de faire votre interface à la Tiktok ?
Si vous souhaitez tester un concept Tiktok, pourquoi ne pas faire une expérimentation ?
Wexperience peut vous accompagner sur ce sujet en :
vous aidant à mettre en place des ateliers créatifs
fabriquant un prototype sur une solution comme UXpin ou en utilisant une plateforme de nocode
Illustration d’un taux de rétention générée par une IA
Vous l’avez sans doute déjà remarqué dans nos précédents articles, le facteur de rétention est sûrement le plus important pour assurer la réussite d’un service en ligne. La rétention, vous savez, c’est cet indicateur qui montre le taux d’adhésion de vos utilisateurs à votre produit. Selon Casey. Winters, ex PO de Pinterest, il est l’indicateur le plus important à suivre et à travailler, car il est celui qui est à la source de tout succès. Peu importe d’arriver à faire venir beaucoup de monde sur votre app si ce monde ne revient pas et ne l’utilise pas à fréquence régulière.
Pour cette raison, nous voulions, dans cet article, vous apporter un peu plus de précisions par rapport à ce taux ainsi que quelques conseils qui vous permettront, nous l’espérons, d’avancer dans votre quête d’un bon taux de rétention.
D’abord quelques chiffres
Casey Winters et Lenny Ratchiski (ex AirBNB) se sont lancés il y a 2 ans dans une mini-étude permettant de comparer les taux de rétention des meilleures startup US. Ils ont interrogé une vingtaine des meilleurs experts US. Voici les résultats.
Taux de rétention par type de modèle d’affaire :
Réseaux sociaux : ~25% est BON, ~45% est TRÉS BON
Ecommerce : ~30% est BON, ~50% est TRÉS BON
Services en Saas grand public : ~40% est BON, ~70% est TRÉS BON
Services en Saas PME: ~60% est BON, ~80% est TRÉS BON
Services en Saas grands comptes : ~70% est BON, ~90% est TRÉS BON
Ces chiffres sont à prendre avec des pincettes et nous ne saurions vous recommander que de lire l’ensemble des résultas de l’étude, mais également d’essayer de vous comparer avec vos concurrents.
Effets vertueux d’un bon taux de rétention
Le taux de rétention indique vraiment le niveau d’amour de vos utilisateurs avec votre app ou service. Plus ce taux est fort, plus il entraîne d’effets de bord positifs :
Plus de partages -> plus de nouveaux utilisateurs, plus de récurrence
Plus de création de contenus (ex : Pinterest, Twitter, etc) -> plus de nouveaux utilisateurs, plus de récurrence
Plus de bouches à oreille positif -> plus de nouveaux utilisateurs
Il y a donc tout intérêt à s’en préoccuper en permanence.
C’est un des points les plus prégnant de la rétention : comment donner le plus de valeur possible à l’utilisateur pour le plus petit effort possible ? Et c’est bien là le point le plus compliqué à gérer pour votre service :
Qu’est-ce qui va plaire à vos utilisateurs ?
Qu’est-ce qui va leur créer le plus de satisfaction ?
Qu’est-ce qui va leur simplifier le plus la vie ?
Qu’est-ce qui va leur rapporter le plus de richesse ?
Donner de la valeur au produit consiste en cela : non seulement, vous devez avoir une véritable offre de service, mais vous devez la rendre la plus simple à obtenir, la plus facile à utiliser qui soit, en vous appuyant notamment sur le modèle comportemental de Fogg qui prédit qu’un comportement se déclenche lorsque l’effort demandé pour réaliser une action et une motivation suffisante sont présents. On peut aussi parler de « valeur perçue » : plus la valeur perçue en échange de l’effort est suffisante et grande pour l’utilisateur, plus il sera motivé à agir.
Arriver à créer ces comportements doit être le Graal de vos actions pour créer de la valeur. C’est bien sûr un chapitre entier de la littérature sur le growth hacking qui devrait y être consacré, mais nous espérons que cette première approche vous satisfera pour commencer à entamer vos propres expérimentations dans le domaine.
Le modèle comportemental de Fogg est un des modèles qui permet de déterminer comment créer des actions qui « engagent » les utilisateurs. Il est basé sur la combinaison de la motivation de l’utilisateur, de sa capacité à accomplir des choses et des messages qui lui sont envoyés (« prompts »). Agir sur la motivation en offrant la promesse d’un bon retour sur investissement pour l’utilisateur est sans doute un des meilleurs moyens de le faire passer à l’action.
Pinterest augmente l’engagement de l’utilisateur en utilisant une mise en forme (mosaïque) et un scroll infini, combinés à une algorithmie qui fait varier la richesse des contenus de manière attractive. Pour l’utilisateur, c’est la combinaison qui lui en donne le plus pour le geste le plus simple : glisser avec le pouce.
2 – Connecter l’utilisateur à la valeur du produit
Et nous entrons là dans l’art difficile de savoir jouer sur l’UX pour faire « sentir » la valeur du produit à l’utilisateur. Il s’agit de lui faire sentir et comprendre le bénéfice qu’il obtient grâce au service de manière générale. Plus il aura l’impression que cette valeur est importante, plus il sera attaché au produit. Et pour cela, l’UX peut être d’une grande aide en jouant sur plusieurs facteurs :
Simplifier l’accès et l’apprentissage de l’application (voir article sur l’onboarding)
Faire ressentir la puissance et les gains engendrés par l’utilisation du service en instillant à petites doses des frictions dans l’UX. Un cas typique de cela est l’affichage d’un écran interstitiel d’attente lors d’une recherche. Même si, en réalité, un résultat de recherche peut être obtenu en quelques millisecondes, donner l’impression que cela demande du temps valorise l’action du service.
De nombreux artifices peuvent être utilisés pour connecter l’utilisateur à la valeur du produit. Il est intéressant de noter que, parfois, cela conduit à être contre intuitif par rapport à l’usage habituel de l’UX.
Un artifice classique consiste à afficher un écran interstitiel, lors d’une recherche, faisant « défiler les chiffres de la recherche ». L’effet psychologique est triple : 1) il freine l’utilisateur dans son expérience, créant un moment d’impatience qui sera ensuite comblé 2) il donne l’impression de richesse de l’offre en faisant visualiser sa quantité
3 – Être toujours en capacité de pivoter
Cela peut paraitre étonnant, mais une des recommandations de Casey Winters, est aussi de savoir garder une grande capacité d’adaptation et de savoir accepter de faire « pivoter » son modèle. Nous ne discuterons pas ici de cette aptitude à faire évoluer son modèle, mais il est intéressant de la noter et de l’intégrer à sa manière de penser dans la perspective de la recherche du succès et de la réussite d’une app.
Les facteurs influents sur la rétention
Comme vous l’avez vu en début d’article, il n’existe pas « un », mais « des » bons taux de rétention. Ce qui est normal. De nombreux facteurs, que nous allons décrire, peuvent modifier la valeur d’un taux de rétention et ceux-ci peuvent varier assez grandement d’un modèle d’affaire à un autre.
Ne vous étonnez donc pas de ne pas atteindre les taux cités plus haut. Ils représentent ce qui se fait chez les leaders et sur des sites à fort trafic. Dans le cas d’un démarrage d’activité, il est fort probable que vous n’atteindrez jamais ces taux. L’important, surtout, est de les garder en ligne de mire.
Les types d’utilisateurs
Selon la cible visée, le taux de rétention peut ne pas être le même. Dans le cas d’un produit grand public pour une activité occasionnelle, ce taux peut être beaucoup plus bas que dans le cas d’une application destinée à des professionnels.
La variabilité des types de profil
Il sera plus facile d’obtenir un bon taux de rétention si votre cible utilisateur est uniforme plutôt que si elle contient plusieurs types de profils utilisateurs. Par exemple, comme c’est le cas sur Pinterest où des amateurs peuvent partager les mêmes expériences que des professionnels, mais à une fréquence moins soutenue.
La stratégie de tarification
Le prix de votre service impactera aussi votre taux de rétention. Tout dépend de la valeur que vous voulez donner à votre produit ou aussi aux tarifs de la concurrence.
La fréquence naturelle
Il s’agit de l’intervalle de temps entre deux interactions pour un même utilisateur donné. Quand on parle d’une application de repas à domicile, celle-ci est beaucoup plus élevé que pour un site ecommerce de niche.
La stratégie d’acquisition
La manière dont vous « chassez » vos nouveaux utilisateurs engendre un taux de rétention plus ou moins fort si vous avez une stratégie d’acquisition massive à l’opposé d’une stratégie d’acquisition ciblée.
Les effets de réseau
Les services qui peuvent engendrer des effets de réseaux (typiquement les réseaux sociaux) peuvent bénéficier d’un « bonus » par rapport aux services ne pouvant en engendrer. C’est donc un autre facteur à prendre en compte.
Conclusion
Dans cet article, nous nous sommes concentrés sur les chiffres et les méthodes. Nous verrons prochainement comment certains pattern UX sont bénéfiques à la rétention et contribuent à l’atteinte des objectifs de réussite.
Bien évidemment, et vous l’avez compris à travers cet article, l’UX ne peut pas tout. Une bonne rétention est un mix de différents facteurs incluant également les aspects d’aura de marque, de conjoncture, de mode, de marché, etc…
Nous espérons, en tout cas, que cette explication du sujet vous aura donné la curiosité d’aller voir plus loin dans votre quête incessante d’une bonne UX.