Modèle de flux utilisateur
Aidez les équipes UX et produits à améliorer l’expérience utilisateur en encourageant les conceptions aux solutions créatives.
À propos du modèle de flux utilisateur
Un diagramme de flux utilisateur (également appelé diagramme de flux d'interaction ou de tâches) est un processus de cartographie visuelle étape par étape, décrivant ce qu'un utilisateur fait pour terminer une tâche ou atteindre un objectif grâce à votre produit ou expérience.
La création de diagrammes du flux utilisateur peut aider à interpréter la qualité ou l’expérience du chemin choisi par un utilisateur. Le flux peut également révéler combien d'étapes ils ont choisi pour accomplir une tâche et quelles voies ils décident de prendre lorsqu'ils interagissent avec votre produit ou service pour résoudre un point de douleur.
Alors que les diagrammes de flux utilisateur se concentrent sur la manière dont un utilisateur navigue dans un produit particulier, un modèle de flux d'écran présente une disposition de page de style fil de fer sous forme de diagramme de flux.
Qu'est-ce qu'un diagramme de flux utilisateur ?
Les diagrammes de flux utilisateur aident les équipes UX et produits à cartographier le chemin logique qu'un utilisateur doit suivre lorsqu'il interagit avec un système. En tant qu'outil visuel, le diagramme de flux utilisateur montre la relation entre la fonctionnalité d'un site web ou d'une application, les actions potentielles qu'un utilisateur pourrait entreprendre et le résultat de ce que l'utilisateur décide de faire.
Les principaux éléments d'un flux utilisateur sont :
Un point de départ ou d'arrivée : cela indique clairement où le flux commence ou se termine
Processus ou action : montre les étapes que l'utilisateur suit, telles que « connexion » ou « achat ».
Points de décision : montre quand un utilisateur doit faire un choix
Flèches : elles indiquent où l'utilisateur se dirige en fonction des décisions prises
Essayez un flux utilisateur si votre équipe cherche à évaluer ou à améliorer comment l'expérience utilisateur existante peut mener à de meilleurs taux de conversion client.
Le processus peut vous aider à garder votre utilisateur à l'esprit et à définir l'objectif commercial, comme un achat, une inscription à la newsletter ou l'option d'un essai gratuit.
Quand utiliser un modèle de flux utilisateur
Les diagrammes de flux d'utilisateurs peuvent vous aider à :
Construisez des interfaces intuitives : votre flux est-il facile à parcourir, efficace à utiliser et intuitif pour l'utilisateur ?
Déterminez si votre interface actuelle est adaptée : ce qui fonctionne, ne fonctionne pas ou nécessite des améliorations ? Le flux semble-t-il fluide et cohérent ?
Présentez le processus de votre produit aux équipes internes ou aux clients : votre équipe de design peut-elle voir ce que dit ou fait votre client pendant le processus d'achat, d'inscription ou de connexion ? Les clients peuvent-ils obtenir une vue d'ensemble étape par étape pour s'aligner sur votre vision ?
Lors de la création - ou de la recréation - d'un flux utilisateur, posez des questions à vous-même et à votre équipe :
Que cherche à faire l’utilisateur ?
Qu’est-ce qui est important pour l'utilisateur et qui lui donnera la confiance nécessaire pour continuer ?
Quelles informations supplémentaires l'utilisateur a-t-il besoin pour réussir ?
Quelles sont les hésitations ou les obstacles de l'utilisateur pour accomplir la tâche ?
Une carte de flux utilisateur peut aider les concepteurs (et leurs équipes ou clients) à rester centrés sur l'utilisateur, même lorsqu'ils cartographient des processus complexes.
En tant que concepteur, vous pouvez utiliser des diagrammes de flux utilisateur pour décider de la manière dont vous allez concevoir les pages, écrans ou interfaces de votre site web ou application, et réorganiser le contenu et les tâches de navigation à inclure.
Créez votre propre diagramme de flux utilisateur
La cartographie de votre propre flux utilisateur est facile. Le canevas visuel de Miro est l'endroit idéal pour créer et partager votre diagramme. Commencez par sélectionner le modèle de flux utilisateur, puis suivez les étapes suivantes pour créer le vôtre :
Décidez de vos objectifs commerciaux et de ceux de vos utilisateurs.
Déterminez où vous souhaitez que vos utilisateurs finissent. Si vous n'en avez pas déjà un (ou si vous devez le mettre à jour), utilisez une carte de parcours client pour créer une vision partagée de votre expérience client. Chaque membre de l'équipe peut bénéficier d'une compréhension partagée des sentiments de vos clients à chaque point de contact potentiel avec votre produit ou service. Développer l'empathie pour les utilisateurs vous guidera à chaque étape de votre processus de flux utilisateur.
Découvrez comment les visiteurs trouvent votre site web.
Vos clientes et clients trouvent-ils votre produit ou service grâce au trafic direct, à la recherche organique, à la publicité payante, aux réseaux sociaux, aux liens de référence ou aux e-mails ? Ces points seront le départ de votre diagramme de flux utilisateur, en fonction de ce que vous découvrirez.
Découvrez quelles informations vos utilisateurs nécessitent et quand ils en ont besoin.
Les utilisateurs convertissent lorsqu’ils reçoivent la bonne information au bon moment, alors réfléchissez à ce que votre client attend de votre point de contact numérique et à ce qu’il peut ressentir. L'engagement – par exemple, une interaction avec un chatbot – reste un indicateur de succès potentiel – ce n'est pas seulement une question d'aboutir à un achat final.
Planifiez votre flux utilisateur.
Vous pouvez modifier les formes et les flèches existantes de notre modèle de flux d'utilisateur pour les adapter à la recherche utilisateur que vous avez réalisée dans les étapes précédentes. Après que votre client découvre votre premier point de contact, que fait-il ensuite ? Combien d'étapes leur faut-il pour terminer une tâche ? Utilisez le flux utilisateur de base sur le modèle pour commencer à dessiner le vôtre. Modifiez les points de contact, les abandons et les directions des flèches des lignes de connexion pour mieux adapter votre diagramme de flux utilisateur.
Obtenez des retours de votre équipe.
Invitez votre équipe, vos clients ou vos parties prenantes transversales à consulter votre tableau Miro. Vous pouvez choisir de laisser des commentaires de manière asynchrone avec des pense-bêtes ou des @mentions pour une révision par vos pairs. Vous pouvez également vous joindre à une visioconférence dans votre tableau Miro et désigner quelqu'un de votre équipe pour jouer le rôle de preneur de notes. Une fois que vous disposez de suffisamment de retours de votre équipe, effectuez les ajustements nécessaires en conséquence.
Partagez avec d'autres parties prenantes ou clients et continuez à réitérer si nécessaire.
Votre flux utilisateur évoluera au fil du temps à mesure que les attitudes et les motivations de vos clients changeront. Adaptez en conséquence, restez centré sur l'utilisateur.
Qu'est-ce qu'un bon exemple de user flow ?
Imaginez que vous développiez un site web pour un événement. Si vous voulez améliorer l'expérience de l'utilisateur, vous devez définir toutes les étapes nécessaires à l'inscription à l'événement et à l'achat des billets. Vous pouvez commencer par suivre le cheminement de vos clients et savoir où ils commencent leur parcours pour acheter les billets de votre événement. Le diagramme de flux d'utilisateurs vous aide à visualiser d'un coup d'œil la manière dont le client effectue son achat (l'objectif ultime de votre site web), depuis l'inscription jusqu'à la page de paiement.
Commencer avec ce modèle maintenant.
Modèle de wireframes basse fidélité
Idéal pour:
Recherche documentaire, Gestion de produit, Wireframes
Lorsque vous concevez un site ou développez une application, les premières étapes doivent être GRANDES — avoir une vision d’ensemble et communiquer l'idée maîtresse. Les wireframes basse fidélité vous permettent de voir et de faire. Ces maquettes (pensez-y comme la version numérique d'un croquis sur une serviette) aident vos équipes et les parties prenantes du projet à déterminer rapidement si une réunion de conception répond aux besoins de vos utilisateurs. Notre modèle vous permet d'utiliser facilement des maquettes lors des réunions ou ateliers, des présentations et des sessions de critique.
Modèle Organigramme de Site Internet
Idéal pour:
Flowcharts, Mapping, User Experience
Un organigramme de site internet, également appelé plan de site, décrit la structure et la complexité de tout site internet actuel ou futur. L'organigramme de site internet peut également aider votre équipe à identifier ses failles en matière de connaissances pour le contenu futur. Lors de la création d'un site web, vous voulez vous assurer que chaque contenu donne aux utilisateurs des résultats de recherche précis basés sur les mots clés associés à votre contenu web. Les équipes produit, UX et de contenu peuvent utiliser des organigrammes de site internet ou des plans de site pour comprendre tout ce qu'un site Web contient et prévoir d'ajouter ou de restructurer du contenu pour améliorer l'expérience utilisateur d'un site Web.
Modèle de prototype
Idéal pour:
Conception UX, design thinking
Un prototype est une maquette interactive de votre produit qui définit la structure, le flux utilisateur et les détails de navigation (comme les boutons et les menus) sans s'engager sur des détails définitifs tels que le design visuel. Le prototypage vous permet de simuler comment un utilisateur pourrait vivre votre produit ou service, de cartographier les contextes et flux de tâches des utilisateurs, de créer des scénarios pour comprendre les personas, et de recueillir des retours sur votre produit. Utiliser un prototype vous aide à économiser de l'argent en identifiant les obstacles tôt dans le processus. Les prototypes peuvent varier, mais contiennent généralement une série d’écrans ou de plans de travail reliés par des flèches ou des liens.
Modèle de Wireframe d’application
Idéal pour:
Conception UX, Wireframes
Prêt à commencer à créer une application ? Ne vous contentez pas d'imaginer son fonctionnement et comment les utilisateurs interagiront avec lui—laissez un wireframe vous le montrer. Le wireframing est une technique pour créer un agencement de base de chaque écran. Lorsque vous créez un wireframe, idéalement tôt dans le processus, vous comprendrez ce que chaque écran va réaliser et obtiendrez l'adhésion des parties prenantes importantes—tout cela avant d'ajouter le design et le contenu, ce qui vous fera gagner du temps et de l'argent. Et en réfléchissant aux choses en termes de parcours utilisateur, vous offrirez une expérience plus convaincante et réussie.