50
Architecture de l’information et réseaux (EDM 2530) – Automne 2012 – UQAM Cours / 05 Ergonomie et un architecte de l’information Geoffroi Garon et Martin Lessard

Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

  • Upload
    others

  • View
    0

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Architecture de l’information et réseaux (EDM 2530) – Automne 2012  – UQAM

Cours / 05Ergonomie et un architecte de l’information

Geoffroi Garon et Martin Lessard

Page 2: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Déroulement 

Partie 1

E iErgonomiePausePause

Partie 2Partie 2

Thibault Landel

Page 3: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

A b I t fArborescence(Structure)

Interface(Interaction)

ErgonomieErgonomie(Efficacité)

Page 4: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

E iErgonomie( ffi i é)(efficacité)

Page 5: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie

« L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » etméthodes et milieux de travail » et l'application de ces connaissances à la 

ti d tè i i tconception de systèmes « qui puissent être utilisés avec le maximum de confort, de sécurité et d'efficacité par le plus grand nombre »plus grand nombre. »

http://fr.wikipedia.org/wiki/Ergonomie

Page 6: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie

Page 7: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Types d’ergonomie

L'ergonomie physiqueL’ergonomie organisationnelleL’ i i iL’ergonomie cognitive

http://fr.wikipedia.org/wiki/Ergonomie

Page 8: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie cognitive

Ergonomie :Adapter la tâche à l'homme

Cognition :P l l iProcessus par lequel un organisme acquiert une connaissance

Page 9: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie cognitive de l’interface

Ajuster l’interaction avec l’informationen fonction des capacités de l’usagerpour réduire les contraintes cognitives.pour réduire les contraintes cognitives.

Page 10: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie cognitive de l’interface

L’ergonomie cognitive s’intéresse à :• la perception• aux activités symboliquesaux activités symboliques• la mémorisation

L’information en réseauest un ensemble de perceptionsd’activités symboliquesd activités symboliquesqui cherchent à être mémorisées.

Page 11: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie cognitive de l’interface

• Organiser l’information• Les catégories• Les hiérarchies Les hiérarchies• Les arborescencesL éti tt• Les étiquettes

• Lisibilité, intelligibilité

Page 12: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomique informatique

L'ergonomie informatique (ou ergonomie des interfaces) est une branche de l'ergonomie qui a pour objectifest une branche de l ergonomie, qui a pour objectif d'améliorer l'interaction homme‐machine, la facilité d’utilisation et d’apprentissage des produits interactifs pp g pCette pratique cherche à concevoir ou modifier des interfaces afin qu'elles soient en adéquation avec les caractéristiques physiologiques, perceptives et cognitives de leurs utilisateurs potentiels. Elle s'appuie sur différentes méthodes de conception et d’évaluationdifférentes méthodes de conception et d évaluation permettant d’obtenir le logiciel ou le site web le mieux adapté aux utilisateurs visés.p

http://fr.wikipedia.org/wiki/Ergonomie_informatique

Page 13: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Méthodes et outils 

1. Les méthodes faisant appel aux utilisateurs, avec des indicateurs de performance et de perception subjective :l ili à é ifi d i è d' ili é d' ili bili é d• le test utilisateur servant à vérifier des critères d'utilité, d'utilisabilité, de 

satisfaction, etc. en faisant tester l'interface par des utilisateurs individuellement• Le focus groupe permettant de recueillir l’opinion des utilisateurs réels ou• Le focus groupe permettant de recueillir l opinion des utilisateurs réels ou potentiels sur un logiciel ou un site Web• Le tri par cartes facilitant la structuration de l'architecture de l'information, le plus souvent l'arborescence des rubriques et menus d'un site Webplus souvent l arborescence des rubriques et menus d un site Web• Les personas, archétypes d'utilisateurs accompagnant la conception centrée sur l'utilisateur• L'analyse de la tâche et de la situation de travail permettent d'identifier les y pprincipes directeurs de la conception du logiciel et de son interface

2. Par l’ergonome avec des techniques basées sur  l’expérience, de la recherche comparative et du prototypage

Page 14: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ergonomie cognitive

PersonasPersonasCritères ergonomiquesg q

Page 15: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Persona

Un PERSONA, c’est un utilisateur‐type (le fameux archétype), une représentation fictive des utilisateursreprésentation fictive des utilisateurs cibles, qu’on peut utiliser pour fixer des i ité t id dé i i dpriorités et guider nos décisions de 

conception d’interface.

http://www.qualitystreet.fr/2011/03/11/une‐journee‐dans‐la‐vie‐du‐praticien‐agileux‐2‐personas/

Page 16: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Persona

Page 17: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Persona

Page 18: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Persona

Page 19: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Persona

http://www.businessmodelalchemist.com/2012/09/test‐your‐value‐proposition‐supercharge‐lean‐startup‐and‐custdev‐principles.html

Page 20: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

10 critères ergonomiques

