Guide ergonomie des modules e learning et apprentissages multimédia

Pour gagner en efficacité

Cliquez pour modifier le style du titre
Guide des critères et recommandations
ergonomiques et multimédia

Laura CRESPIN
1

SOMMAIRE

Introduction : En quoi une bonne ergonomie est bénéfique pour l’apprentissage ?

1. Principes ergonomiques
Guidage
Charge de travail
Contrôle explicite
Homogénéité/cohérence

2. Apprentissage multimédia
Qu’est ce qu’un multimédia ?
Le principe multimédia
Le principe de modalité
Le principe de redondance
Le principe de contiguïté spatiale
Le principe de contiguïté temporelle
Le principe de cohérence
Le principe d’indiçage (signaling)
Les différences individuelles

Quiz
2

Introduction : En quoi une bonne ergonomie
est bénéfique pour l’apprentissage ?

3

En quoi une bonne ergonomie est bénéfique pour l’apprentissage

Une mauvaise ergonomie requiert des ressources chez l’apprenant. Ces ressources
mobilisés pour l’ergonomie ne pourront plus être utilisées pour le traitement de
l’information, soit l’apprentissage.
Un document multimédia efficace diminue les ressources dues à l’ergonomie et
augmente les ressources utilisées pour l’apprentissage.
Une bonne ergonomie permet donc de gagner en efficacité.

Apprentissage Apprentissage

Ergonomie
Ergonomie

Document non efficace Document efficace
4

Cliquez pour ergonomiques du titre
1. Principes modifier le style

Guidage
Lisibilité
Charge de travail
Contrôle explicite

5

Principes ergonomiques

Guidage

Titre de
Logo N° Chapitre Titre chapitre
l’animation
Certaines informations doivent
apparaître sur chaque page :

 Un logo
 Le N° du chapitre
 Un titre
 Possibilité de revenir à la page
d’accueil (généralement le logo
en haut à gauche)
 Possibilité de revenir en arrière

Possibilité de revenir à la page d’accueil Possibilité de revenir en arrière
6


Guidage

Concernant les titres :

 Ils doivent être compréhensibles et concis
 Ils doivent contenir les mots clé du texte
 Le premier mot doit apporter le plus d’informations possible
 Eviter de commencer tous les titres par le même mot

7


Lisibilité

- Eviter l’italique
- Eviter les textes en capitales
- Contraste texte/arrière-plan soutenu
- Préférer un fond léger
- Rédiger des textes qui soient au moins deux fois plus courts que des textes destinés à être
imprimés
- Faire en sorte que les apprenants n'aient pas de longs blocs de texte à lire : utiliser des
paragraphes courts, des titres et sous-titres et des listes de puces, utiliser des pop-up pour
diviser les blocs d'informations longs

8


Lisibilité

- Justifier le texte à gauche (pas gauche et droite)
- Éviter les caractères clignotants (les mettre en gras ou augmenter la taille de police), car ils
attirent l'attention de l‘apprenant au détriment des autres informations disponibles sur la page
- Éviter les messages défilant (posent des problèmes à la lecture compte tenu de la vitesse
variable de défilement) => utiliser du texte statique
- Utiliser des polices sans sérif (de type Arial), qui sont recommandées pour la lecture sur écran
contrairement aux polices avec sérif (de type Times) qui sont recommandées pour la lecture sur
papier.

Arial Times
Sans sérif Avec sérif

9


Lisibilité
Remarque : le temps de lecture à REMARQUE : LE TEMPS DE LECTURE
A L’ECRAN EST SUPERIEUR DE 25-
l'écran est supérieur de 25-30%
30% COMPARATIVEMENT A UNE
comparativement à une lecture faite LECTURE FAITE SUR UN SUPPORT
sur un support papier, bien qu’il se soit PAPIER, BIEN QU’IL SOIT REDUIT
réduit fortement depuis les écrans FORTEMENT DEPUIS LES ECRANS
LCD.
LCD. PAR AILLEURS ON ESTIME QUE LA
Par ailleurs, on estime que la PROPORTION DE SURFACE LIBRE
proportion de surface libre nécessaire NECESSAIRE DANS UN DOCUMENT
PAPIER REPRESENTE 25 A 40% DE LA
dans un document papier représente
SURFACE TOTALE ; SUR UN ECRAN,
de 25 à 40% de la surface totale ; sur LA PROPORTION DE SURFACE LIBRE
un écran, la proportion de surface libre EST DE 40 A 60% DE LA SURFACE
est de 40 à 60% de la surface totale. TOTALE.

