User flow, User Journey, Quelle est la différence ? Ça sonne pareil, mais ce n'est pas pareil.

User stories & User flows, deux concepts similaires mais bien différents. Leurs objectifs commun: faciliter la conception, la compréhension et la planification d’un produit ou service.

Démêlons ensemble ce sac de nœud, chacun a son rôle à jouer.

User Journey

L’User Journey, aussi appelée customer journey est une série d’étapes détaillant les différentes actions qu’un utilisateur doit effectuer pour utiliser notre produit ou une partie de notre produit. Elle se base sur les personas des utilisateurs types.

L’User Journey prend en compte les éléments environnementaux extérieurs et contextuels à notre produit, par exemple le lieu, l’heure ou une condition d’utilisation comme du temps à tuer dans les transports publics.

Formellement ces recherches se traduiront par une User journey map, une carte chronologique des actions de l’utilisateurs intra et extra produit afin de découvrir les points bloquants du parcours de l’utilisateur.

On cherchera à définir entre autre pour chaque étape de l’utilisateur son état émotionnel, ses aspirations, ses besoins pour découvrir les points de frictions et nos potentielles opportunités.

Les points importants à développer seront:

  • Les actions de l’utilisateur.
  • Ce que pense l’utilisateur.
  • L’état émotionnel de l’utilisateur. Les points de frustrations sont les points les plus intéressants car ils sont sources d’améliorations et d’opportunités.

Grâce au mapping nous avons maintenant une bonne idée des motivations et actions de notre utilisateur cible. Il est temps de rentrer dans les détails de notre produit, it’s User Flow time baby !

User flow

L’user journey et son mapping nous ont permis de définir (ou redéfinir) le chemin de l’utilisateur ainsi que ses besoins et ses désirs. L’User Flow va se charger de découper chaque grande étape en petites actions nécessaires à l’utilisateur pour achever l’étape de la journey.

L’user flow se concentre uniquement sur les actions utilisateurs à l’intérieur de notre produit et se traduit sous la forme d’un flow chart, une carte des chemins empruntables par l’utilisateur dans notre produit pour accomplir son objectif.

Cette méthode aidera grandement à définir quelles informations et actions seront nécessaires sur chaque écran pour que l’utilisateur avance sans friction.

Une fois défini, un user flow est tout naturellement un très bon outil pour nous aider à définir et planifier les features ou modules à développer afin d’obtenir un produit intuitif et agréable à utiliser.

Ce qu’il faut garder en tête:

  • L’objectif du flow. Il faut se focaliser sur une action précise de l’utilisateur afin de rester clair et précis.
  • Le contexte. Comment l’utilisateur entre dans l’application (email, publicité, etc.), l’action principal qu’il veut effectuer, il peut être défini par une User Story map et les personas.
  • Les informations et points d’action. On définira ce que l’utilisateur peut trouver sur chaque écran pour avoir une vision claire des possibilités de notre produit.

En Résumé, l’User Journey et l’User Flow ont des fonctions distinctes mais sont tous les deux des outils très utiles pour comprendre notre utilisateur et notre produit.
Ce sont également d’excellents véhicules pour communiquer et fédérer autour de vos idées en interne comme en externe.

Bonne journey ! 

 

Micro-interactions: Des animations dans nos UI Donnez un petit coeur à notre interface

Que cherchons nous d’une application ou d’une page internet ?

Certes oui, une information ou une fonctionnalité, quelque chose qui va nous faire avancer dans une démarche, mais pour cela, nul grand besoin d’interfaces léchées, quelque chose de simple et fonctionnel devrait suffire.

Et pourtant l’humain est attiré par l’émotionnel, il a besoin d’être captivé, de se sentir en phase avec ce qu’on lui propose. Cela passe par une partie de design statique qui donne le ton, mais on peut aller plus loin et ajouter de l’animation dans ses interfaces c’est ce qu’on appelle les micro-interactions.

Nous allons voir que ces micro-interactions peuvent remplir différentes fonctions mais toutes ont une chose en commun, l’idée de connecter l’utilisateur à son interface.

1. Feedback

Dans le cas du feedback, on utilise l’animation pour confirmer l’action d’un l’utilisateur, un changement d’état ou une évolution.

 

