SlideShare une entreprise Scribd logo
Drupal Lyon
          Lyon, France
      15 décembre 2011

       Olivier Lorrain
www.olivierlorrain.com
Qu’est-ce que
l’ergonomie ?
Paint




Lequel des deux
logiciels est le plus
ergonomique ?


          Adobe Photoshop
Paint




Lequel des deux
                Pour qui ?
logiciels est le plus
ergonomique ?


          Adobe Photoshop
Donc, nous concevons pour qui ? Notre public est-il flou ?
Il faut rechercher, connaître et comprendre qui utilisera
l’interface




                                      Valeurs
                                     Attitude
                                     Habiletés
Conception centrée utilisateur
                             Observation contextuelle
Analyse de son environnement Test utilisateur
Analyse du contexte          Architecture d’information
                             Entrevues
Analyse de ses besoins
                             Personas
                             Prototypage papier
                             Évaluation heuristique
                            Statistiques du présent produit
                            Benchmarking
                            Analyse de la tâche
                            Suivi après le lancement
Test utilisateur (test d’utilisabilité)

   Un test utilisateur permet
   de:
   • déterminer ce que
   l’utilisateur aime de
   l’interface.
   • déterminer ce que
   l’utilisateur aimerait avoir
   sur le site ou sur le
   logiciel.
Test utilisateur (test d’utilisabilité)

   Un test utilisateur permet
   de:
   • déterminer ce que
                                  Il faut davantage observer
   l’utilisateur aime de
                                  ce que les utilisateurs
   l’interface.
                                  font que ce qu’ils disent
   • déterminer ce que
                                  aimer.
   l’utilisateur aimerait avoir
   sur le site ou sur le
   logiciel.
Test utilisateur (test d’utilisabilité)
 D’exploration, de performance, de validation, de
 comparaison
   Avec modération
       En laboratoire
       Sur le coin d’une table
       À distance
       …
   Sans modération
       Ex Chalkmark
       …
25% Mauvais réponse
                                                             Rue89 Planète = Environnement
 Chalkmark
 Vous voulez lire les derniers articles concernant l'Asie, comment faites-vous? (Rue89.fr – Drupal)




                                                         38% Bonne réponse
Pour visualiser tous les résultats de cette courte étude
https://lorrain.optimalworkshop.com/chalkmark/shared-results/rue89
Architecture de l’information
 Avec Modération
    Tri de cartes
    …
 Sans modération
    Treejack
    Optimal Sort
    Websort
    …
Optimal Sort
    17 cartes devant être regroupées en groupe afin de créer l’architecture d’un site
    hébergeant un nouveau CMS – LyonCMS – Exercice effectué par 8 développeurs


                                                           Il y a des regroupements qui
                                                           ressortent, e.g., « Thèmes » et
                                                           « Modules »




Pour visualiser tous les résultats de cette courte étude
https://lorrain.optimalworkshop.com/optimalsort/shared-results/lyoncms
L’effet du gros index!
                     Petite histoire…
                     Lors d’un test utilisateur, un
                     participant ayant de gros doigts
                     effleura le boutons en bas à
                     droite alors qu’il effectuait une
                     transaction et qu’il voulait faire
                     défiler la page.
                     Résultat, il perdit toutes les
                     informations de son virement
                     et dût recommencer…

                     Depuis, l’application est « gros
                     index friendly » et ce problème
                     n’existe plus.
Coût d’un changement
                                                              Il est primordial de
                                                              débuter la recherche
                                                              sur l’utilisateur cible
                                                              dès le début d’un
                                                              projet. Cela limitera le
                                                              nombre de
                                                              changements coûteux
                                                              plus tard dans le
                                                              processus.




