🧜🏽 🖐🏻 👩‍🏫 Flux d'utilisateurs: comment créer des applications et des sites populaires 👨‍🏫 🍂 🤶🏻

Bonjour à tous!

Je suis Maxim Skvortsov, concepteur UX / UI d'Omega-R, une entreprise internationale pour le développement et l'intégration de solutions informatiques. Je conçois et visualise les interfaces d'applications mobiles et web.

Fort de mon expérience dans le domaine des technologies de l'information et de l'expertise des entreprises, je souhaite partager ma vision et mon approche de l'utilisation d'un des outils de design design - le flux d'utilisateurs. Pourquoi est-il utilisé et pourquoi est-il un précieux assistant pour un designer? À quoi peut ressembler le flux d'utilisateurs et comment le créer?

Qu'est-ce que le flux d'utilisateurs?

Situation: vous avez trouvé une nouvelle application qui promet de faire exactement ce que vous voulez et vous appuyez avec impatience sur le bouton de téléchargement. Après un moment, l'application démarre et vous êtes prêt à démarrer. Mais vous devez d'abord créer un compte, puis donner à l'application la permission d'accéder à votre emplacement et de vous envoyer des notifications push, après quoi vous devez faire défiler l'intégralité du tutoriel, l'accord sur l'utilisation des données personnelles, etc. L'amère vérité est que l'utilisateur dans cette interaction est plus susceptible de fermer et de désinstaller l'application, quelle que soit sa fonctionnalité. C'est pourquoi il est si important d'optimiser le chemin utilisateur dans l'application avec le flux utilisateur.

Le flux utilisateur est une représentation visuelle de la séquence d'actions.que l'utilisateur effectue pour atteindre son objectif . Il peut couvrir soit une fonction particulière, soit l'ensemble du produit.

Pour réaliser une séquence, il est nécessaire de mener une étude et de répondre à trois questions fondamentales :

Qui est l'utilisateur?
Quel est son but?
Quelles mesures devrait-il prendre pour y parvenir?

Ce sont les principales questions auxquelles il peut parfois être difficile de donner des réponses claires, des questions complémentaires peuvent donc aider:

Pour quoi l'utilisateur utilisera-t-il l'application?
Qu'est-ce qui motive l'utilisateur à atteindre cet objectif?
Comment l'application vous aide-t-elle à atteindre votre objectif?
Qu'est-ce qui peut empêcher un utilisateur d'utiliser l'application?
Quelles qualités d'un produit ou service sont les plus importantes pour le client et les utilisateurs? Quelles sont les questions, les doutes et les hésitations?
Quelles qualités de l'application sont les plus importantes pour l'utilisateur?
De quelles informations les utilisateurs ont-ils besoin pour effectuer une action?
Quel type de déclencheur émotionnel les pousse à l'action?

Dans le processus de conception, de nombreuses questions doivent toujours se poser. La recherche de réponses à ces questions donne l'occasion de considérer chaque petite chose de tous les côtés. Ce n'est que dans ce cas que le résultat peut être un produit vraiment pratique.

Le flux d'utilisateurs est une histoire d'un utilisateur.

Le flux utilisateur vous permet de regarder l'interaction de l'utilisateur et de l'application à travers les yeux de l'utilisateur.

Si les sites à part entière offrent suffisamment d'espace pour la créativité, le développement d'applications mobiles nous oblige toujours à rechercher un équilibre entre fonctionnalité et convivialité. D'une part, les utilisateurs devraient facilement accéder aux fonctions les plus importantes à partir de l'écran principal de l'application sans beaucoup d'étapes supplémentaires, en cliquant facilement sur les gros boutons. D'un autre côté, lorsque nous parlons d'applications, il ne s'agit pas seulement de boutons.

