flupa 2011 - tri de cartes : mise en pratique par eric mazzone et gautier barrère

Ne perdez plus vos internautes : faites du “Card sorting”

Eric Mazzone – Gautier Barrère

Introduction

•  Qui sommes-nous ?

•  Pourquoi sommes-nous là ?

2 Petit déj' de l'ergonomie FLUPA

Plan de la présentation

1.  Card sorting ? 2.  Contexte initial 3.  Choisir (et recruter) les utilisateurs 4.  Le contenu / les cartes 5.  Plan de test 6.  Organiser la séance 7.  Préparer le matériel 8.  Déroulement du tri 9.  Résultats et analyse 10. Solutions proposées


1. Card sorting ?

•  Définition •  Objectif •  Principe


1. Card sorting ?

•  Types de tri : –  Ouvert –  Fermé –  In situ –  A distance


2. Contexte initial

•  Analysez le quoi et pas le comment !

•  Vos objectifs ? •  Votre cœur de cible ?

•  « On veut un test utilisateur ! » –  « Euh il vous faut un tri de cartes »


2. Contexte initial

•  Mettre en place un protocole de tri de cartes –  Démarche scientifique –  Hypothèses –  Métriques ? / Analyse visée ? / Quantitatif ou qualitatif ? –  Tri de carte ouvert / fermé / à distance / in situ / nombre d’étapes ?

Petit déj' de l'ergonomie FLUPA 8 8

2. Contexte initial

Les bases pour l’évaluation

•  Evaluateur : pas impliqué dans la conception

•  Représentativité : –  Utilisateurs –  Tâches



1.  Card sorting ? 2.  Contexte initial 3.  Choisir (et recruter) les utilisateurs 4.  Plan de test 5.  Le contenu / les cartes 6.  Organiser la séance 7.  Préparer le matériel 8.  Déroulement du tri 9.  Résultats et analyse 10. Solutions proposées


3. Choisir les utilisateurs

L’utilisateur = diversité



L’utilisateur = diversité



•  Découle des besoins

•  Personas ?

•  Nombre d’utilisateurs ?



Un collègue :

« Oui moi je suis aussi un utilisateur du web, en plus j’ai de l’expérience en XHTML »…



Le patron :

« Mais voyons, je connais du monde, prenez ma mère tiens ! »…



Exemple : projet www.gouvernement.lu

•  Grand public

•  « Cible avertie » : –  Fonctionnaires –  Ambassadeurs –  Journalistes (Presse)


On ne remet pas en cause les profils utilisateurs sur base du coût de recrutement…



Exemple : projet Dotclear

•  Grand public

•  Trois variables : •  Niveau d’expérience •  Attentes •  Niveau de droits


Exemple : site Paris Web 2010

•  A distance : –  60 participants

•  Sur place : –  6 groupes

•  Uniquement des personnes inscrites à la conférence Paris Web 2010

•  Les personnes avaient déjà visité le site Paris Web 2010


4. Le contenu / les cartes

•  En moyenne 50 – 60 cartes



•  Trop de cartes ?

•  Sur beaucoup de projets, arbo de 5 niveaux : –  On considère les niveaux « n », « n-1 » et « n-2 »

•  Prioritisation du niveau « n » si possible •  Fonction « random » au niveau « n-1 » et « n-2 »



Pensez à procéder par étape



•  Contenu adapté : –  Objectifs du site –  Tâches utilisateurs

•  Compréhensibles •  Même niveau dans l’arborescence •  Testables :

–  Organigramme ? –  Une fonctionnalité ?


Ne guidez pas l’utilisateur dans les intitulés


•  Granularité des contenus de cartes


Les gouvernements de 1848 à nos jours

Dir Dammen an Dir Hären, Den Nationalfeierdag ass all Joer anescht. Kuerz virum Krich an an deene schlëmme Joren am Krich hu mer en a gedréckter Stëmmung gefeiert

Adoptez une même granularité pour les contenus !

5. Plan de test

•  Exemple : projet Dotclear

Novices Tri ouvert Etape 1 Etape 2 Tri fermé Etape 1 Etape 2

Experts Tri ouvert Etape 1 Etape 2 Tri fermé Etape 1 Etape 2

•  Minimum 80 utilisateurs exigés !


6. Organiser la séance

•  Nombre d’utilisateurs : –  In situ : entre 5 et 8 par séances –  A distance : pas de limite

•  Durée des séances

•  Respectez le protocole à chaque séance

In situ : Prévoir 2 personnes lors des séances (l’animateur se consacre intégralement aux participants)


7. Préparer le matériel – Vive le Green IT

•  Consignes

•  Matériel (in situ) : –  Cartes :

•  Recyclez votre matériel de bureau –  Post-it –  Élastiques –  Stylos –  Table assez grande (sans rire…)


Prévoir des cartes vierges (pour laisser la possibilité de dupliquer des contenus)

7. Préparer le matériel

Quelques outils :

•  Websort (www.websort.net) •  Optimalsort (www.optimalworkshop.com/) •  Opensort •  Xsort - MacOS (www.xsortapp.com/) •  Cardzort (www.cardzort.com) •  uzCardSort (uzilla.mozdev.org/cardsort.html)


8. Déroulement du tri

•  Phase 1 : Accueil et consignes

•  Phase 2 : Regrouper

•  Phase 3 : Nommer

•  Phase 4 : Debriefing


Phase 1 : Accueil et consignes

•  Mettez les gens en condition

•  Expliquez l’objectif pour obtenir ce que vous souhaitez, mais sans en dire trop pour ne pas biaiser les résultats : –  Objectif global du site –  Contenus des cartes