Source: http://sqa.fyicenter.com/FAQ/Why-Bugs-in-Software/Cost_to_find_bugs.html
Listes, organisations et conférence
 Listes
    https://listes.cru.fr/sympa/subscribe/ergoihm
    https://listes.cru.fr/sympa/subscribe/ergoliste (davantage
     ergonomie physique)
 Organisations
    UPA - www.upassoc.org (Anglais - Org internationale)
    Gerra - www.gerra.asso.fr (Org Rhône-Alpes)
    SELF - www.ergonomie-self.org (Société d’ergonomie de
     langue française)
 Conférence
    IHM - www.afihm.org/?page_id=21 (annuelle - France)
Livres




                                          « Don’t Make Me Think »
                                              Par Steve Krug

« Ergonomie du logiciel et design web »
       Par Jean-François Nogier
Blogs et articles
 Agrégateur de blogs: - (français et anglais)
  http://www.netvibes.com/ergoihm#Ergo_IHM
 http://www.uie.com/articles (anglais - usability)
 http://uxmag.com (anglais – ux – design )
Mots de la fin…
Prenez la peine de connaître vos utilisateurs...
Et vous n’en êtes pas un !


‘Intuitive’ interfaces are easier to build when
designers have a deep understanding of the users
                                  Jared M. Spool – CEO de UIE




Customer experience is everybody’s concern


                                   www.olivierlorrain.com
www.olivierlorrain.com

Contenu connexe

PPSX
Charte Ergonomique
PPT
Ergonomie(1) (1)
PDF
L'Ergonomie pour les Nuls
PDF
Ergonomie des IHM web - Notes de cours (1/3)
PDF
Cours ergonomie des IHM web - Chapitre 2 - Introduction et définition
PDF
Cours ergonomie des IHM web - Chapitre 13 - Audit ergonomique
PDF
Ergonomie des IHM web - Grille d'analyse de Bastien et Scapin
PDF
Cours ergonomie des IHM web - Chapitre 1 - contexte
Charte Ergonomique
Ergonomie(1) (1)
L'Ergonomie pour les Nuls
Ergonomie des IHM web - Notes de cours (1/3)
Cours ergonomie des IHM web - Chapitre 2 - Introduction et définition
Cours ergonomie des IHM web - Chapitre 13 - Audit ergonomique
Ergonomie des IHM web - Grille d'analyse de Bastien et Scapin
Cours ergonomie des IHM web - Chapitre 1 - contexte

Tendances (19)

PDF
Ergonomie des IHM web - Notes de cours (3/3)
PDF
Cours ergonomie des IHM web - Chapitre 7 - Méthode des personas
PDF
Cours ergonomie des IHM web - Chapitre 10 - Méthode du tri des cartes
PDF
Ergonomie des IHM web - Grille d'analyse des 12 règles
PPTX
Maquettes IHM - Présentation USE AGE - 20-02-2014
PDF
Ergonomie des IHM web - Grille d'analyse de Nielsen
PDF
Cours ergonomie des IHM web - Chapitre 12 - Maquette
PDF
Ihm introduction
PDF
Ergonomie et modélisation des utilisateurs d'une ihm 2014
PDF
PDF
Ergonomie web & interface tactile
PDF
Cours ergonomie des IHM web - Chapitre 9 - Architecturer l'information
PDF
Ergonomie et modelisation utilisateurs
PDF
Ergonomie : performance et satisfaction de nos clients
PDF
Cours ergonomie des IHM web - Chapitre 8 - Définition des contenus
PDF
Intro conception et évaluation des IHM
PDF
IHM et Genie Logiciel: Plasticite
PDF
Modelisation et maquettage 2015
PDF
Plasticité2015 intro
Ergonomie des IHM web - Notes de cours (3/3)
Cours ergonomie des IHM web - Chapitre 7 - Méthode des personas
Cours ergonomie des IHM web - Chapitre 10 - Méthode du tri des cartes
Ergonomie des IHM web - Grille d'analyse des 12 règles
Maquettes IHM - Présentation USE AGE - 20-02-2014
Ergonomie des IHM web - Grille d'analyse de Nielsen
Cours ergonomie des IHM web - Chapitre 12 - Maquette
Ihm introduction
Ergonomie et modélisation des utilisateurs d'une ihm 2014
Ergonomie web & interface tactile
Cours ergonomie des IHM web - Chapitre 9 - Architecturer l'information
Ergonomie et modelisation utilisateurs
Ergonomie : performance et satisfaction de nos clients
Cours ergonomie des IHM web - Chapitre 8 - Définition des contenus
Intro conception et évaluation des IHM
IHM et Genie Logiciel: Plasticite
Modelisation et maquettage 2015
Plasticité2015 intro
Publicité