2. Transition / flow

Ici l’animation permet de passer d’une partie de l’interface à une autre et sert de repaire pour l’utilisateur. Il sait d’où il vient et où il est arrivé ce qui simplifie le chemin inverse.

3. Mise en lumière

Dans ce cas, l’animation sert à créer une emphase sur une partie de l’interface. Si l’on veut faire comprendre à notre utilisateur quelles sont ses possibilité ou les actions l’action la plus essentielle à effectuer.

4. Delighters

Cette micro-interaction n’a pour seul but que de créer de l’émotion et une vrai personnalité à notre produit.

 

Il s’agira ainsi de mixer les concepts pour créer une interface intuitive avec de la personnalité.

No spam please !

Bien que les micro-interactions soient délicieusement attractive pour un designer, il faut savoir se ménager et les utiliser à bon escient.

Attention à ne pas fatiguer votre utilisateur. Pensons qu’un utilisateur va probablement revenir sur notre interface plusieurs fois, il va s’habituer à nos animations et va se fatiguer de perdre du temps du temps dessus.

Il faut faire un effort pour garder nos animations:
simples, en allant à l’essentiel, pas de triple rotations ou d’effet de rebond lourdaud sur une icone.
brèves, en général on conseille un maximum de 300 – 400 ms par animation.
pertinentes, il faut toujours se mettre à la place de son utilisateur, se demander si l’interaction ne va pas le freiner au lieu de l’aider.

Pour creuser le sujet et vous inspirer dribbble reste toujours une excellente source.  Je vous conseille également d’aller faire un tour sur littlebigdetails.com qui analyse certain détails de design intéressants trouvés sur les internets, tout n’est pas animé mais le site reste pertinent.

Bonne micro-interactions !

Qu’est ce que l’user onboarding et quid de son expérience utilisateur ? Acceuillir son utilisateur en douceur.

L’user onboarding c’est l’expérience qui permet à l’utilisateur de prendre en main notre produit rapidement. C’est une étape clé qui transforme un simple visiteur en utilisateur.

En bref c’est comme un premier rendez-vous et voici quelques conseils de coach en sédUXtion pour que tout se passe bien et que l’utilisateur revienne.

Les objectifs de l’Onboarding

Faire faire à l’utilisateur la chose la plus importante que nous voudrions qu’il fasse.

Autant que possible, il ne faut pas faire de détours cela risque d’égarer l’utilisateur.  Il faut aller droit au but, à l’action la plus essentielle.

Une des premières chose que vous fait faire twitter est de nous faire suivre d’autres comptes.

Donner conscience à l’utilisateur des bénéfices à tirer de votre service.

Transformer un visiteur curieux en utilisateur ne peut se faire sans lui donner envie de revenir. Pour ce faire il faut :
– Que notre service comble un besoin du visiteur.
– Lui faire comprendre les bénéfices qu’il tirera de notre produit.

On apprend mieux quand on sait pourquoi on apprend.  

Faciliter l’appréhension de principes nouveaux pour l’utilisateur.

Pas besoin de faire perdre son temps à l’utilisateur en lui expliquant étape par étape comment fonctionne un site e-commerce classique, par contre il sera important de prendre plus de temps pour faire comprendre comment marche un principe de fonctionnement propre à notre service.

UX de l’onboarding

Pour créer une bonne expérience d’onboarding, on peut ainsi traduire les objectifs de l’onboarding en terme de conception et d’expérience utilisateur assez facilement.

Réduire les frictions au minimum. 

Il faut faire très attention à ne pas décourager le visiteur avec un onboarding trop on-boring (ahah) ! Pour cela, il faut :
– Identifier l’action principale à accomplir et se concentrer dessus.
– Créer du lien avec le visiteur, le mettre à l’aise.
– Plus le processus est long, plus il est important de rappeler au visiteur qu’il a presque fini.

Ajouter des éléments de gamification peuvent aider à faciliter l’expérience utilisateur.

Être concis et ne pas faire perdre de temps à l’utilisateur.

Il est très difficile de garder un visiteur intéressé quand notre onboarding est trop long ou trop laborieux. Veillons donc à :
– Réduire les premiers réglages (settings) à l’essentiel.
– Minimiser le nombre d’étapes obligatoires.
– Faire tester le service le plus rapidement possible.

