Exercice 6 - Dispositif d'apprentissage interactif intégrant des bibliothèques externes
Liens
Dispositif interactif: "Raconte-moi une histoire"
Objectifs
Le dispositif "Raconte-moi une histoire" s'adresse à des élèves francophones lecteurs de 5P à 6P. Il a été réfléchi en lien avec le Plan d'Etude Romand et plus spécifiquement, l'objectif de français L1 24 qui traite de la production de textes oraux variés propres à des situations de vie courante. Il s'agit de travailler le "texte qui raconte" dans le but d'organiser un récit dans un ordre chronologique. Cet objectif général travaille différents objectifs spécifiques:
- Créer individuellement un récit inventé en tenant compte du schéma narratif simple (situation initiale, complication, actions, résolution, situation finale)
- Utiliser des organisateurs de récits
- S'exprimer de manière expressive et fluide
- Gérer son temps de parole
"Raconte-moi une histoire" est pensé pour être utilisé dans le cadre scolaire. Le dispositif peut être proposé comme activité d'introduction et/ou de consolidation des acquis. Dans le premier cas, les élèves se racontent librement une histoire. Puis, l'enseignant construit un apport théorique sur ses observations et introduit le schéma narratif, les organisateurs de récits ainsi que les possibilités d'expression. Dans un deuxième temps, le dispositif peut consolider ces mêmes éléments en proposant aux élèves d'utiliser des organisateurs de récits à l'aide, par exemple, d'un aide-mémoire papier.
Le dispositif s'utilise à deux: un élève narrateur et un élève public. Le premier raconte l'histoire; le deuxième l'écoute et manipule la souris. Un chronomètre permet aux élèves de prendre note du temps de parole.
Différents prérequis sont nécessaires afin d'utiliser cette application. Concernant l'acquisition de la langue, les élèves doivent savoir lire le français et structurer leur pensées en phrases. D'un point de vue des compétences techniques, il est nécessaire de savoir manipuler la souris.
Design
Description
"Raconte-moi une histoire" est inspiré des jeux Story's Cubes et Comment j'ai adopté un gnou. Il s'utilise depuis une page internet. A son ouverture, les élèves voient une galerie d'images dont seule une image est visible. Ces images sont choisies au hasard parmi des images prédéfinies. Sous la galerie, des points représentent le nombre d'images total à visionner. Sur la droite de la galerie se situe un carré bleu clair représentant un dé. Celui-ci peut être cliqué par l'élève public afin de faire apparaître une phrase au hasard et intervenir ainsi dans l'histoire. Sous ce dé, un chronomètre avec les boutons "play", "pause" et "recommencer" permet de chronométrer la durée du texte raconté. Au top départ, l'élève public lance le chronomètre et l'élève narrateur commence son histoire. L'élève public est responsable de faire défiler les images en cliquant sur les flèches de la galerie. Arrivé au terme, un bouton "nouvelle histoire" situé en-dessous de la galerie permet de charger de nouvelles images et de recommencer l'activité.
Explications
L'utilisation de la galerie permet d'aider les élèves à structurer leur récit. En effet, les deux premières images sont destinées à poser une situation initiale (personnage & environnement). La troisième et la quatrième proposent respectivement une complication puis une action. La quatrième aide à trouver une solution pour enfin arriver, grâce à la sixième image, à une situation finale. De plus, les points sous la galerie permettent à l'élève de se situer dans l'avancement de son histoire.
Le chronomètre travaille l'objectif de la gestion du temps et de la longueur du récit. Il a notamment pour objectif de personnaliser les apprentissages. Ainsi, l'enseignant peut encourager un élève à davantage expliquer sa pensée (raconcte-moi une histoire de 2 minutes minimum) ou, au contraire, à synthétiser ses propos (raconte-moi une histoire en 45 secondes!)
Le dé est directement inspiré du jeu Comment j'ai adopté un gnou et poursuit un objectif ludique et engageant. Il permet d'ajouter du plaisir à l'activité et de lier ainsi émotions positives et apprentissage tout en visant à motiver l'élève public à écouter et à participer à l'activité.
Enfin, laisser la manipulation de la souris à l'élève public permet à l'élève narrateur de focaliser son attention sur le récit et de diminuer ainsi sa charge cognitive.
Production
La production a commencé par une exploration des bibliothèques Javascript sur javascripting.com. Après avoir trouvé ce qui me convenait, j'ai créé une simple page HTML à laquelle j'ai lié les fichiers bibliothèques. J'ai tout d'abord travaillé sur la galerie d'images avec Flickity , puis sur le chronomètre avec Easytimer. Une fois cette mécanique en place, j'ai ajouté l'affichage aléatoire des images et des phrases du dé. Pour finir, j'ai retravaillé la mise en page en utilisant notamment un "grid". La dernière étape a été d'ajouter le bouton "nouvelle histoire" afin de pouvoir recharger la page avec de nouvelles images.
Autoévaluation
De manière générale, le dispositif fonctionne. Concernant les images, un travail supplémentaire pourrait être effectué afin qu'elles correspondent davantage à la structure d'un récit. D'un point de vue pédagogique, l'activité mériterait d'être testée afin d'observer la réaction des élèves. En effet, laisser le contrôle du défilement des images à l'élève public pourrait influer négativement sur le travail des objectifs pédagogiques étant donné que l'élève narrateur n'est plus maître du rythme de sa propre histoire. S'adapter au rythme de l'autre est une compétence complexe que certains élèves de 5-6P pourraient peiner à maîtriser. Dans la même idée, la composante ludique amenée par le dé aléatoire pourrait perturber les élèves notamment si le dé est utilisé trop fréquemment. Pour pallier cela, l'enseignant peut proposer d'utiliser le dé deux fois au maximum. Ceci pourrait également être inclus dans le code Javascript.
L'utilisation des éléments externes m'a permis de proposer une interactivité allant au-delà de mes compétences en Javascript et CSS. La bibliothèque Flickity est documentée de manière précise ce qui a favorisé une mise en place rapide et agréable. Son avantage réside dans sa facilité d'application pour un public peu habitué à l'utilisation de bibliothèques externes. En outre, les possibilité de présentation de galerie sont variées et s'adaptent ainsi à diverses situations. Concernant le chronomètre, sa mise en place a été plus laborieuse et a nécessité de l'aide extérieure. Une fois un problème de lien entre HTML et JS réglé, son utilisation a été facile. L'avantage de la bibliothèque Easytimer réside dans la diversité des chronomètres et timer disponibles.
En résumé, je constate avoir besoin de bibliothèques fortement et précisément documentées afin de pouvoir les utliser efficacement et sereinement.
Bibliographie
Idée inspirée des jeux Story's Cubes et Comment j'ai adopté un gnou
Forum pour le Reload Button
Validateurs CSS et HTML et Java Script.
Ressources
Images téléchargées depuis Needpix
Bilbiothèque easytimer.min.js consultée en janvier 2020.
Bilbiothèques flickity.css et flickity.pkgd.js consultées en janvier 2020.