Présentation des bases de l'ergonomie lors d'un Café Numérique.

1. Usability / Ergonomie
Nicolas GOYER / Smals

2. 11/09/2013
Smals
• Sites web
Portail de la sécurité sociale
Restructurations.be
AuTravail.be
Et bien d’autres encore
• Développement d’applications eGov
• 1600 collaborateurs en 2010
Parmi le top 10 des entreprises IT en Belgique

3. 11/09/2013
3
Table of Contents
1 Définitions
2 Théorie
3 Questions

4. 11/09/2013
4
L’ergonomie rend les applications et les sites
web plus faciles et plus simples à utiliser.
Définition de l’ergonomie

5. 11/09/2013
5
Définition de l’ergonomie
L’ergonomie c’est adapter un produit à ses
utilisateurs

6. 11/09/2013
6
Définition de l’ergonomie
L’ergonomie c’est rendre tout produit comme
une paire de lunette : un produit de haute
technologie qui s’efface devant l’usage
que l’on en fait.

7. 11/09/2013
Ergonomie et ergonomie
7

8. 11/09/2013
Ergonomie et ergonomie
8

9. 11/09/2013
9
Les composants de l’ergonomie
Efficacité
Efficience Satisfaction

10. 11/09/2013
Branche de l’ergonomie plus ciblée sur les
handicapes cognitifs, sensoriels et moteurs
Définition de l’accessibilité

11. 11/09/2013
Définition de l’accessibilité
L’accessibilité s’intéresse également au
condition d’accès a un site ou une
application web.

12. 11/09/2013
Définition de l’accessibilité
« Mettre le web et ses services à la disposition de tous
les individus, quels que soient leur matériel ou
logiciel, leur infrastructure réseau, leur langue
maternelle, leur culture, leur localisation
géographique, ou leurs aptitudes physiques ou
mentales. »
- Tim Berners Lee

13. 11/09/2013
Le contexte
13

14. 11/09/2013
Adopter le point de vu de l’utilisateur
Interface
Logique
Données
14

15. 11/09/2013
Adopter le point de vu de l’utilisateur
Interface
Magie
15

16. 11/09/2013
L’ergonomie dans un projet
Architecture de l’information / du site
Zoning – Design – Layout
Maquettage
Implémentation
Définition des fonctionnalités
Etc.

17. 11/09/2013
L’ergonomie : discipline transversale

18. 11/09/2013
18
Table of Contents
1 Définitions
2 Théorie
3 Questions

19. 11/09/2013
Heuristiques de Jakob Nielsen
1. Visibilité de l’état du système
2. Correspondance entre le système et le monde réel
3. Contrôle et liberté de l’utilisateur
4. Cohérence et respect des standards
5. Prévention des erreurs
6. Reconnaissance plutôt que rappel
7. Flexibilité et efficience d’utilisation
8. Design esthétique et minimaliste
9. Correction des erreurs
10. Aide et documentation

20. 11/09/2013
20
Autres heuristiques
• Heuristique de Bastin & Scapin
• Critères ergonomiques de Jean-François Nogier
• Critères ergonomiques d’Amélie Boucher

21. 11/09/2013
21
1. Visibilité de l’état du système
First name
Birth date
Last name
John
Smith
10 / 03 / 2008
OK
First name
Birth date
Last name
OK
First name
Birth date
Last name
John
Smith
10 / 03 / 2008
OK
Form sent successfully

22. 11/09/2013
22
2. Correspondance entre le système et le monde réel

23. 11/09/2013
23
3. Contrôle et liberté de l’utilisateur

24. 11/09/2013
24
4. Cohérence et respect des standards

25. 11/09/2013
25
5. Prévention des erreurs
10 march
10 march 2008
10/03/2008 ?
(dd/mm/yyyy)

26. 11/09/2013
26
6. Reconnaissance plutôt que rappel

27. 11/09/2013
27
7. Flexibilité et efficience d’utilisation
Ctrl S+
Novice Expert

28. 11/09/2013
28
8. Design esthétique et minimaliste

29. 11/09/2013
29
9. Correction des erreurs
Last name
(dd/mm/yyyy)Birth date
City
Error in the form
First name
(dd/mm/yyyy)Birth date
Last name
Bad date format
Smith
Brussels
10 march
John
Smith
10 march
First name John
City Brussels

30. 11/09/2013
30
10. Aide et documentation
Le système devrait fournir des aides et de la
documentation. Toutes les informations
devraient être facile à chercher et être
concentrées sur la tâche (par exemple,
tutoriels, spécifications, agents intelligents,
etc.).

31. 11/09/2013
31
Règles d’accessibilité
1. Perceptible
2. Utilisable
3. Compréhensible
4. Robuste

32. 11/09/2013
32
1. Perceptible
Proposer des équivalents textuels

33. 11/09/2013
33
1. Perceptible

34. 11/09/2013
34
Rendre toutes les fonctionnalités accessibles au clavier.
2. Utilisable

35. 11/09/2013
35
2. Utilisable
Laisser à l'utilisateur suffisamment de temps pour lire
et utiliser le contenu.

36. 11/09/2013
36
2. Utilisable
Fournir à l'utilisateur des éléments d'orientation pour
naviguer, trouver le contenu et se situer dans le site.

37. 11/09/2013
37
3. Compréhensible
1st page left side menu 2nd page right side menu 3rd page left or right side menu
Faire en sorte que les pages apparaissent et fonctionnent de
manière prévisible.

38. 11/09/2013
38
4. Robuste
Optimiser la compatibilité avec les différents navigateur
actuels et futurs.

39. 11/09/2013
39
Table of Contents
1 Définitions
2 Théorie
3 Questions

40. 11/09/2013
Questions ?
Remarques ?

41. 11/09/2013
Coordonnées
• Nicolas.GOYER@smals.be
• Nicolas_GOYER@usability.fr
• Twitter @usability_fr
• Slideshare usability_fr
• Linkedin
http://www.linkedin.com/in/nickko