Bonne lisibilité Mauvaise lisibilité

Pourquoi le texte de droite n’est pas lisible ?

10


Lisibilité
Remarque : le temps de lecture à REMARQUE : LE TEMPS DE LECTURE
A L’ECRAN EST SUPERIEUR DE 25-
l'écran est supérieur de 25-30%
30% COMPARATIVEMENT A UNE
comparativement à une lecture faite LECTURE FAITE SUR UN SUPPORT
sur un support papier, bien qu’il se soit PAPIER, BIEN QU’IL SOIT REDUIT
réduit fortement depuis les écrans FORTEMENT DEPUIS LES ECRANS
LCD.
LCD. PAR AILLEURS ON ESTIME QUE LA
Par ailleurs, on estime que la PROPORTION DE SURFACE LIBRE
proportion de surface libre nécessaire NECESSAIRE DANS UN DOCUMENT
PAPIER REPRESENTE 25 A 40% DE LA
dans un document papier représente
SURFACE TOTALE ; SUR UN ECRAN,
de 25 à 40% de la surface totale ; sur LA PROPORTION DE SURFACE LIBRE
un écran, la proportion de surface libre EST DE 40 A 60% DE LA SURFACE
est de 40 à 60% de la surface totale. TOTALE.

Bonne lisibilité Mauvaise lisibilité

Pourquoi le texte de droite n’est pas lisible ?
• Texte en italique • Texte justifié à gauche et à droite
• Texte en capitale • Police avec sérif
• Mauvais contraste fond/forme • Pas de mise en forme avec les
• Fond non uniforme idées importantes en surbrillance 11


Charge de travail

Les listes d’items doivent être courtes (pas plus de 7) car les études en psychologie cognitive ont
mis en évidence les capacités limitées et de la mémoire de travail*, or la mémoire de travail
intervient dans le traitement des informations.

Mémoire de travail :
La mémoire de travail est la capacité à retenir des informations à
court terme (quelques secondes) pour réaliser des opérations
mentales sur ces informations (par exemple mémoriser et
comprendre des informations).
La capacité limitée de la mémoire de travail contraint les activités
mentales complexes comme la mémorisation d’informations, c’est
pourquoi il faut en tenir compte dans la présentation de l’information.

12


Charge de travail

La densité informationnelle concerne la charge de travail du point de vue perceptif et mnésique
(relatif à la mémoire).

Recommandations :
- Éliminer sur chaque page, les informations superflues pouvant distraire l‘apprenant.
- Le nombre d’éléments cliquables sur un écran ne doit pas être supérieur à 7 (cf mémoire de
travail).

13


Contrôle explicite

L‘apprenant doit toujours "avoir la main" sur le fonctionnement du module, c'est-à-dire qu'il doit
pouvoir contrôler son déroulement (interrompre, reprendre, revenir en arrière etc.). Ses actions
doivent pouvoir être anticipées grâce à des options appropriées qui doivent être fournies pour
chaque cas.

Recommandations :
- Pour les sons : éviter qu'ils soient téléchargés et déclenchés automatiquement. De plus, lors de
l'écoute, un panneau de contrôle doit être fourni. Les sons peuvent être utilisés en complément
de l'interface visuelle pour informer l‘apprenant d'événements d'arrière-plan. Des sons de bonne
qualité enrichissent le site.
- Les animations périphériques (c'est-à-dire secondaires, qui n’entrent pas en jeu dans la
compréhension) sont à éviter. Elles mobilisent l’attention des apprenants ce qui engendre des
difficultés pour lire les autres informations.
- Les animations sont à minimiser au maximum et éviter celles qui bouclent sans fin.

14



Les choix de conception de l'interface (codes, dénominations, formats, procédures, etc.) doivent
être conservés pour des contextes identiques, et doivent être différents pour des contextes
différents.

Recommandations :
- Les icônes doivent être utilisées de manière cohérente, c'est-à-dire une même icône utilisée
pour une même fonction et dans le même format.
- Tous les écrans du module doivent avoir la même structure : utilisation de formats identiques
pour les titres, les alignements, les dispositions d'images, etc.
- Les mêmes séquences d'action doivent avoir les mêmes effets pour l'ensemble du module.
- Les termes employés sur le module doivent être homogènes : un même mot renvoie toujours à
la même signification.

15

2. Apprentissage multimédia