Similaire à Introduction à l'ergonomie - Drupal Lyon (20)

PDF
Méthodologie de conception: user flow
PDF
Ergonomie & Expérience Utilisateur (UX) | Cours Introduction
PDF
1. Introduction à l'Expérience utilisateur
PPTX
101 - UX, Agile, collaboration : une formule gagnante en développement de pr...
PDF
Conception d'un Extranet
PDF
Agora CMS - 25 avril 2014 - UX : Mythe et réalité
PDF
Construire et prototyper rapidement un concept d’application mobile
PDF
Réussir son analyse des besoins dans la conduite d'un projet informatique (2007)
PDF
Nos Systèmes by Fing : "Kit d'auto-évaluation des algorithmes"
PDF
Optimiser l'expérience utilisateur de l'Open Source
PPT
WUD2010 Sophia 08 - S. de Bonis (IBM) "Concevoir un intranet centré utilisateur"
PPT
WUD2010 Sophia 08 - S. de Bonis (IBM) "Concevoir un intranet centré utilisateur"
PPTX
Mtl apptalks ux mobile et ucd - janvier 2014
PPTX
Kit De Survie Techno et Web à l'usage des Entrepreneurs
PDF
#3 etapes projet
PDF
Good Morning UX #3 : Les fondamentaux du design UX
PDF
Toolbox du designer : Useberry
PPTX
Dans les coulisses de la recherche utilisateurs à Microsoft Surface
PDF
Star d'UX bordeaux #1 - en UXmmersion
PDF
Introduction module IHM Polytech Sophia Dept Info SI3
Méthodologie de conception: user flow
Ergonomie & Expérience Utilisateur (UX) | Cours Introduction
1. Introduction à l'Expérience utilisateur
101 - UX, Agile, collaboration : une formule gagnante en développement de pr...
Conception d'un Extranet
Agora CMS - 25 avril 2014 - UX : Mythe et réalité
Construire et prototyper rapidement un concept d’application mobile
Réussir son analyse des besoins dans la conduite d'un projet informatique (2007)
Nos Systèmes by Fing : "Kit d'auto-évaluation des algorithmes"
Optimiser l'expérience utilisateur de l'Open Source
WUD2010 Sophia 08 - S. de Bonis (IBM) "Concevoir un intranet centré utilisateur"
WUD2010 Sophia 08 - S. de Bonis (IBM) "Concevoir un intranet centré utilisateur"
Mtl apptalks ux mobile et ucd - janvier 2014
Kit De Survie Techno et Web à l'usage des Entrepreneurs
#3 etapes projet
Good Morning UX #3 : Les fondamentaux du design UX
Toolbox du designer : Useberry
Dans les coulisses de la recherche utilisateurs à Microsoft Surface
Star d'UX bordeaux #1 - en UXmmersion
Introduction module IHM Polytech Sophia Dept Info SI3
Publicité

