Post on 22-Mar-2017
Présentation donnée lors du Flex Camp du 23 mars 2010
Intégrer l’expérience utilisateur pour la conception Flex avec l’ergonomie
Tontons Flexeurs
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
Ergonomie ?
Utilisateur DéveloppeurEtre humain
Définition ergonomie
Population cible :
• Seniors/ juniors
• Professionnels/ privé
• Experts/ novices
• …
Définition ergonomie
Dans quel contexte ?
Le contexte dans lequel se trouve l’utilisateur va influencer la manière dont il utilise l’application.
De quelle façon ?
Votre application n’est pas forcément utilisée de la manière dont vous l’avez prévu
Championnat du monde de lancer de portables (Finlande, 2007)
Votre application n’est pas forcément utilisée de la manière dont vous l’avez prévu
Quel utilisateur?
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
Jeune entreprise innovante
Présentation de RTC
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
2007 : tests utilisateurs + enquête utilisateurs (42 participants)
Nike IDDashboard Editions la MartinièreHome LocatorFlexstorePhoto ViewerPikeo
Pôle recherche : études Flex
Etude 2007Usages %
Recherches d’informations 86E-Mail 76
E-learning 7Musique 3
Achats 55Messagerie instantanée 31Services (bancaires, administratifs) 17Jeux en réseaux 14
Blog 3
Âge %
- 35 ans 57+ 35 ans 43
Expertise %Novices 50Expérimentés 50
Enquête utilisateurs (30 participants)Vino TintoDashboardNike IDPicnikPhotoshop
Sexe %Hommes 44Femmes 56
Enquête 2010Usages %Recherches d’informations 94
Achats 59E-Mail 27
Réseaux sociaux (Type Facebook) 27
Vidéo 15
Musique 12
Jeux en réseaux 3
Âge %- 37 ans 47+ 37 ans 53
Pôle recherche : études Flex
Qu’est-ce qu’une étude utilisateurs en Ergonomie?Choix d’un ensemble d’utilisateursChoix d’une application à étudierDemande aux utilisateurs de réaliser des tâchesObservation et analyse du comportement des utilisateurs
BUT:Vous donner des clefs pour concevoir des applications répondant aux besoins de vos utilisateurs finaux.
Etude utilisateurs
Etude utilisateurs
Exemple :Utilisateurs pratiquant peu et régulièrement internetSite : La MartinièreRecherche ISBNRetours des utilisateurs :
Novices : 33% pas facileExpérimentés : 83% très facile
Système de recherche pas compris :Par 50% des Expérimentés Par 16% des Novices
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
Critères de Bastien et Scapin
Critères ergonomiques
8 critères17 sous-critères
Prédire le comportement de vos utilisateursCritères issus de près de 1000 recommandations et de centaines de tests utilisateursTravail de recherche depuis 1992
Intuition suffisante ? Diversité humaine = diversité de comportements.
Critères de Bastien et Scapin
Critères ergonomiques
GuidageCharge de travailContrôle expliciteAdaptabilitéGestion des erreursHomogénéité / CohérenceSignifiance des codes et dénominationsCompatibilité
http://www.ergoweb.ca/criteres.html
http://www.ergoweb.ca/criteres.html
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
Dashboard
Dashboard
Manipulation de données : Dashboard Adobe
http://examples.adobe.com/flex2/inproduct/sdk/dashboard/dashboard.html
http://examples.adobe.com/flex3/devnet/dashboard/main.html
Dashboard Flex 2
Dashboard Flex 3
Evolution de la présentation des informations
Dashboard
Contexte : Dashboard (Flex 2)Etude 2007 Très pratique : 67 % (interaction entre graphiques)
Premières impressions
- de 35 ans %
+ 35 ans %
Nouveau, inattendu
59 85
Inutile 35 15
Interaction 23 15
Mieux qu’Excel 0 38Types de commentaires - de 35
ans %+ 35 ans
%
Possibilité pas visible 23 46
Icône pas compréhensible 6 15
Accès facile aux données à partir de la même page
70 61
Icône claire/visible 6 15
Lenteur d’affichage de la bulle 29 38
Comment revenir à la situation de départ ?
12 0
Utile 0 54
Evolution de la présentation des informations
Dashboard
Contexte : Dashboard (Flex 3)Etude 2010
L’interaction entre les graphiques :Est vue plus facilement par les moins de 37 ans (73%) que par les plus de 37 ans (53%)Plus de 37 ans : 63 % (assez/très pratique)Si elle n’est pas intuitive pour ce groupe d’âge, cette fonctionnalité est très appréciée pour ses possibilités.
Premières impressions - de 37 ans %
+ de 37 ans %
Difficile à comprendre 40 35
bien fait, agréable, ludique 33 71
Pas agréable 7 12
Légendes incomplètes 7 0
Difficile de retrouver les fenêtres fermées 0 6
Dashboard
Redimensionner les fenêtres
Contexte : DashboardEtude 2007 / 2010 : (%)
2010
2007
RecommandationPouvoir redimensionner chaque fenêtre de la largeur désirée
2007 2010Vu 53
47
69
Pas Vu 31
Echelle 2007 2010Pas pratique 3
Peu pratique 7 3
Assez pratique 33 25
57
3
Très pratique 69
Graphiques
Dashboard
Contexte : DashboardEtude 2010 :
Histogramme : 53% des plus de 37 ansCamembert : 33% des moins de 37 ans
Recommandations :Pour des utilisateurs de plus de 37 ans, privilégier l’histogrammePour des utilisateurs de moins de 37 ans, privilégier le camembertUtiliser le graphique adapté pour présenter les données
Graphique préféré 2007 2010
courbe 27
67
7
7
34
camembert 13
histogramme 22
Dépend des données 31
Infobulles
Dashboard
Contexte : DashboardEtude 2007 : uniquement informativeEtude 2010 : double fonction comprise
Assez pratique : 22%Très pratique : 78 %
Commentaires :Infobulles particulièrement appréciées par les plus de 37 ans à qui elle permet une meilleure lisibilité.
Dashboard
Déplacer les fenêtres
Contexte : DashboardEtude 2010 :
Fonction pas vue : 63%Mais très appréciée : 88 % (assez / très pratique),
Moins de 37 ans : composant ludique, innovantPlus de 37 ans : apprécient la personnalisation
Recommandations :Indiquer, par un repère visuel, la possibilité déplacer les fenêtresPermettre de mémoriser le nouvel arrangement si on quitte le sitePouvoir déplacer une fenêtre à un endroit vide
Double Glissière (slider)
Dashboard
Contexte : manipulation de donnéesEtude 2007 :
Assez pratique : 40%Très pratique : 50 %L’utilisation de la double glissière pour sélectionner une période de temps est très pertinent dans le cadre étudié
Recommandations :Graduer la glissière
E-Commerce
E-Commerce
E-commerce ; Flexstore et Vino Tinto
http://www.vinotinto.fr/#/fr/page/1/vente-vins-du-monde-club-degustation
http://examples.adobe.com/flex2/inproduct/sdk/flexstore/flexstore.html
Flexstore
Vino Tinto
Contexte : Flexstore / Vino TintoEtude 2007 / 2010 : (%)
Effets cinématiques
E-Commerce
Commentaires :Les participants quelque soit l’âge estiment que ce que propose le site est « nouveau ». En revanche, les plus de 35 ans estiment cet effet inutile alors que les moins de 35 ans se posent la question technique de savoir si l’effet sera aussi rapide avec une connexion bas débit.Contrairement à 2007, cet effet est rentré dans les habitudes et n’est plus évalué comme surprenant
Echelle 2007 2010
Pas pratique 0
3
27
70
0
Peu pratique 9
Assez pratique 31
Très pratique 59
Contexte : Flexstore / Vino Tinto Etude 2007 / 2010 : (%)
Glissières (Slider)
E-Commerce
Echelle 2007 2010
Pas pratique 13
3
23
57
41
Peu pratique 31
Assez pratique 13
Très pratique 16
Recommandations :Privilégier l’emploi de la double glissière pour les sites de manipulation de données plus que de e-commerceMettre des graduations intermédiairesFaire fonctionner toutes les doubles-glissières de la même manière
Flexstore
Vino TInto
Contexte : Flexstore / Vino TintoEtude 2007 :
70% des participants l’estiment très pratique« Habituel » :
- de 35 ans : 6%+ de 35 ans : 38 %
Etude 2010 :12% des participants de plus de 37 ans essaient d’abord le glisser déposer avant de cliquer sur le bouton « ajouter ».
Glisser déposer
E-Commerce
Vino TInto
Flexstore
Contexte : Flexstore / Vino TintoEtude 2007 :
Pas vu : 94%Assez / très pratique : 60 %
Etude 2010 : (%)
Gestion de l’espace
E-Commerce
Vino TInto
Flexstore
Compris - de 37 ans + de 37 ans
Oui 100 64
Non 0 36
Commentaire :Composant bien apprécié mais qui reste, en 2010, assez peu connu avec une utilisation peu intuitive.
Sommaire
Introduction Définition de l’ergonomiePrésentation de RT ConsultantsEtudes Flex
Les critères ergonomiques
Présentation des études Flex (Extrait)
Conclusion
Conclusion
La navigation n’est pas le but principal de l’utilisateur. Ainsi, pour les sites en HTML, le système de navigation doit occuper un espace restreint (ne pas multiplier les zones de navigation). Cependant, Flex offre des fonctionnalités nouvelles, qui vont attirer l’utilisateur si celles-ci sont implémentées de manière à respecter une certaine logique d’utilisation.
Navigation
Agencement des écransL’avancée des sites en Flex est de proposer un ensemble de rubriques, habituellement diviséen plusieurs pages, sur une même page. Cependant, pour ne pas « forcer » les internautes àchanger de stratégie ; il vous faut mettre en place un guidage fort.
Les possibilités offertes par la technologie Flex sont plutôt appréciées par les participants quelque soit leur profil :
L’organisation des informations sur une même page est un plus,La gestion de l’espace est plutôt bien comprise,La présentation des informations est appréciée :
La possibilité de visualiser une information principale et son détail sur la même page est fortement appréciée, voir, était attendue.
Conclusion
Conclusion générale
Etudes complètesToutes les conclusionsLes données chiffréesLe verbatim complet
Ateliers de 2 joursAnalyse de cas concretsPrésentation des règles d’ergonomieExercice sur exemples réels
Formation : Intégrer l’expérience utilisateur pour la création Flexhttp://www.rt-consultants.fr/index.php?art=25
Pour aller plus loin
Rémy TailleferNoelly Grondin-Devouche
Juliette Derréal
Sarl au capital de 8 000 EurosSIRET : 48091422500010
RCS Paris B 480 914
tél. 01 42 82 01 03
57 rue d’Amsterdam
75008 Paris
www.rt-consultants.fr
Conclusion