Qu’est ce qu’un multimédia ?
16

Apprentissage multimédia

Qu’est ce qu’un multimédia

Les recommandations concernant l’apprentissage multimédia vont permettre aux concepteurs
pédagogiques d’organiser aux mieux les modules e-learning pour permettre une meilleure
intégrations des informations et donc un meilleur apprentissage.

Un document multimédia est un support composé d’au moins deux moyens de représenter
l’information, tel que :
- Du texte
- Des images
- Du son
- Des animations Une personne assise devant un
ordinateur et qui reçoit des
informations textuelles, graphiques,
animées ou encore sonore.
Une présentation avec un discours
oral et des informations graphiques.

Support avec du
texte et des images.
17


Le principe multimédia suggère que les illustrations se révèlent bénéfiques pour aider à la
compréhension d’un texte. Les apprenants retiennent et comprennent mieux avec un texte + une
illustration qu’avec un texte seul. Néanmoins il faut que le contenu de l’illustration soit nécessaire
à la compréhension et cohérente avec le contenu du texte.

La poulie est un engin en forme La poulie est un engin en forme
de roue servant à transmettre un de roue servant à transmettre un
mouvement. Dans le cas ou on mouvement. Dans le cas ou on
utilise une poulie fixe, utilise une poulie fixe,
la force de traction change. Ceci la force de traction change. Ceci
consiste à ce que le poids à faire consiste à ce que le poids à faire
bouger ne se divise ou ne se bouger ne se divise ou ne se
multiplie, mais à ce que la multiplie, mais à ce que la
direction dans laquelle on doit direction dans laquelle on doit
tirer change et qu’on pourra se tirer change et qu’on pourra se
suspendre à la corde pour hisser suspendre à la corde pour hisser
la charge. la charge.

Texte seul Texte + illustration
18



Le principe de modalité suggère que la compréhension et la mémorisation est meilleur à partir
d’une image et d’une narration entendue qu’à partir d’une image et d’un texte lu.

Lorem ipsum dolor sit

>
amet, consectetur
adipisicing elit, sed do
eiusmod tempor
incididunt ut labore et
dolore magna aliqua.

Illustration + narration > Illustration + texte

19



Le principe de redondance suggère que la compréhension et la mémorisation est meilleur à
partir d’une illustration accompagnée d’une narration qu’à partir d’une illustration accompagnée
d’une narration et d’un texte.

Lorem ipsum dolor sit
amet, consectetur

> adipisicing elit, sed do
eiusmod tempor
incididunt ut labore et
dolore magna aliqua.

Illustration + narration > Illustration + narration + texte

20



Le principe de contiguïté spatiale suggère que l’apprentissage est meilleur lorsque les mots et les
illustrations correspondantes sont physiquement proches.

axe
(point d’appui)

>
roue

force

charge

Présentation séparées où les
Présentation intégrée
informations textuelles sont
qui relie les informations
textuelles à l’illustration
grâce à des flèches.
> présentées à l’aide de fenêtres
disposées sur les côtés de
l’illustration.
21



Le principe de contiguïté temporelle suggère que l’apprentissage est meilleur lorsque les mots et
les images sont présentés simultanément plutôt que successivement.

Si délai entre narration et image est nul ou court, les apprenants peuvent faire des connexions
entre les représentations verbales et picturales. Si ce délai est long, les apprenants ont des
difficultés à faire ces connexions, ce qui perturbe la compréhension.


Le principe de cohérence suggère que les informations non cohérentes perturbent l’apprenant.

22



Le principe d’indiçage suggère que l’apprentissage des individus est amélioré par l’ajout
d’informations au document, tel que des flèches directionnelles, des consignes, ou des couleurs
ayant pour but d’orienter leur attention sur les éléments pertinents de la leçon.

NB : Indicer un texte (c’est-à-dire le mettre en forme grâce à des titres, des paragraphes, des
listes à puces si nécessaire etc.) est plus efficace que le fait d’utiliser des indices tels que des
flèches.

23



• Le rôle des connaissances préalables :
Les effets bénéfiques d’un support multimédia sont plus importants pour les apprenants avec des
connaissances préalables peu élevées.
Les apprenants avec des connaissances préalables compensent le manque de guidage en utilisant
leurs connaissances.
Un design inapproprié entraîne une charge de travail (cf mémoire de travail) importante chez les
apprenants à faibles connaissances préalables.

• Le rôle des capacités de visualisation spatiale* :
capacités de visualisation spatiale élevées.

