Comment créer un diagramme de flux utilisateur
Ne commencez pas par créer un diagramme de flux utilisateur en vous basant sur une simple supposition. Utilisez plutôt des données pour orienter votre processus. Suivez ces étapes pour recueillir les informations nécessaires à la création de diagrammes de flux utilisateur précis.
1. Déterminez votre objectif et les objectifs de vos utilisateurs
On ne peut donner d'indications sans connaître la destination. De même, on ne peut créer un flux utilisateur sans avoir déterminé où l'on souhaite que ses utilisateurs aboutissent, et surtout, ce qu'ils attendent de l'application ou du site Web.
Vous êtes probablement conscient de l'objectif de votre entreprise, qui peut consister à convaincre les utilisateurs d'acheter un produit, de s'inscrire à une newsletter ou encore de télécharger un contenu protégé. Mais vous n'avez pas nécessairement une idée aussi claire de ce que les utilisateurs viennent chercher sur votre site.
Si vous ne l'avez pas encore fait, créez une carte de parcours client pour offrir à votre entreprise une vision commune de ce à quoi l'expérience client devrait ressembler. Ce type de diagramme permet de représenter ce que ressent un client aux différentes étapes de son parcours ainsi que ses points de contact éventuels. Un logiciel de cartographie de parcours client permet de déterminer comment vos utilisateurs accèdent à votre site, ce qu'ils font une fois qu'ils y sont et ce qu'ils font lorsqu'ils le quittent.
Insérez un modèle de carte de parcours client avec légende : ce modèle gratuit de carte de parcours client vous aidera, vous et votre équipe, à visualiser clairement le processus de l'expérience de vos clients avec votre entreprise.
Si votre flux prend en charge des fonctionnalités complexes, comme l'authentification unique (SSO), les autorisations d'entreprise ou les états d'abonnement, définissez dès le départ les critères de réussite pour ces scénarios. Sinon, le parcours idéal peut sembler parfait, alors qu'en réalité des cas particuliers nuisent à l'expérience utilisateur.
2. Déterminez comment les visiteurs trouvent votre site Web
Si vous cherchez à améliorer un site Web ou une application existante, analysez les données. Google Analytics vous fournira les pourcentages pour chacune des méthodes d'entrée suivantes :
-
Trafic direct
-
Recherche organique
-
Publicité payante
-
Réseaux sociaux
-
Sites de référence
-
E-mail
Analysez ce que ces différents points d'entrée révèlent sur vos utilisateurs et comment adapter au mieux l'expérience à leurs besoins. Ces points d'entrée constitueront le point de départ de votre diagramme de flux utilisateur.
3. Identifiez les informations dont vos utilisateurs ont besoin et le moment où ils en ont besoin
Maintenant que vous savez par où commencer, déterminez les informations dont vos utilisateurs ont besoin et les actions qu'ils doivent entreprendre. Pour les convertir, vous devez leur fournir les informations appropriées au moment le plus opportun.
N'oubliez pas de vous poser des questions lorsque vous créez votre diagramme de flux utilisateur. Mettez-vous à la place de vos clients, par exemple : « Que ferais-je sur cette page si j'étais mon client ? », « Comment naviguerais-je dans le processus de paiement ? » et « Si j'étais ce client, que penserais-je de cette vidéo de témoignage ? » Réfléchissez à ce que le client attend d'une page en particulier, à ce qu'il peut ressentir et à son état d'esprit.
Si vous optimisez un site Web existant, observez les éléments qui fonctionnent actuellement. En d'autres termes, lorsque les utilisateurs achètent ou réalisent d'autres activités, quel parcours empruntent-ils sur votre site ? Ne prenez pas seulement en compte l'achat : il faut parfois plusieurs visites sur un site avant qu'un client ne valide une commande. Cependant, si un visiteur s'inscrit à votre newsletter ou à vos communications SMS via une fenêtre pop-up, vous pouvez considérer cela comme une réussite.
C'est également le moment d'inventorier les parcours moins courants mais à fort impact, tels que la réinitialisation des mots de passe, les essais expirés, les échecs de paiement, les fusions de comptes, les erreurs d'autorisation et autres exceptions. Ce sont les scénarios qui ont tendance à vivre dans la tête des gens (ou dans des notes éparses) jusqu'à ce qu'un diagramme les fasse figurer sur la page.
4. Cartographiez votre flux utilisateur
Maintenant que vous connaissez votre public, ses motivations et les parcours types qu'il suit pour accomplir différentes actions, vous pouvez commencer à créer un diagramme de flux utilisateur. Choisissez un espace de travail visuel, comme Lucidchart, où vous pouvez facilement faire glisser et déposer des formes pour illustrer votre parcours utilisateur et indiquer les moyens de satisfaire et d'informer votre client.
Commencez par représenter les points d'entrée, tels qu'organiques ou payants, avec des formes. Vous pouvez même recourir à des wireframes basse fidélité plutôt qu'à de simples formes géométriques pour donner une idée de l'apparence du site ou de l'application et de l'emplacement de vos appels à l'action.
Ensuite, déterminez le contenu de la page de destination et les décisions que votre client devra prendre sur celle-ci. Ajoutez d'autres formes et points de décision jusqu'à ce que votre flux soit complet.
Visez l'exhaustivité sans complexité inutile. Incluez tous les détails nécessaires à votre public pour prendre des décisions éclairées, mais évitez les informations superflues qui rendent la lecture difficile. Le niveau de détail que vous fournissez doit dépendre entièrement de vos parties prenantes.
-
Vues d'ensemble : les dirigeants n'ont peut-être besoin que d'une vue d'ensemble du parcours utilisateur pour comprendre la logique métier.
-
Spécificités techniques : les ingénieurs ont souvent besoin de détails précis, tels que les conditions du système, les requêtes ou les points de contact de l'API.
L'intégration de wireframes dans vos flux utilisateurs permet de relier l'interface utilisateur à la logique système sous-jacente, facilitant ainsi la validation de la compatibilité de chaque écran avec l'étape suivante. Dans de nombreux cas, une série de wireframes peut sous-entendre le code nécessaire, réduisant ainsi le besoin de descriptions écrites trop longues.
Toutefois, privilégiez l'efficacité à une documentation exhaustive. Si votre équipe utilise un vocabulaire standard pour les composants, nommer le modèle peut s'avérer plus efficace que d'intégrer chaque image. Ajustez le niveau de détail visuel pour que le diagramme reste une ressource utile et non une contrainte. Enfin, n'oubliez pas : votre diagramme de flux utilisateur est susceptible d'évoluer au fil du temps, au gré des changements de votre public et de ses motivations à naviguer sur votre site.
5. Recueillez les commentaires, finalisez et partagez
Si vous créez un nouveau site ou une nouvelle application, partagez votre diagramme de flux utilisateur avec les autres parties prenantes afin de recueillir leurs commentaires et de l'ajuster si nécessaire. Ce visuel est particulièrement efficace dans ce contexte, car les parties prenantes peuvent appréhender l'expérience que vous proposez d'un seul coup d'œil.
Une fois que vous avez finalisé le diagramme de flux utilisateur, partagez-le avec les designers UX, les développeurs Web, les ingénieurs logiciel et les autres collaborateurs pour leur communiquer le concept avant qu'ils ne se lancent dans la création de votre site Web ou application.
Lorsque vous concevez des flux utilisateur dans Lucidchart, il est facile d'obtenir des commentaires sur des parties spécifiques d'un diagramme. Il vous suffit de laisser des post-it ou d'étiqueter des collègues dans les commentaires pour collaborer en temps réel ou de manière asynchrone.
De plus, Lucidchart sert de source unique de vérité depuis le début d'un projet jusqu'à la mise en production du code. Si votre équipe utilise un logiciel de gestion de projet (comme Jira et Confluence) ou des outils de partage des connaissances, pensez à intégrer le diagramme Lucidchart à ces outils pour qu'il reste facilement accessible depuis les tickets et la documentation. Grâce à la synchronisation bidirectionnelle, chaque modification apportée à vos diagrammes dans Lucidchart est automatiquement répercutée dans tous les outils où ils sont intégrés, garantissant ainsi que les équipes travaillent toujours avec les informations les plus récentes.