Glossaire UX : site flow, user flow, task flow, wireflow, ix flow ?

Gloassira UX : site flow, flow chart, user flow, task flow, wireflow, ix-ui flow

En Ux Design il y a une longue liste de livrables avec des termes qui évoluent et se chevauchent souvent et parfois sont confondus même par les professionnels de l’Ux. Je vais essayer de les redéfinir pour nous aider à mieux les comprendre.

Site Flow : C’est un site map enrichi visuellement qui illustre l’apparence générale de chaque page et qui indique certaines micro-intéractions. Bien entendu, comme le Site Map, le Site Flow nous donne une image globale de la hiérarchie du site, de la densité et profondeur de la navigation.

Image montrant exemple de Site Flow

Exemple d’un Site Flow

Flow Chart – Task Flow : Diagramme utilisé depuis longtemps pour les processus et flux de tâches de tous les utilisateurs. Il permet de comprendre le parcours commun et les actions identiques d’un utilisateur dans l’interface. Ce type de schéma reste cependant limité pour l’UX car il est linéaire et ignore le contexte utilisateur.

image montrant un exemple de Chart Flows/Task Flows

Exemple de Chart Flows/Task Flows

User Flow : C’est un chemin à parcourir et des actions à mener par un utilisateur à travers une application. Le parcours n’est pas juste linéaire, il peut emprunter des détours à travers l’itinéraire. Ce type de parcours permet d’optimiser l’expérience et les trajets clés utilisateurs. L’User Flow se distingue du Task Flow principalement du fait que différents utilisateurs peuvent effectuer différentes tâches ou se déplacer sur des chemins différents. Les flux d’utilisateurs sont généralement attachés à un personnage et / ou à un point d’entrée spécifique.

Image montrant un exemple de User Flow

Exemple d’un user Flow

Wireflow : Terme récemment inventé par NNgroup, c’est une combinaison hybride du flowchart et du wireframe.  Cette nouvelle approche combine la disposition du contenu des wireframes avec les interactions des organigrammes. Le Wireflow est optimisé pour déployer une tâche à accomplir par l’utilisateur et des chemins alternatifs éventuels.  Cette compréhension des différents scénarios d’utilisateurs possibles permet une expérience mieux conçue.
Pour en savoir plus sur les Wireflows, lire l’article Page Laubheimer sur NNgroup

image montrant un exemple de WireFlow Low Fidelity

Exemple de WireFlow Low Fidelity

IX/UI Flow : Flux d’interaction spécifique pour expliquer au développeur le comportement de l’utilisateur face à l’interface pensée par l’UX Designer. L’IX Flow c’est un wireflow en plus rigoureux qui définie et décompose toutes les micro-interactions (déclencheurs, règles, feedback, boucles, modes). D’après Havana Nguyen, l’IX Flow permet de mieux communiquer avec la technique car  il précise tous les points d’entrée dans chaque page et explique comment ces derniers facilitent les objectifs de l’utilisateur. Toujours d’après son article, ils décrivent mieux  la relation ou du flux entre les pages que le wireflow.
Pour en savoir plus sur IX Flow, lire l’article de Havana Nguyen :

Image montrant un exemple IX Flow exhaustif

Exemple d’un IX Flow exhaustif

Laisser un commentaire