Capacité de visualisation spatiale :
Capacité à visualiser et manipuler mentalement des objets aux formes complexes et de les faire
bouger dans l'espace.
24


Synthèse

• Utiliser des illustrations lorsque celles-ci peuvent être bénéfiques pour la compréhension.
• Lors de l’utilisation d’une illustration, préférer l’accompagner d’un texte oral plutôt que d’un
texte écrit (par exemple utilisation d’une mascotte).
• Lors de l’utilisation d’une image, ne pas l’accompagné d’un texte oral + un texte écrit qui
reprendrait les même termes. Lors de l’utilisation d’une mascotte, ne pas retranscrire le contenu
du discours à l’écrit. Le contenu écrit peut compléter ou reprendre les points essentiels du
discours de la mascotte mais il ne doit pas le reprendre mots pour mots.
• Veiller à ce que les illustrations soit physiquement proches de leur équivalent textuel.
• Veiller à ce que les illustrations apparaissent en même temps que leur équivalent textuel.
• Eviter les illustrations non cohérentes avec l’information.
• Veiller à indicer l’information grâce à des flèches directionnelles, des consignes, ou des couleurs
ayant pour but d’orienter l’attention des apprenants sur les éléments pertinents de l’information.

25

Quiz

26

Quiz

Question 1

Une bonne ergonomie :

Libère des ressources chez l’apprenant qu’il pourra utiliser pour l’apprentissage

Diminue les ressources utilisées pour l’apprentissage

Augmente les ressources utilisées pour l’apprentissage

Améliore le design

27

Quiz

Question 1

Une bonne ergonomie :

Libère des ressources chez l’apprenant qu’il pourra utiliser pour l’apprentissage

Diminue les ressources utilisées pour l’apprentissage

Augmente les ressources utilisées pour l’apprentissage

Améliore le design

Un document multimédia efficace diminue les ressources dues à l’ergonomie et augmente les ressources
utilisées pour l’apprentissage.

28

Quiz

Question 2

Comment mettre les informations importantes en surbrillance ?

Mettre l’information en gras

Augmenter la taille de police

Mettre l’information d’une couleur différente du reste du texte

Faire clignoter l’information

29

Quiz

Question 2

Comment mettre les informations importantes en surbrillance ?

Mettre l’information en gras

Augmenter la taille de police

Mettre l’information d’une couleur différente du reste du texte

Faire clignoter l’information

Il faut éviter les caractères clignotants, car ils attirent l'attention de l‘apprenant et perturbe la lecture des
autres informations disponibles sur la page. S’il est intéressant d’attirer leur attention sur les informations
importantes, il ne faut pas que cela soit au détriment d’autres informations.

30

Quiz

Question 3

Le(s)quel(s) de ces textes répond(ent) au principe de lisibilité ?

Lorem ipsum dolor sit Lorem ipsum dolor sit Lorem ipsum dolor sit
amet, consectetur amet, consectetur amet, consectetur
adipisicing elit, sed do adipisicing elit, sed do adipisicing elit, sed do
eiusmod tempor eiusmod tempor eiusmod tempor
incididunt ut labore et incididunt ut labore et incididunt ut labore et
dolore magna aliqua. dolore magna aliqua. dolore magna aliqua.


31

Quiz

Question 3

Le(s)quel(s) de ces textes répond(ent) au principe de lisibilité ?


 Texte en italique +
police avec sérif
 Texte justifié  Police avec sérif


 Police avec sérif

32

Quiz

Question 4

De quelle longueur doivent être les liste d’items ?

Entre 4 et 7

Moins de 7

Ça dépend du type d’item

33

Quiz

Question 4

De quelle longueur doivent être les liste d’items ?

Entre 4 et 7

Moins de 7

Ça dépend du type d’item

Les listes d’items doivent ne doivent pas dépasser 7 car les études en psychologie cognitive ont mis en
évidence les capacités limitées et de la mémoire de travail, or la mémoire de travail intervient dans le
traitement des informations.

34

Quiz

Question 5

Lorsque le module contient du son :

Celui-ci doit être téléchargés et déclenchés automatiquement

L’apprenant doit pouvoir arrêter le son

Un panneau de contrôle doit être fourni

Le son doit être de bonne qualité

35

Quiz

Question 5

Lorsque le module contient du son :

Celui-ci doit être téléchargés et déclenchés automatiquement

L’apprenant doit pouvoir arrêter le son

Un panneau de contrôle doit être fourni