Supposons que vous créez une application pour un lecteur de musique. D'une part, vous voulez que l'utilisateur puisse jouer ses chansons préférées avec une seule touche. D'un autre côté, ils ont besoin d'un moyen pour déterminer les morceaux préférés, rechercher de la nouvelle musique (éventuellement à plusieurs endroits), contrôler le volume et régler l'égaliseur, trier la musique, mélanger la liste, lire la biographie de l'artiste, faire des achats et avoir toutes les autres fonctions du lecteur à portée de main. L'utilisateur voudra partager des recommandations et des listes de lecture sur les réseaux sociaux et voir ce que ses amis écoutent.

Si l'utilisateur surfe sur la boutique en ligne tout en écoutant la liste de lecture et décide de sauter la piste en cours, il n'a pas besoin de fermer la boutique et de revenir en arrière à travers plusieurs étapes du menu - l'accès à ce bouton de saut devrait être sur le même écran.

La création de l'application la plus fonctionnelle n'est pas si difficile, mais assembler le tout de la manière la plus attrayante et la plus conviviale est une tâche beaucoup plus difficile. Si la société de développement n'y a pas fait face et n'a pas créé l'application de manière intuitive, elle ne sera pas réclamée dans les histoires. Il est toujours plus facile pour l'utilisateur de télécharger une application plus compréhensible que de passer du temps à lire des manuels et des tutoriels ou à s'y promener sans cesse à la recherche de sens.

Rôle de concepteur

Imaginez que vous travaillez sur un produit dans une équipe où se trouvent des chefs de projet, back-end et développeurs Web. Supposons qu'il existe même une sorte de tâche technique de la part du client, qui est écrite de manière suffisamment détaillée et sonore. Il ne reste plus qu'à prendre et fabriquer un produit.

Que doit faire un designer? À en juger par le résultat attendu, dessinez tous les écrans nécessaires pour que le produit final soit pratique et beau, et donnez-le aux développeurs.

En général, oui. Mais il y a une partie sous-marine d'un iceberg. Beaucoup de choses y sont cachées auxquelles peu de gens pensent. Nous aimons tous les interfaces pratiques et intuitives, nous l'aimons lorsque tout fonctionne logiquement et que le résultat de toute interaction est prévisible. Et pour que tout cela se produise, vous devez soigneusement travailler chaque détail.

Pour cela, vous avez besoin d'un flux d'utilisateurs - cela vous aidera à déterminer les moyens pour les utilisateurs d'atteindre l'objectif, de calculer des scénarios positifs et négatifs sur le chemin choisi pour atteindre les objectifs de nos utilisateurs potentiels. Il permet de comprendre si tous les processus du produit ont une conclusion logique et sont construits efficacement, de sorte que l'utilisateur passe un minimum de temps pour atteindre l'objectif.

Important: plus le problème est important et plus il y a de fonctions, plus vous devez étudier de scénarios.

Ainsi, le flux utilisateur permet d'éliminer une erreur courante lors de la création d'une liste de fonctions requises et de la conception simple d'interfaces basées sur celles-ci. Une telle approche est bien sûr possible. Mais cela peut conduire à des scénarios d'interaction avec l'interface obligeant l'utilisateur à passer par trop d'étapes pour effectuer des opérations simples.

Valeur pour l'équipe produit

Le flux utilisateur aide au niveau supérieur à coordonner les scénarios avec le client pour le produit ou la fonctionnalité. Surtout lorsque les clients n'ont pas d'exigences spécifiques et détaillées (lorsqu'ils comprennent eux-mêmes mal ce qu'ils veulent). Dans ce cas, le flux d'utilisateurs peut donner une certaine direction aux clients, et ils vous diront déjà à quels endroits ils souhaitent changer la logique en fournissant leurs commentaires - soit sous la forme d'un commentaire, soit en ajustant indépendamment le schéma actuel. Malgré le fait que la création d'un flux d'utilisateurs semble être un processus compliqué et long, cela aide à éliminer beaucoup d'erreurs lors du développement du produit. Avec son aide, comme on dit, "attelez lentement, mais roulez rapidement".

