Rapport de l'exercice 3
Date de publication : 24 novembre 2024
Auteur : Dylan Tschiderer
Préambule
Pour ce travail, j’ai eu une approche progressive et structurée afin de concevoir un dispositif éducatif interactif à destination d’un jeune public, en particulier des enfants d’environ 10 ans. L’objectif principal était de créer une application qui non seulement transmette des connaissances sur les couches terrestres, mais qui soit aussi engageante et motivante grâce à des interactions dynamiques et un design attrayant.
Mes ressources et ma bibliographie ont joué un rôle central dans ce processus. Elles ont été utilisées à la fois comme sources d’information, fournissant les bases théoriques nécessaires pour concevoir les contenus éducatifs, et comme objets de création, permettant de développer des éléments interactifs et visuels adaptés au dispositif. Cette double utilisation a permis d’assurer une cohérence entre le contenu pédagogique et les fonctionnalités interactives, tout en garantissant une expérience utilisateur de qualité.
Un dispositif interactif pour atteindre les objectifs pédagogiques
L’ensemble des interactions prévues dans ce dispositif – du quiz interactif à la page informative – a été pensé pour répondre aux besoins éducatifs et ludiques des enfants. Ces fonctionnalités permettent de lier directement la théorie (présentée dans une interface claire et visuelle) à la pratique (avec un système d’engagement basé sur des scores et des indices). Chaque clic, réponse ou exploration renforce la mémorisation en rendant l’apprentissage actif et stimulant.
Des fonctionnalités au service de l’apprentissage
En permettant aux utilisateurs de manipuler les informations directement à travers des quiz, des indices et des objectifs clairs, le dispositif invite à explorer et apprendre de manière autonome. Ces interactions facilitent une navigation intuitive et assurent que les enfants comprennent rapidement ce qui est attendu d’eux. Ainsi, les fonctionnalités interactives ne sont pas de simples outils, mais de véritables leviers pédagogiques pour capter l’attention et maintenir l’intérêt tout au long du parcours.
Tous ces aspects, ainsi que les détails des fonctionnalités, des interactions et des réflexions pédagogiques, sont expliqués plus en détail dans les rubriques suivantes du rapport.
Liens
Voici les éléments du troisième exercice :
Objectifs
Objectif principal
Le dispositif vise à enseigner les couches terrestres de manière ludique et accessible aux d’une dizaine d’années. Le but est de permettre aux utilisateurs de mémoriser les différentes couches grâce à un processus interactif mêlant exploration et jeu. J’ai cherché à résoudre deux problématiques éducatives majeures : comment capter l’attention d’un jeune public et comment favoriser une mémorisation efficace tout en rendant l’expérience agréable.
Fonctionnalités éducatives
Concrètement, l’application sert à identifier et à comprendre les différentes couches terrestres, comme la croûte, le manteau ou le noyau. Ces informations sont présentées de façon concise et visuelle sur une page informative. Les connaissances ainsi acquises sont ensuite mises à l’épreuve dans un quiz dynamique qui stimule la réflexion et la curiosité des enfants.
Design
Utilisation et objectifs pédagogiques
Le dispositif est conçu pour être utilisé dans des contextes variés : en classe pour accompagner un cours de géologie, à la maison pour un apprentissage autonome ou comme une activité ludique dans un cadre éducatif. Aucun prérequis majeur n’est nécessaire, car tout le contenu essentiel est présenté dans l’application elle-même. L’objectif pédagogique est que les utilisateurs, à la fin de l’exercice, soient capables d’identifier chaque couche terrestre et de comprendre leurs caractéristiques principales.
Système de score et motivation
J’ai volontairement remplacé les contraintes temporelles par un système de score afin de réduire le stress souvent associé aux quiz chronométrés. Cette décision a été guidée par les retours obtenus lors de tests avec des enfants : ils ont apprécié l’aspect récompense et progression du score, ce qui les a davantage motivés à s’investir.
Structure et interactivité
La conception du dispositif repose sur un design pédagogique et ergonomique qui répond aux besoins d’un jeune public. J’ai divisé l’application en deux parties principales pour clarifier son usage et offrir une expérience structurée. La première partie est une page informative, où les couches terrestres sont présentées avec des descriptions simples et des éléments visuels attrayants. Cette section prépare l’utilisateur en fournissant un contexte clair et accessible. La seconde partie est un quiz interactif qui met à l’épreuve les connaissances acquises tout en maintenant un haut niveau d’engagement grâce à des interactions dynamiques (réinitialisation du score, atteindre les 50 points afin de faire apparaître le message de félicitations, ainsi que l'ajout d'un indice selon le choix de l'utilisateur).
Fonctionnement du quiz
Le quiz est construit pour être intuitif et motivant. Chaque question est accompagnée d’un indice optionnel, qui peut être affiché en cas de besoin. L’utilisateur avance dans le quiz en répondant correctement, et chaque réponse juste est récompensée par une augmentation du score. En cas d’erreur, le score est légèrement pénalisé, ce qui encourage une réflexion attentive sans décourager. Le seuil de 50 points, correspondant à la réussite complète du quiz, sert de but clair et atteignable.
Optimisation et navigation
Le design a également été optimisé pour résoudre des problèmes techniques et améliorer l’expérience utilisateur. Initialement, le dispositif combinait les éléments informatifs et le quiz sur une même page, mais cela créait des difficultés d’affichage et une surcharge cognitive. En scindant les deux parties, j’ai pu simplifier la navigation et rendre chaque section plus lisible. Les couleurs et les polices utilisées ont été choisies pour garantir une lisibilité maximale et un attrait visuel pour les enfants. Les images proviennent d'une image du site Coloringlib.com, mais elles ont été entièrement modifiées pour répondre aux besoins spécifiques du dispositif, offrant ainsi une personnalisation visuelle tout en respectant l'utilisation de cette image. (Je suis resté dans l'idée du site de colorier, mais avec le logiciel Inkscape). L'image avec toutes les couches coloriées est accompagnée d'une dénomination de chaque couche avec une flèche.
Clarté et expérience utilisateur
Enfin, j’ai veillé à optimiser le code en privilégiant une approche minimaliste et fonctionnelle. L’objectif n’était pas uniquement de respecter des principes de sobriété numérique, mais surtout de simplifier l’utilisation en évitant une surcharge d’éléments superflus qui pourraient nuire à la lisibilité et à l’efficacité de l’application. Cette démarche permet d’assurer une navigation fluide et intuitive, tout en concentrant l’expérience utilisateur sur les fonctionnalités essentielles.
De plus, j’ai accordé une attention particulière à la clarté des attentes pour l’utilisateur. Par exemple, dans la page informative, il est immédiatement évident qu’il existe cinq couches terrestres, chacune étant accessible directement. L’utilisateur peut cliquer sur ces couches pour obtenir l’essentiel des informations, sans avoir à chercher ou à naviguer inutilement dans toute la page. Ce principe garantit une expérience simple et centrée sur les besoins, tout en réduisant le risque de confusion ou de désorientation.
Production
Idée initiale et refonte du concept
La création du dispositif a été un processus itératif avec plusieurs étapes majeures. Mon idée initiale portait sur la chaîne alimentaire, mais cette approche nécessitait un design basé sur des interactions de type "drag and drop", ce qui ne correspondait pas aux objectifs. J’ai alors repensé le concept pour me concentrer sur les couches terrestres, un sujet qui pouvait être mieux adapté à un quiz interactif.
Processus itératif et apprentissage
Le processus de production a impliqué plusieurs refontes complètes du code et du design. J’ai réécrit l’application à quatre reprises, chaque version cherchant à simplifier et à optimiser le code. Une grande partie de mon inspiration vient de ce que j’ai réalisé pour les enfants lors de mes cours d’appui. En leur enseignant, j’apprenais également, ce qui m’a permis de construire une application qui suit à la fois mon propre apprentissage et leurs besoins. Cela a rendu le processus particulièrement enrichissant, car je pouvais observer ma progression à travers les améliorations apportées au dispositif, malgré les erreurs et les obstacles rencontrés. Ces défis m’ont poussé à affiner mes compétences et à développer une approche plus réfléchie et adaptée.
Utilisation de l’algorithme de Fisher-Yates
J’ai utilisé l’algorithme de Fisher-Yates pour améliorer l’aléatoire au maximum dans mon application. Cet algorithme sert à mélanger aléatoirement les éléments d'une liste ou d'un tableau. Il garantit que chaque élément a la même chance de se retrouver à n'importe quelle position après le mélange. J’en avais entendu parler auparavant et j’ai profité de ce projet pour l’implémenter et approfondir mes connaissances à son sujet. Je me suis également inspiré d’une illustration trouvée sur un site, que j’ai référencé dans mon rapport, pour mieux comprendre son fonctionnement.
Voici comment l'algorithme fonctionne :
- Parcourir la liste à l'envers, en commençant par le dernier élément.
- Pour chaque élément, choisir une position aléatoire parmi celles qui n'ont pas encore été mélangées.
- Échanger l'élément actuel avec celui à la position choisie.
Ces efforts visaient à rendre l’application aussi efficace que possible tout en réduisant la charge cognitive des utilisateurs, en offrant une expérience plus fluide et équilibrée lors des interactions.
Navigation et continuité utilisateur
Une difficulté majeure était de concevoir un dispositif divisé en deux pages tout en maintenant une continuité dans l’expérience utilisateur. Cela m’a obligé à revoir entièrement le design de navigation, donc j’ai mis un bouton de retour à la page d’accueil.
Création des ressources visuelles
Une autre étape clé fut la création des ressources visuelles. J’ai utilisé des images provenant de Coloringlib.com, mais je les ai modifiées pour correspondre au contenu éducatif et les adapter à un public jeune. Ces images, accompagnées de descriptions et d’indices, enrichissent l’expérience utilisateur et facilitent l’apprentissage.
Comme expliqué dans la section Design, cette étape a également été très productive, car elle mêle le côté visuel et pratique avec l’apprentissage et la création du système interactif. Cependant, cela m’a pris beaucoup de temps, car j’ai adopté une méthodologie spécifique : je remplissais d’abord entièrement les couches avec des couleurs, puis je supprimais progressivement chaque couche colorée en la remplaçant par du blanc. J’ai répété cette opération pour chaque couche, ce qui impliquait de nombreux retours en arrière et des vérifications régulières pour m’assurer qu’il n’y avait pas de doublons et que les couleurs des couches correspondaient bien à l’image complète. Cette approche, bien que laborieuse, a permis de garantir un rendu final cohérent et clair pour les utilisateurs.
Auto-évaluation
Points forts
Le dispositif présente plusieurs points forts. Il est engageant et intuitif, avec un design adapté à un jeune public. Le quiz est particulièrement efficace pour motiver les enfants, grâce au système de score qui valorise leurs efforts et leur progression de manière ludique. L’ajout d’indices rend l’expérience accessible à tous les niveaux, permettant aux enfants de bénéficier d’un apprentissage progressif sans frustration excessive. De plus, la page informative offre une base solide pour acquérir les connaissances nécessaires avant de tester leurs compétences dans le quiz, ce qui structure l’apprentissage de façon logique et efficace.
Le choix d’un design clair, associé à des fonctionnalités interactives, permet aux enfants de comprendre rapidement les attentes et de naviguer facilement entre les différentes sections. Cette simplicité, combinée à des éléments visuels attrayants, renforce l’expérience utilisateur et favorise l’engagement.
Limites et axes d'amélioration
Cependant, certaines limites subsistent. Par exemple, l’absence de niveaux de difficulté ou de fonctionnalités supplémentaires, comme un mode exploration libre, réduit légèrement la profondeur du dispositif. Ajouter une progression par étapes, adaptée aux compétences des utilisateurs, aurait permis de répondre à un éventail plus large de besoins éducatifs.
De plus, bien que fonctionnel, le design visuel pourrait être enrichi par des animations ou des transitions plus immersives, ce qui rendrait l’expérience encore plus engageante pour les enfants. Cela pourrait inclure des effets visuels pour les bonnes réponses ou des animations soulignant les progrès dans le quiz. Bien que le dispositif ait été testé avec succès auprès de quatre enfants, des tests supplémentaires auprès d’un public plus large, incluant des groupes diversifiés, auraient permis d’affiner davantage l’expérience utilisateur.
Pour améliorer ce dispositif, il serait intéressant d’ajouter plusieurs fonctionnalités :
- Un tableau de scores, permettant aux utilisateurs de comparer leurs résultats ou de suivre leurs progrès au fil du temps.
- Un mode “contre la montre”, introduisant une dynamique compétitive pour ceux qui recherchent des défis plus stimulants.
- Un système de suivi des performances, permettant aux parents ou aux enseignants d’avoir un récapitulatif des erreurs et des progrès, par exemple pour identifier quelles couches terrestres posent problème.
Une autre idée serait d’introduire un système de notation basé sur un pourcentage de points, permettant d’afficher une note à la fin du quiz. Cette note offrirait un retour immédiat et clair sur la performance globale de l’utilisateur.
Réflexion personnelle
Cet exercice m’a permis de réaliser à quel point il peut être complexe de concevoir un tel dispositif éducatif. Bien que je me sois appuyé sur plusieurs ressources – comme les sites dédiés à l’algorithme de Fisher-Yates, EduTechWiki, ou encore l’aide apportée par ChatGPT – j’ai constaté que 90 % du travail repose sur une réflexion personnelle approfondie. La théorie et les exemples fournis par ces sources sont utiles, mais leur application nécessite une adaptation constante et des ajustements pour répondre aux besoins spécifiques du projet.
Par exemple, la création d’un bouton pour réinitialiser le score m’a demandé beaucoup d’efforts et de réflexion. Ce qui semblait au départ une tâche simple s’est avéré complexe, et j’ai dû explorer plusieurs approches avant de trouver une solution satisfaisante. Ce genre de défis a littéralement "surchauffé mon crâne", mais ils m’ont aussi permis de progresser dans ma maîtrise du code et de la conception interactive.
J’ai également changé plusieurs fois de thématique au cours du développement – explorant la biologie, la géographie, les mathématiques (qui sera mon thème pour l’exercice 4), et enfin la géologie. Ces changements m’ont poussé à élargir mes perspectives et à m’adapter rapidement, ce qui s’est avéré enrichissant sur le plan personnel et éducatif.
Impact personnel et éducatif
Au-delà de sa finalité pédagogique, ce projet a eu un impact concret dans ma vie quotidienne. J’ai intégré certaines idées développées dans ce dispositif aux cours d’appui que je donne chaque semaine à 13 enfants. Cela m’a permis de proposer des activités plus engageantes et interactives, tout en apportant un soutien éducatif précieux aux parents. Ces contributions comptent énormément pour moi, car elles donnent un sens concret et humain à ce projet.
Accompagner ces enfants m’a également permis de tester directement certaines fonctionnalités et d’observer leurs réactions. J’ai pu constater à quel point un design clair et un apprentissage structuré peuvent réellement faire la différence, en rendant les concepts plus accessibles et motivants. Ce lien entre la conception numérique et l’application concrète dans un cadre éducatif est quelque chose que je souhaite approfondir à l’avenir.
Bibliographie
La création de ce dispositif s’est appuyée sur plusieurs ressources, notamment un site pour l’utilisation de l’algorithme de Fisher-Yates et la documentation EduTechWiki JavaScript pour l’optimisation du code. Concernant les couches terrestres, cela provient des cours de répétitoire que je donne, car je connais bien le sujet.
Enfin, les images utilisées proviennent du site Coloringlib.com, et elles ont été modifiées pour répondre aux besoins spécifiques de l’application.
De plus, je me suis également inspiré des exercices que j’ai développés sur ma page personnelle, qui incluent des activités éducatives en mathématiques et en français. Ces exercices, accessibles via mon site à l’adresse suivante : Exercices Mathématiques et Français, ont servi de base pour enrichir la conception de ce dispositif et adapter les contenus aux besoins des enfants.
Ressources
Les ressources utilisées pour ce projet incluent principalement des images, des outils de conception graphique, des tutoriels et des articles techniques. Chaque ressource a été soigneusement sélectionnée pour garantir sa pertinence et sa compatibilité avec les objectifs pédagogiques et éducatifs de l’application. Voici les détails :
Images pour les couches terrestres
Les images utilisées proviennent du site Coloring Lib (Coloring Lib - Layers of the Earth), un site dédié au coloriage. Ces images ont été modifiées avec le logiciel Inkscape pour mieux répondre aux besoins du projet, notamment en termes de personnalisation et d’intégration dans le dispositif. Les modifications ont également permis de respecter les exigences éducatives et visuelles du contenu.
Tutoriels sur JavaScript et interactivité
Je me suis appuyé sur plusieurs tutoriels techniques pour concevoir et optimiser le dispositif interactif :
- EduTechWiki - Interactivité avec JavaScript : Ce tutoriel m’a aidé à concevoir les interactions et à structurer les fonctionnalités dynamiques de l’application.
- EduTechWiki - Computation avec JavaScript : Cette ressource a été précieuse pour comprendre les calculs nécessaires au système de score et à d’autres logiques interactives.
Algorithme de Fisher-Yates
L’algorithme de Fisher-Yates a été utilisé pour mélanger les réponses dans le quiz de manière aléatoire et équitable. J’ai consulté les ressources suivantes pour implémenter cet algorithme en JavaScript :
- Stackfame - 5 Ways to Shuffle an Array using Modern JavaScript (ES6) : Cet article m’a fourni plusieurs approches modernes pour mélanger efficacement des tableaux.
Support de ChatGPT
J’ai également utilisé ChatGPT pour clarifier certains concepts techniques, affiner le code JavaScript et améliorer la structure de ce rapport. Cela m’a permis de résoudre rapidement certains problèmes et d’optimiser le processus de production.
Exercices créés pour les enfants
Une source d’inspiration importante a été les exercices pédagogiques que j’ai développés en mathématiques et en français. Ces activités sont accessibles sur ma page personnelle. La création de ces exercices m’a permis d’approfondir mes compétences en pédagogie et en conception interactive, tout en répondant aux besoins spécifiques des enfants. En travaillant sur ces contenus, j’ai pu expérimenter différentes approches pour rendre l’apprentissage plus ludique et engageant, ce qui a directement influencé la conception de ce dispositif.
Normes APA
Les ressources utilisées pour ce projet incluent des images, des outils de conception graphique, des tutoriels et des articles techniques, référencés selon les normes APA.
- Coloring Lib. (n.d.). Free Printable Layers of Earth Coloring Page. Consulté le 5 novembre 2024.
- EduTechWiki. (2023). Computation avec JavaScript. Consulté le 5 novembre 2024.
- EduTechWiki. (2024). Interactivité avec JavaScript. Consulté le 5 novembre 2024.
- Inkscape. (n.d.). Vector Graphics Software. Consulté le 5 novembre 2024.
- OpenAI. (2024). ChatGPT : Support technique et éducatif. Consulté le 5 novembre 2024.
- Stackfame. (2020). 5 ways to shuffle an array using modern JavaScript (ES6). Consulté le 5 novembre 2024.
- Tschiderer, D. (2024). Exercices pédagogiques : Mathématiques et Français. Consulté le 5 novembre 2024.
Toutes les références ont été consultées le 5 novembre 2024.