Le son doit être de bonne qualité

Dans tout les cas, l’apprenant doit avoir le contrôle sur le module. Pour ce qui est du son, l’apprenant doit
pouvoir décider de si il veut ou non le déclencher, il doit pouvoir l’arrêter et modifier le volume comme il le
souhaite.

36

Quiz

Question 6
compréhension d’un texte :

Si le contenu de l’illustration est nécessaire à la compréhension

Si l’illustration est séduisante

Si l’illustration est cohérente avec le contenu du texte

37

Quiz

Question 6
compréhension d’un texte :

Si le contenu de l’illustration est nécessaire à la compréhension

Si l’illustration est séduisante

Si l’illustration est cohérente avec le contenu du texte

Les apprenants retiennent et comprennent mieux avec un texte + une illustration qu’avec un texte seul.
Néanmoins il faut que le contenu de l’illustration soit nécessaire à la compréhension et cohérente avec le
contenu du texte.

38

Quiz

Question 7

La compréhension et la mémorisation est la meilleure

à partir d’une illustration accompagnée d’un texte

à partir d’une illustration accompagnée d’une narration

à partir d’une illustration accompagnée d’une narration et d’un texte

39

Quiz

Question 7

La compréhension et la mémorisation est la meilleure

à partir d’une illustration accompagnée d’un texte

à partir d’une illustration accompagnée d’une narration

à partir d’une illustration accompagnée d’une narration et d’un texte

La compréhension et la mémorisation est la meilleure à partir d’une illustration accompagnée d’une
narration.

40

Quiz

Question 8

Lors de l’utilisation d’une mascotte

Le contenu du discours de la mascotte doit être retranscrit à l’écrit

Un contenu écrit peut compléter ou reprendre les points essentiels du discours de la
mascotte

Les informations les plus importantes doivent apparaitre à l’écrit et non dans le discours
de la mascotte

41

Quiz

Question 8

Lors de l’utilisation d’une mascotte

Le contenu du discours de la mascotte doit être retranscrit à l’écrit

Un contenu écrit peut compléter ou reprendre les points essentiels du discours de la
mascotte

Les informations les plus importantes doivent apparaitre à l’écrit et non dans le discours
de la mascotte

Lors de l’utilisation d’une mascotte, il ne faut pas retranscrire le contenu du discours à l’écrit. Le contenu écrit
peut compléter ou reprendre les points essentiels du discours de la mascotte mais il ne doit pas le reprendre
mots pour mots.

42

Quiz

Question 9

Les effets bénéfiques d’un support multimédia sont plus importants

pour les apprenants avec des connaissances préalables élevées

pour les apprenants avec des connaissances préalables peu élevées

pour les apprenants avec des capacités de visualisation spatiale élevées

pour les apprenants avec des capacités de visualisation spatiale peu élevées

43

Quiz

Question 9

Les effets bénéfiques d’un support multimédia sont plus importants

pour les apprenants avec des connaissances préalables élevées

pour les apprenants avec des connaissances préalables peu élevées

pour les apprenants avec des capacités de visualisation spatiale élevées

pour les apprenants avec des capacités de visualisation spatiale peu élevées

connaissances préalables peu élevées, en effet ceux qui ont déjà des connaissances sur le sujet peuvent
compenser le défauts d’un support moins efficace par leurs conaissances.
Les effets bénéfiques d’un support multimédia sont plus importants pour les apprenants avec des capacités
de visualisation spatiale élevées, car ces capacités sont nécessaire à la compréhension d’un document qui
utilise plusieurs médias.
44

Quiz

Question 10

Pour une meilleur compréhension, les illustrations doivent

Etre accompagnés par le discours d’une mascotte

Apparaitre en même temps que leur équivalent textuel

Etre indicées

Être physiquement proches de leur équivalent textuel

45

Quiz

Question 10

Pour une meilleur compréhension, les illustrations doivent

Etre accompagnées par le discours d’une mascotte

Apparaitre en même temps que leur équivalent textuel

Etre indicées

Être physiquement proches de leur équivalent textuel

Pour une meilleur compréhension, les illustrations doivent être accompagnés d’un discours oral (pas
forcément une mascotte), apparaitre en même temps que leur équivalent textuel, être indicées et être
physiquement proches de leur équivalent textuel.

46

Guide ergonomie des modules e learning et apprentissages multimédia

Contenu connexe

En vedette

Guide ergonomie des modules e learning et apprentissages multimédia