Introduction à l'ergonomie - Drupal Lyon

  • 1. Drupal Lyon Lyon, France 15 décembre 2011 Olivier Lorrain www.olivierlorrain.com
  • 3. Paint Lequel des deux logiciels est le plus ergonomique ? Adobe Photoshop
  • 4. Paint Lequel des deux Pour qui ? logiciels est le plus ergonomique ? Adobe Photoshop
  • 5. Donc, nous concevons pour qui ? Notre public est-il flou ?
  • 6. Il faut rechercher, connaître et comprendre qui utilisera l’interface Valeurs Attitude Habiletés
  • 7. Conception centrée utilisateur Observation contextuelle Analyse de son environnement Test utilisateur Analyse du contexte Architecture d’information Entrevues Analyse de ses besoins Personas Prototypage papier Évaluation heuristique Statistiques du présent produit Benchmarking Analyse de la tâche Suivi après le lancement
  • 8. Test utilisateur (test d’utilisabilité) Un test utilisateur permet de: • déterminer ce que l’utilisateur aime de l’interface. • déterminer ce que l’utilisateur aimerait avoir sur le site ou sur le logiciel.
  • 9. Test utilisateur (test d’utilisabilité) Un test utilisateur permet de: • déterminer ce que Il faut davantage observer l’utilisateur aime de ce que les utilisateurs l’interface. font que ce qu’ils disent • déterminer ce que aimer. l’utilisateur aimerait avoir sur le site ou sur le logiciel.
  • 10. Test utilisateur (test d’utilisabilité)  D’exploration, de performance, de validation, de comparaison  Avec modération  En laboratoire  Sur le coin d’une table  À distance  …  Sans modération  Ex Chalkmark  …
  • 11. 25% Mauvais réponse Rue89 Planète = Environnement Chalkmark Vous voulez lire les derniers articles concernant l'Asie, comment faites-vous? (Rue89.fr – Drupal) 38% Bonne réponse Pour visualiser tous les résultats de cette courte étude https://lorrain.optimalworkshop.com/chalkmark/shared-results/rue89
  • 12. Architecture de l’information  Avec Modération  Tri de cartes  …  Sans modération  Treejack  Optimal Sort  Websort  …
  • 13. Optimal Sort 17 cartes devant être regroupées en groupe afin de créer l’architecture d’un site hébergeant un nouveau CMS – LyonCMS – Exercice effectué par 8 développeurs Il y a des regroupements qui ressortent, e.g., « Thèmes » et « Modules » Pour visualiser tous les résultats de cette courte étude https://lorrain.optimalworkshop.com/optimalsort/shared-results/lyoncms
  • 14. L’effet du gros index! Petite histoire… Lors d’un test utilisateur, un participant ayant de gros doigts effleura le boutons en bas à droite alors qu’il effectuait une transaction et qu’il voulait faire défiler la page. Résultat, il perdit toutes les informations de son virement et dût recommencer… Depuis, l’application est « gros index friendly » et ce problème n’existe plus.
  • 15. Coût d’un changement Il est primordial de débuter la recherche sur l’utilisateur cible dès le début d’un projet. Cela limitera le nombre de changements coûteux plus tard dans le processus. Source: http://sqa.fyicenter.com/FAQ/Why-Bugs-in-Software/Cost_to_find_bugs.html
  • 16. Listes, organisations et conférence  Listes  https://listes.cru.fr/sympa/subscribe/ergoihm  https://listes.cru.fr/sympa/subscribe/ergoliste (davantage ergonomie physique)  Organisations  UPA - www.upassoc.org (Anglais - Org internationale)  Gerra - www.gerra.asso.fr (Org Rhône-Alpes)  SELF - www.ergonomie-self.org (Société d’ergonomie de langue française)  Conférence  IHM - www.afihm.org/?page_id=21 (annuelle - France)
  • 17. Livres « Don’t Make Me Think » Par Steve Krug « Ergonomie du logiciel et design web » Par Jean-François Nogier
  • 18. Blogs et articles  Agrégateur de blogs: - (français et anglais) http://www.netvibes.com/ergoihm#Ergo_IHM  http://www.uie.com/articles (anglais - usability)  http://uxmag.com (anglais – ux – design )
  • 19. Mots de la fin… Prenez la peine de connaître vos utilisateurs... Et vous n’en êtes pas un ! ‘Intuitive’ interfaces are easier to build when designers have a deep understanding of the users Jared M. Spool – CEO de UIE Customer experience is everybody’s concern www.olivierlorrain.com

Notes de l'éditeur

  • #16: Les ergonomes sont trop souvent appelés à la toute fin …