Audit UX

Heuristiques

Pour commencer, j'ai procédé à une analyse basée sur les 10 heuristiques d'utilisabilité de Nielsen pour la conception d'interface utilisateur. Cela a révélé 2 problèmes majeurs dans le parcours de réservation. Le premier concerne la cohérence et les standards, le site manque de logique entre les éléments UI et leur fonction. Le second problème a mis en évidence des difficultés dans le formulaire de recherche et la navigation entre la liste des hébergements et la page de détails.

Cette analyse a également montré un très bon point sur le service existant : le design global répond aux critères esthétiques et minimalistes, ce qui est positif.

‍

Tests d'utilisabilité

Pour poursuivre cet audit, j'ai créé des scénarios de test et demandé à un panel d'utilisateurs de les réaliser. Grâce à l'outil lookback.io, j'ai pu donner mes indications dans un environnement numérique et j'ai enregistré toute la session pour analyser les réactions des utilisateurs lors de l'utilisation du site.

Cette phase a révélé des frustrations à différentes étapes du parcours de réservation :

1. La recherche de disponibilités pour un hébergement spécifique était très pénible car l'utilisateur devait tester différentes dates pour finalement trouver une place
2. Le site était construit avec 2 UI et parcours utilisateur complètement différents pour le même type d'action : lister les hébergements et rechercher par critères
3. Comme le site agrège différents hébergements, la réservation en ligne n'est pas toujours disponible. Parfois le formulaire de réservation est juste une pré-réservation sans paiement et parfois le seul moyen de réserver est de contacter directement l'hôte. Le problème est que l'utilisateur ne sait comment réserver qu'à la fin du parcours utilisateur

‍

Tri des cartes

Enfin, j'ai utilisé un troisième et dernier outil dans cette partie de l'audit : le tri de cartes. La confusion que j'ai remarquée pendant les tests d'utilisabilité m'a fait réfléchir à la navigation principale, j'ai donc demandé à l'un de mes testeurs de trier les entrées du menu selon sa logique. Le premier tri était fermé, ce qui signifie que l'utilisateur ne pouvait que réorganiser les entrées existantes, et le second était ouvert, l'utilisateur pouvait supprimer ou ajouter ses entrées de menu à sa convenance. Le résultat était significatif : la racine de la navigation dans le tri de cartes ouvert était complètement modifiée.

‍

Benchmark

Pour compléter la mission, j'ai effectué des recherches secondaires en procédant à une analyse comparative de l'état de l'art pour la réservation d'hébergements en ligne. Comme première référence, j'ai suggéré d'examiner le calendrier de disponibilité d'Airbnb car il montre en un coup d'œil l'occupation de l'hébergement, sans avoir à choisir des dates et vérifier si c'est ok ou non.

J'ai également suggéré d'examiner le module de recherche de trivago sur la page d'accueil, simple et fluide pour plonger rapidement dans la liste des résultats.

Et enfin, j'ai proposé de tester le tunnel de Booking.com jusqu'à l'étape de réservation, avec un libellé très clair pour l'utilisateur final.

‍

Feuille de route

Quelques semaines après l'audit UX, le client m'a recontacté pour passer aux étapes suivantes et travailler avec l'équipe technique pour tester et implémenter les changements sur le site existant. Tout d'abord, j'ai commencé à ébaucher une feuille de route du projet pour donner au client une vue d'ensemble et une idée du timing pour atteindre les objectifs.

‍

Lean UX

Pour cette partie de la mission, le client avait un budget restreint et voulait itérer et vérifier rapidement si les suggestions de l'audit étaient correctes. J'ai choisi de mener ce projet avec une approche Lean UX, permettant à l'équipe de travailler sur des hypothèses, d'implémenter un MVP et de le tester avec les utilisateurs finaux pour collecter des retours et apprendre pour la prochaine itération.

Phase "Think"

Nous avons commencé ce travail par plusieurs ateliers, réunissant toute l'équipe, les parties prenantes et l'équipe de développement pour obtenir une vision commune et partagée du produit. Ensuite, basé sur les résultats de l'entreprise, les utilisateurs ciblés, les résultats des utilisateurs et les fonctionnalités à offrir, nous avons fait des suppositions et des hypothèses. Nous avons également défini comment mesurer le résultat pour valider ou non les hypothèses.

Enfin, j'ai animé un atelier de design studio avec l'équipe, pour obtenir une vision partagée du flux utilisateur. Nous avons également appliqué les règles UI du service existant pour obtenir un résultat de haute fidélité.

‍

Phase "Make"

Pendant la phase de création, j'ai utilisé un outil nommé Bravostudio, nous permettant de simuler une application mobile basée sur le fichier de design Figma. Juste en lisant la documentation, l'équipe a pu créer une application native en 1 semaine, avec 0 lignes de code.

Nous avons également branché certains outils pour donner une impression d'utiliser un produit "fini". Nous avons utilisé Airtable pour simuler une petite base de données contenant les détails et photos des hébergements et nous avons utilisé Make (anciennement integromat), pour automatiser certains scénarios comme la vérification des disponibilités ou le stockage des données de nouvelles réservations dans une base airtable.

‍

Phase "Check"

Dernière phase de cette première itération : vérifier les hypothèses directement avec des utilisateurs finaux aléatoires sélectionnés dans la rue avec un format de test Guerilla. J'ai créé un guide de test avec un petit scénario à réaliser avec les utilisateurs. Après avoir obtenu le consentement des utilisateurs pour conserver l'enregistrement vidéo et audio, nous avons pu collecter des retours très qualitatifs et apprendre de ces tests ce que nous avons bien fait, ce que nous avons mal fait, et ce que nous pourrions améliorer pour bien faire.

J'ai également fait passer un formulaire System Usability Scale à la fin de chaque test avec les utilisateurs finaux pour collecter plus de retours concernant l'expérience elle-même et comment les utilisateurs se sont sentis en utilisant l'application. Avec un très bon score de 81, ces hypothèses ont été un grand succès.

‍

‍

Aperçu du prototype final

Pour le prototype, comme l'application était directement installée sur mon appareil de test, j'ai enregistré l'expérience utilisateur ci-dessous.

‍

Résultats pour le client

Avec ce projet long et très riche, je pense que le client a fait la bonne chose en procédant en 2 étapes et en demandant des vérifications rapides des suggestions initiales. À la fin de la mission, le client dispose d'une feuille de route pour son équipe de développement pour intégrer dans le service existant les changements que nous avons validé pendant la phase Lean UX. Il a également un très bon départ pour passer d'un site web uniquement desktop à une expérience mobile grâce aux techniques responsives.

Résultats personnels

J'ai découvert l'outil Bravostudio pendant ce projet et cela a été un véritable atout pour la phase de tests Guerilla. Sans engager de force de développement, nous avons réussi à fournir une expérience utilisateur proche du réel et obtenir des retours de haute qualité. Je suivrai de près l'évolution de la technologie Bravostudio dans les prochaines semaines/mois.

En dehors de l'outil, il était très satisfaisant de partir de l'audit UX et de donner vie aux suggestions, suppositions et hypothèses que nous avions faites et de voir que nous étions dans le vrai.

Un défi cependant, était pendant l'audit, de faire attention aux biais cognitifs lors de la réalisation des tests d'utilisabilité.

‍