On apprend mieux au travers d’une expérience.

Ne négliger aucune partie de l’expérience

La première expérience d’un utilisateur ne se limite pas à notre site, elle est bien plus globale. Veillons donc à ne pas négliger l’experience de l’app store ni celui des emails ou des publicités.

Être attentif aux mots employés 

Les wordings que nous utilisons seront primordiaux pour une bonne expérience d’onboarding, n’hésitez pas à en tester plusieurs. Il faut essayer de se rapprocher dans le ton au maximum de son audience et des valeurs que nous souhaitons communiquer.

Le wording des Call to action et des titres sont particulièrement déterminants.

Apprendre et améliorer son Onboarding

Notre expérience ne sera probablement pas parfaite du premier coup, pas de problème, c’est normal ! L’important est d’itérer et de tester différentes approches. Nous pouvons avoir recours à des A/B tests pour optimiser au maximum l’activation, la conversion ou la rétention.

Gardons en tête qu’il est important de choisir les bonnes données à mesurer lors des tests. On n’effectuera pas les mêmes tests si l’on cherche à vendre un programme ou à créer un nouveau reseaux social.

Il existe différentes méthodes d’onboarding

La landing page

La landing page est notre premier outil de conversion, elle présente en priorité le produit et son bénéfice pour le visiteur.

Une fois le produit établi, on peut rentrer dans les détails pour les curieux.

Détail intéressant chez fred de la compta, une partie de la page est interactive et invite très intuitivement le visiteur à estimer sa comptabilité. Cela introduit rapidement et concrètement les bénéfices du service au visiteur.

Le slider

Sans rentrer dans des tutoriels techniques, l’application evernote nous donne rapidement une bonne idée des possibilités d’utilisation du produit et des problèmes qu’elle résout.

La vidéo (Freehand by Invision)

La vidéo permet de distiller rapidement une grosse quantité d’information en peu de temps. Le visiteur a ainsi une bonne vue d’ensemble d’un produit, attention à ne pas le perdre en allant trop vite.

Le tour interactif

Shepherd est à la fois un outil et un bon exemple de tour interactif. Lors de l’arrivée, chaque élément important est mis en valeur et expliqué.

On peut quitter le tutoriel à n’importe quel moment en un clic pour accéder à l’ensemble de la page.

 

Le setup

Étape classique dans l’inscription à un service, le setup est une demande des informations essentielles à fournir par un visiteur. Il faut essayer de rester succinct pour ne pas décourager le visiteur.

On retrouve souvent dans ces informations: le nom, l’email et si le service est payant une méthode de paiement.

Espace démo ou l’avant gout

Duolinguo met l’accent sur la facilité d’expérience en nous faisant tester directement leur système d’apprentissage très simple et très instinctif.

L’expérience se termine par une première récompense et laisse entrevoir la marge de progression puis invite à créer son profil pour continuer l’expérience

Continue onboarding, continuer à créer de l’engagement.

Une fois le visiteur transformé en utilisateur, l’onboarding peut continuer afin de le pousser plus loin dans la découverte du produit ou dans l’ajout d’informations qui enrichiraient son profil et faciliteraient l’expérience de l’utilisateur.

La homepage de malt est bourrée d’incitations, sous différentes formes, à améliorer son profil et ce pour rendre attractifs les freelancers, les aider à trouver des contrats et ainsi leur donner envie de revenir.

Tout service a besoin d’une expérience d’onboarding mais beaucoup vont différer dans leur pédagogie. On pourra mixer les méthodes afin de créer le cocktail UX parfait pour votre utilisateur.

Si vous avez encore besoin d’inspiration, je vous conseille de visiter Useronboard.com où Samuel Hulick décortique en détail différents onboardings (Paypal, united airline, dropbox et bien d’autres grands specimen de la faune internet!! ).

Bienvenue à bord !

 

Qu’est ce que le développement Agile et la méthode Scrum ? On se concerte, on s'adapte et on développe !

La très fameuse méthode Agile permet de diviser et répartir efficacement les tâches à accomplir lors du développement d’un important projet.