1. Incitation2. Lisibilité3. Groupement‐Distinction entre items4. Feedback Direct5. Contrôle Utilisateur6. Concision7. Gestion des erreurs8. Adaptabilité9. Cohérence10.Signifiance

Selon Jean Claude GROSJEAN http://www.qualitystreet.fr/2010/08/04/design‐dinterface‐et‐critere‐ergonomique‐1‐lincitation/

Page 21: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

1 : IncitationAccompagner l’utilisateur dans sa tâche, le renseigner sur le contexte dans lequelle renseigner sur le contexte dans lequel il se trouve, l’orienter, l’amener à ff t d ti é ifi t teffectuer des actions spécifiques tout en prévenant au maximum l’indécision.

Page 22: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://prezi.com/pricing/

Page 23: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

2 : Lisibilité(faciliter la lecture et favoriser la compréhension de ce qui est affiché àcompréhension de ce qui est affiché à l’écran)

Page 24: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.videotron.com/residentiel/forfaits

Page 25: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

3 : Groupement‐Distinction entre items(regrouper ce qui va ensemble pour favoriser une meilleure distinction etfavoriser une meilleure distinction et reconnaissance des éléments)

Page 26: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.lacapitale.com

Page 27: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

4 : Feedback Direct(tenir l’utilisateur, en temps réel, informé de ce qui se passe)informé de ce qui se passe)

Page 28: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

https://www.brunet.ca/masante/registration

Page 29: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

5 : Contrôle Utilisateur(toujours laisser à l’utilisateur le contrôle sur les actions du système etcontrôle sur les actions du système et sur l’interface)

Page 30: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.archambault.ca

Page 31: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.archambault.ca

Page 32: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

6 : Concision(aller à l’essentiel, garantir la simplicité de l’interface et la pertinence desde l interface et la pertinence des fonctionnalités)

Page 33: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

https://twitter.com/

Page 34: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

7 : Gestion des erreurs(protéger l’utilisateur des erreurs potentielles et les gérer quand elles sepotentielles et les gérer quand elles se produisent (corriger ou aider à corriger)

Page 35: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

https://accounts.google.com/ServiceLoginAuth

Page 36: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

https://accounts.google.com/ServiceLoginAuth

Page 37: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

8 : Adaptabilité(S’ADAPTER aux caractéristiques des utilisateurs (vues, perspectives,utilisateurs (vues, perspectives, raccourcis…)

Page 38: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

9 : Cohérence(fournir à l’utilisateur un cadre stable dans des contextes similaires.)dans des contextes similaires.)

Page 39: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.bell.ca/Accueil

Page 40: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

10 : Signifiance(parler le langage de l’utilisateur)

Page 41: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.vrak.tv/

Page 42: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

http://www.vrak.tv/

Page 43: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Grille d’analyse ergonomique

Selon David Marbac, il y a 12 familles de critères :• Perception globale & identité dePerception globale & identité de marqueN i ti & l li ti• Navigation & localisation• Architecture de l’information & organisation visuelle• Texte & lisibilité• Texte & lisibilité

http://www.davidmarbac.com/blog/checklist‐criteres‐ergonomie/

Page 44: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Critères ergonomiques

• Couleur & visuels• Moteur de recherche interne• FormulairesFormulaires• Pages produitA ti i &• Actions, conversion & rassurance• Gestion des erreurs• Contrôle utilisateur• Respect des conventions• Respect des conventions

http://www.davidmarbac.com/blog/checklist‐criteres‐ergonomie/

Page 45: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Accessibilité Web

« L'accessibilité du web signifie que les personnes handicapées peuvent l'utiliser Plus spécifiquement ellehandicapées peuvent l utiliser. Plus spécifiquement, elle signifie que ces gens peuvent percevoir, comprendre, naviguer, interagir avec le web, et y contribuer. g g yL'accessibilité du Web bénéficie également à d'autres, notamment les personnes âgées ayant des capacités diminuées dues au vieillissement. »

h //f iki di / iki/ ibili % % d bhttp://fr.wikipedia.org/wiki/Accessibilit%C3%A9_du_web

Page 46: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Rencontre UX à Montréal

htt //t tl d /

Jeudi 8 novembre 2012 à 18h00 à la Coop Ecto

http://toutlemonde‐ux.com/

Page 47: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Pause

Page 48: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Thibault LandelThibault Landel

Page 49: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Ressources

Le site Web d’accompagnementwww.architecturedelinformation.wordpress.com

Information, présentations (PDF), liens pertinents, etc.

Page 50: Cours 05 Ergonomie et un architecte de l’information · Ergonomie «L'étude scientifique de la relation entre l'homme et ses moyens, méthodes et milieux de travail » et l'application

Nous joindre

Geoffroi GaronGeoffroi [email protected]

Martin Lessardi l d@ [email protected]

www.martinlessard.com

*Par courriel, ajoutez le mot‐clé EDM2530