•  « Faites des regroupements qui ont du sens pour VOUS »


Méfiez-vous de vous-même !

Phase 2 : Regrouper


Tout trier avant de nommer

Phase 3 : Nommer


Phase 4 : Debriefing

•  A la fin du tri, expliquez la finalité du tri aux participants

•  Minimisez le travail de saisie par après : –  Une personne pour diriger, une personne pour noter –  Intégrez les résultats directement dans le logiciel pour gagner du temps


Mise en pratique en groupe dans la salle

•  Phase 1 : Accueil et consignes

•  Phase 2 : Regrouper (20 minutes)

•  Phase 3 : Nommer (10 minutes)

•  Phase 4 : Debriefing


Mise en pratique en ligne

•  Un volontaire ?


9. Résultats et analyse

Données brutes

•  Données brutes = illisibles •  Analyse experte indispensable •  Consolidez les données



Analyse

•  Deux alternatives : –  Qualitatif versus quantitatif ? –  Analyse statistique –  Analyse exploratoire

•  « On fait quoi chef ? » –  « On combine »

•  « Dans quel ordre ? » –  « Ca suffit ces questions oui ? »


Analysez sans le client !


Analyse statistique : matrices de co-occurences


http://websort.net/manager/


Analyse statistique : les Dendogrammes ... « Les quoi ? »


Cartes Résultats

N° Intitulé Experts Novices 1 Dossiers dans lesquels on peut

classer des textes/articles/billets OK OK

88% 85%

17% - Billets 15% - Billets 10% - Pages

Actions à entreprendre RAS 2 Catégories Dotclear contenant tous

les textes/articles/billets relatifs à Dotclear

OK OK

75% 70%

12% - Autre 10% - Billets

10% - Tags

Actions à entreprendre RAS Analyse globale et 1ères recommandations

Pas de grand problème pour cette rubrique

Lorsque l’utilisateur crée un billet, mettre clairement en avant la possibilité de lui assigner une catégorie

Mettre en évidence la culture blog pour les novices (billets / commentaires / catégories / tags / pages)

Lorsque l’utilisateur crée un billet, mettre clairement en avant la possibilité de lui assigner une catégorie

Mettre en évidence la culture blog pour les novices 51 Petit déj' de l'ergonomie FLUPA


Analyse exploratoire

•  Qualitatif •  Démarche / Approche / Logique de classement •  Déduction de nouvelles hypothèses

•  In situ : –  Lors du debriefing (gros avantage de l’in situ)

•  A distance : –  Check personne par personne –  Regarder les personnes qui se détachent de la tendance


Tirez profit des commentaires des utilisateurs


•  Analyse « Tri ouvert » : bienvenue aux portes ouvertes


Exemple : Site Paris Web 2010 •  Tri ouvert : analyse des titres de regroupements

Actualités

Annonces News

Actualités orateurs

Association PW

A propos de PW

Les fondateurs

Equipe PW

Editions précédentes

Archives

Goodies

Boutique




Exemple : Tri de cartes sur les vin

•  Novices – Généraliste –  Par couleurs –  Plus grossier (« bulles », « sucré ») –  Moins de rubriques (une 20aine au total)

•  Experts - Précis et détaillé –  Par région (alors qu’elles n’étaient pas indiquées) –  Par cépage –  Par domaine –  Par plat culinaire –  Plus de rubriques (une 40aine au total)


10. Solutions proposées

•  On décèle : –  Catégorie ou contenu mal intitulés –  Contenu pas à la bonne place –  Besoin d’une nouvelle catégorie –  Besoin de liens réciproques –  Différences selon les profils … ou pas

•  Le tri permet parfois d’identifier : –  Un contenu inutile –  Un contenu manquant

Mais ce n’est pas son objectif premier !


Le client est nécessaire ! (besoins orga, marketing etc.)


•  N’oubliez pas les fondamentaux : –  Approche thématique :

•  Pas organisationnelle –  Largeur versus profondeur –  Arborescence régulière –  Une page est présente à un seul endroit :

•  Faites ensuite des liens transversaux –  Etc.




Utilisez des visuels (p.ex. cartographie) pour communiquer


Exemple : Site Paris Web 2010


Dotclear Avant Après

Blog Mon blog - Billets (+ Nouveau billet) - Catégories - Tags - Médiathèque (comportera un lien vers la sauvegarde de la médiathèque) - Commentaires (comportera un lien vers la gestion des spams et le paramétrage de l'antispam) - Pages - Liens / Blogroll - Paramètres du blog (comportera chemins des thèmes et de la médiathèque) - Apparence du blog (comportera un lien vers l'installation de thèmes)

Système Réglages système - Gestion des blogs (id + Import ; comportera un lien vers Sauvegarde) - Gestion des utilisateurs - Gestion des langues - Maintenance (id + Mise à jour de Dotclear ; comportera un lien vers l'antispam et vers Gestion des modules) - Sauvegarde (Export du blog - Export de tous les blogs - Export de la médiathèque)

Extensions Modules complémentaires - Gestion des modules (Installation - Suppression - Mise à jour ; comportera un lien vers Maintenance) - Plugin 1 (Activation - Paramétrages) - Plugin 2


Exemple : projet Dotclear


On est jamais sûr de rien…

•  Sans impliquer les utilisateurs !


Merci de votre attention !

Des questions ?

Eric Mazzone – Gautier Barrère

www.gargarismes-ergonomiques.com La qualité aussi simple qu’un bain de bouche

www.ergo-stretto.com Le condensé des nouvelles tendances de l’ergonomie

flupa 2011 - tri de cartes : mise en pratique par eric mazzone et gautier barrère

Technology