Elle permet également comme son nom l’indique de rester agile, c’est à dire d’adapter la charge de travails et les priorités aux contraintes techniques et délais de livraison.

C’est un procédé très utile dans le développement web et d’applications car contrairement à un projet physique comme la création d’un immeuble par exemple, il est très facile, une fois le produit livré d’ajouter des briques ou d’en enlever d’autre moins fonctionnelles.

En bref le produit numérique est malléable dans le temps, la méthode agile permet de d’exploiter pleinement cette malléabilité.

Oui mais Jamie, c’est bien beau tout ça, mais comment ça marche concrètement ?

Avant de commencer l’explication, commençons par définir les différents parties prenantes aussi appelé stakeholders.

Le Product Owner, C’est la personne en charge de la définition du produit final et de ses fonctionnalités. C’est lui qui choisi, en accord avec le client, les dates de livraison et les contenus livrés. Il lui incombe la charge de définir les tâches et leurs priorités. En fin de sprint, il valide le travail effectué.
Il a la responsabilité du retour sur investissement, c’est lui qui représente les intérêts du client.

Le Scrum Master, il est en charge du management du projet, de son bon déroulé et s’assure de l’application des pratiques et valeurs du Scrum. Pour ce faire il doit s’assurer que les équipes sont fonctionnelles à 100% et qu’elles disposent de tout ce dont elles ont besoin pour travailler.
En cas de problème, il doit éliminer les points bloquants et dégager la route aux équipes pour qu’ils puissent continuer leur sprint. Il agit comme facilitateur au sein de son équipe.

L’équipe / Les équipes, englobent toute autre partie prenante qui sera coordonnée afin de développer le produit, cela peut inclure des développeurs  mais également des designers, des data analysts, etc. selon les besoin du projet.
Chaque membre de l’équipe est au même niveau hiérarchique.

C’est bon ? La team est en place, allez hop ! On passe à la méthode !

Le développement agile découpe la création d’un produit en plusieurs sprint.

Un sprint est défini par deux choses:
Sa durée dans le temps, elle peut être définie entre 1 et 4 semaines mais doit être consistante, si on choisi 2 semaines, on doit s’y tenir jusqu’à la fin du développement.
Son objectif, chaque sprint doit aboutir à un délivrable, la mise en place d’une news letter, la création d’un module de réservation, en bref, quelque chose de concret qui peut être soumis au feedback du client.

Chaque sprint est divisé en tâches à compléter par les stakeholders.

Le Product Backlog

Le produit déjà divisé en user stories est découpé par le product owner en une liste de tâches à effectuer, un chat nécessite entre autre une manière de s’inscrire en tant qu’utilisateur, la mise en place backend, un design.

Chaque uses stories est constitué d’une une multitude de tâches:

Une fois les tâches définies, le product owner prioritise les tâches. L’ordre de priorité et la liste de tâches peut et va évoluer tout au long du développement.

Le Sprint Backlog

À partir du product backlog, l’équipe va choisir les tâches qu’elle choisit d’accomplir durant un sprint.  L’équipe peut suivre la prioritisation du product owner mais également choisir d’autres tâches moins importantes, il y a plusieurs raison à cela.
– Le sprint backlog doit suivre une logique de délivrabilité pour pouvoir périodiquement solliciter les feedbacks du client et rectifier le tir au prochain sprint si besoin.
Par exemple la mise en place d’une newsletter nécessite la création d’une base de donné (high prio), d’un bouton de souscription sur le site (high prio) et de l’adaptation de la charte graphique à la news letter (low prio).
– Les membres de l’équipe peuvent se concentrer sur une grosse tâche longue et remplir la fin de leur agenda avec de plus petits items.
– Certaine tâches sont dépendantes du développement d’autre tâches du backlog.

Le Sprint

Durant le sprint, chaque développeur travaille sur les tâches qu’il a choisit d’accomplir.

Chaque journée du sprint commence par un scrum (une mêlée), c’est une réunion rapide, on ne s’assoit pas, on reste debout et chacun discute avec l’équipe en 5-10 min de 3 choses:
– Qu’a-t-on fait la veille ?
– Quels furent les problèmes rencontrés ?
– Que va-t-on faire aujourd’hui ?