Pour PM, en fonction du flux d'utilisateurs, il est pratique de démarrer des tâches pour les développeurs - il est assez évident et transparent quels changements doivent être apportés à la logique actuelle ou quelles nouvelles fonctions seront ajoutées.

Les testeurs peuvent préparer des cas d'utilisation (tests) et des listes de contrôle, car ils présentent des scripts conviviaux dans un format pratique.

Le flux d'utilisateurs est très utile pour l'équipe, surtout lorsque la composition de l'équipe est suffisamment grande - vous n'avez pas besoin d'expliquer séparément la logique du travail. Ainsi, le flux d'utilisateurs implique le client dans le processus de conception, motive l'équipe, dirige tous les processus de travail dans une seule direction, car chaque membre de l'équipe voit l'image dans son ensemble.

La valeur client

Un utilisateur est presque toujours celui qui achète ou utilise un produit ou un service ou est potentiellement prêt à le faire. De la façon dont ce processus est confortable, la fidélité de ses utilisateurs dépend. Peu importe comment il achète un produit ou un service - au bureau, par appel, avec un spécialiste visitant la maison, via le site, via l'application - la manière d'acquérir et d'utiliser doit être aussi simple que possible.

En ce qui concerne les sites et les applications mobiles, le flux d'utilisateurs est la manière dont l'utilisateur naviguera dans le contenu (texte, images, audio, vidéo). Le flux d'utilisateurs comprend la hiérarchisation des exigences de contenu, les obstacles à la navigation et la recherche des itinéraires les plus rapides et les plus indolores vers l'action cible. Essentiellement, le flux d'utilisateurs est directement connecté à l'entonnoir de conversion, et la société informatique qui utilise le flux d'utilisateurs développe automatiquement un entonnoir de conversion efficace ou optimise un entonnoir existant.

Le résultat de l'aide qui lui a été fournie pour atteindre l'objectif incarné dans la conception grâce au flux d'utilisateurs est un utilisateur heureux et intéressé. Un utilisateur heureux et intéressé signifie plus de temps passé dans l'application ou sur le site, des taux de rebond inférieurs, des taux de conversion accrus et une expérience utilisateur améliorée.

Ainsi, le flux d'utilisateurs affecte directement le succès du site ou de l'application mobile et le profit du client. L'utilisateur devient le centre de la conception, ce qui coïncide complètement avec le principe de l'orientation client vers l'entreprise.

À quoi cela ressemble-t-il?

Je n'ai jamais vu de norme clairement définie selon laquelle se déroule la conception du flux d'utilisateurs. La représentation du flux d'utilisateurs peut être différente et dépend de la façon dont tout doit être élaboré. Il est important d'atteindre votre objectif en tant que concepteur - afin que le client et l'équipe produit comprennent comment l'utilisateur aura accès à une fonction particulière, où ils seront situés et comment ils fonctionneront.

Le flux d'utilisateurs peut être représenté par des combinaisons de:

flux de tâches
flux de fil (lo-fi)
flux d'écran (hi-fi)

Regardons chacun d'eux et voyons à quoi ils peuvent ressembler. À titre d'exemple, nous prenons la boutique en ligne d'appareils électroménagers. Définissez l'utilisateur, son objectif et les étapes pour atteindre l'objectif.

Que notre utilisatrice soit une jeune maman dont le but est d'acheter un robot multifonctionnel. Un scénario dans la séquence d'étapes peut ressembler à ceci:

ouvrir le site Web de la boutique;
tapez dans la recherche «robot culinaire»;
Comparez plusieurs produits à partir des résultats de recherche
mettez le produit que vous aimez dans le panier;
Faire un achat;
payer;
fermez le site.

Flux de tâches

Le flux de tâches est une représentation simple de ce que l'utilisateur fait à chaque étape pour atteindre un objectif ou une tâche. Il s'agit essentiellement d'un organigramme classique qui définit cette séquence.