Ainsi toute l’équipe sait où elle en est au jour le jour et sait si elle respecte ses objectifs.

La fin d’un sprint doit se solder par la livraison d’un produit, d’une feature ou  d’une partie du produit que le product owner peut montrer au client afin de recevoir ses feedbacks pour la suite du développement et pour rester transparent.

 

La Sprint Review

Enfin la fin d’un sprint se conclut par une réunion faisant le point sur le déroulement du sprint, ce qui a bien marché et ce qui a moins bien marché.
Le but n’est pas de juger mais de rester dans un esprit d’amélioration de l’équipe au globale mais également au niveau individuel afin d’être plus efficace au prochain sprint.

Pour poursuivre votre quête d’agilité je vous invite à quitter un instant la technique pour rejoindre le philosophique en lisant cet article du blog qualitystreet.fr qui énumère les valeurs derrière le développement agile car je suis convaincu qu’on fait toujours mieux les choses quand on sait pour quoi on les fait.

Bon sprint !

La Méthode Feynman Comment apprendre rapidement et efficacement.

Il allait de soit de commencer mon premier article par la méthode d’apprentissage Feynman. C’est après tout l’une des raisons pour laquelle j’ai créer ce blog.

Richard « The great explainer » Feynman est un éminent physicien de son époque (1918 – 1988). Le personnage est en lui-même assez extraordinaire et je vous conseille ce documentaire The fantastic Mr. Feynman (en anglais) pour en apprendre d’avantage sur sa vie.
Ses principaux faits d’armes: Il fit partie de l’équipe qui développa la bombe atomique et, à titre plus individuel, il remporta le prix Nobel de physique en 1965 pour ses travaux sur l’électrodynamique quantique.

Feynman était également un très grand pédagogue doublé d’un vulgarisateur hors pair. Il fut l’auteur de sa propre méthode d’apprentissage: la Méthode Feynman.

Cette méthode part du principe que la meilleure façon d’apprendre un savoir, c’est de s’entrainer à l’enseigner.

La méthode

Étape 1 : Choisir le sujet de son choix et lire à son propos. (Jusque là, c’est la base)

Étape 2 : Écrire ce que l’on sait sur le sujet à la manière d’un cours comme si on était l’enseignant d’une classe qui découvrait pour la première fois ce sujet. On peut également réciter à haute voix ce que l’on est en train d’écrire comme si l’on parlait à sa classe.

Étape 3 : Repérer les manques, les omissions, les approximations, bref, les trous dans votre discours. Ce que l’on n’arrive pas à expliquer n’est pas compris.

Étape 4 : Les trous dans notre apprentissage étant clairement définis, on peut repartir à l’étape 1 et les combler.

Quand tout les trous sont comblés, Bravo ! Vous connaissez votre sujet sur le bout des doigts et vous serez capable de le vulgariser et de l’expliquer à n’importe qui !

Je m’efforcerai d’appliquer cette méthode tout au long de la vie de ce blog en touchant à des sujets qui m’intéresse et en espérant vous intéresser!

Being a digital Feynman L'importance du partage et de faire résonner sa voie

Ça y est !

Après deux ans d’hésitation, je passe le cap et je me décide de lancer mon blog, Snack for Thought.

J’ai découvert il y a déjà quelque temps la Méthode Feynman qui a pour principe que pour apprendre totalement un concept, il faut être capable de l’enseigner.

Ma ligne éditoriale se regroupera autour de mes principaux centres d’intérêt: entrepreneurship, technologie, design, self improvement, méthodes de travails, concepts philosophique.

Cet exercice à pour premier objectif de me pousser à ne faire aucune concession dans mon propre apprentissage afin de restituer un savoir le plus limpide possible. Un apprentissage partiel ne permettant évidement qu’une transmission partiel de connaissance.

Deuxième objectif, faire partie des communautés qui me passionnent et avoir une voie pour échanger avec leurs membres.

Troisième objectif, m’astreindre à une forme de rigueur, c’est pour l’instant le point qui m’a empêcher de de commencer, la procrastination est une force redoutable !

Le principe de Snack for Thought consistera principalement à résumer de façon concise des concepts pour une lecture (et écriture 😀 ) rapide.

Bonne lecture !