Ce schéma ne reflète pas les conventions et autres questions qui doivent être traitées. Et que se passera-t-il si rien n'est trouvé par les résultats de la recherche? Et que se passera-t-il si le paiement échoue? Ici, seules les étapes générales sont présentées et peuvent impliquer de nombreuses actions: par exemple, la recherche peut être étendue avec de nombreux filtres, le chemin de paiement dépend du choix de l'outil de paiement, etc.

Pour établir un diagramme, vous pouvez utiliser la liste des éléments nécessaires et suffisants des schémas fonctionnels classiques montrés dans l'image, ou utiliser la norme BPMN - Il s'adresse aussi bien aux spécialistes techniques qu'aux utilisateurs professionnels.

Flux de fil (lo-fi)

Le flux de fil est une combinaison d'un organigramme et de structures filaires. Wireframe est une esquisse peu détaillée de la conception de l'écran, dont l'accent n'est pas mis sur le composant visuel, mais sur l'emplacement des éléments, la structure et le contenu de l'écran.

Dans le fil de fer, au lieu des éléments de l'organigramme, des dispositions d'écran schématiques sont présentées, avec lesquelles l'utilisateur interagit sur la manière d'atteindre l'objectif. Pas besoin de se concentrer sur les détails visuels et de dessiner chaque bouton et icône. Le plus souvent, l'accent est mis sur les éléments de navigation dans la conception de chaque page individuelle.

Les flux de fils sont particulièrement utiles lors de la création d'écrans mobiles: les tailles relativement petites des écrans mobiles sont facilement utilisées pour remplacer des éléments plus abstraits des organigrammes. Les flux de fils sont confortables pour la formation et le raffinement des spécifications techniques, mais ne conviennent guère à la phase de test.

Un exemple d'un tel schéma:

Flux d'écran (hi-fi)

Nous parlons ici d'écrans élaborés qui sont compréhensibles à la fois pour les utilisateurs et les développeurs. Habituellement, l'accent est mis sur les éléments de navigation et certaines nuances de comportement. Il peut être utilisé comme document réglementaire pour approuver la conception des mises en page.

Le flux d'écran peut essentiellement être appelé un prototype si vous y ajoutez de l'interactivité. Il se caractérise par une grande précision ou une parfaite correspondance des pixels: il prend en compte la taille physique de l'écran et présente tous les détails visuels et typographiques du produit. Les éléments de flux d'écran sont en fait des dispositions d'écran d'une application terminée.

Le client de l'application peut être agréablement surpris par la rapidité du développement lorsque vous lui montrez le déroulement de l'écran, et peut penser que le développement est presque terminé. En règle générale, nous informons le client à l'avance qu'il n'y a pas de code derrière le flux d'écran, mais la présence d'un flux d'écran donne au client une garantie que les UX et UI bien préparés seront suivis d'un code tout aussi parfait.

Exemple de flux d'écran:

Voici un exemple de la façon dont un hybride de diagrammes de flux classiques, d'images schématiques et de dispositions finales pourrait ressembler à l'ensemble.

Comme vous le savez, le plus long est le plus élaboré - le flux d'écran. Il ressemble à une application qui fonctionne et est prêt pour le prototypage interactif, les tests, les nouvelles itérations, l'approbation et le transfert aux développeurs. Il existe de nombreux outils d'automatisation pour la conception des équipes de flux d'utilisateurs, notamment Overflow, Miro, Flowmapp et autres.

Ainsi, le flux d'utilisateurs, couvrant l'ensemble du produit, systématise et structure le processus de sa création, oriente au maximum l'équipe produit vers les besoins de l'utilisateur et leur compréhension commune, vous permet de créer un produit extrêmement compréhensible et intuitif en analysant des scénarios utilisateur. Tout cela non seulement accélère considérablement la vitesse de développement, mais approfondit également l'interaction avec le client. Le flux d'utilisateurs permet à une entreprise informatique de toujours penser aux exigences commerciales du client afin de créer une application plus efficace et plus performante que possible dans le budget et le temps alloués sans utiliser le flux d'utilisateurs.

Flux d'utilisateurs: comment créer des applications et des sites populaires