[Introduction] [Un projet européen ] [Un site internet ] [Les réalisations ] ["e-learning toolbox" ] [Création d'une association ] [Conclusion]

Développement d'une "e-learning toolbox"

La réalisation de telles ressources multimédia, en particulier celles présentant une interactivité élevée nécessite la mobilisation d’une force de travail considérable. De la première esquisse d’un projet, née de l'imagination d'un enseignant désireux d'exploiter le potentiel des TIC pour expliquer au mieux un concept physique à la finalisation de la ressource correspondante, le chemin est long, laborieux et semé de difficultés techniques :

  1. scénarisation de la ressource (écriture du texte, découpage des pages, définition des animations)


Figure 8a. Le travail de scénarisation d'une ressource pédagogique.

  1. saisie informatique du texte et des équations


Figure 8b. La saisie informatique du texte et des équations.

  1. transfert sous format HTML et traitement spécifique des équations (génération de fichiers images)


Figure 8c. Génération des équations sous format "gif".

  1. création des figures, prises de vue (photos et vidéos)


Figure 8d. Création des figures.

  1. création d'une version imprimable (sous format PDF par exemple)


Figure 8e. Création d'une version imprimable.

  1. programmation des animations


Figure 8e. Programmation des animations.

  1. finalisation de la page, gestion de la navigation entre les pages et leur intégration dans le site.

 

La réalisation de chacune de ces étapes suppose la maîtrise de méthodes et outils informatiques spécifiques.  Une première difficulté rencontrée lors du projet "e-LEE" était d'apporter un support technique aux enseignants partenaires du projet, qui ne disposaient pas forcément de compétences pointues en informatique. 

La coordination du travail entre plusieurs équipes d'enseignants et de développeurs et l’intégration des ressources en un site unique et cohérent constituait un défi supplémentaire. Il paraissait en effet indispensable de retrouver d’une ressource à l’autre un style graphique qui donne l’impression d’un site unique et non d'une multiplicité de réalisations disparates. Mais davantage que cela, il fallait organiser la navigation au sein du site de façon cohérente, efficace et conviviale, tout en prévoyant les possibilités d’évolution du site.

L'approche proposée a été celle de la constitution et du partage d'une "e-learning toolbox" en vue de faciliter pour les enseignants le développement de leurs propres ressources.  Le travail en coopération a permis à chaque partenaire de s’investir dans la prise en main approfondie de certains de ces outils et de se contenter, pour le reste, des outils d'aide proposés par d'autres équipes de développeurs.   

L'utilisation des ces outils doit permettre la réalisation des tâches les plus basiques en suivant à la lettre les instructions fournies (fiches de documentation).  Cette approche, à savoir permettre à des personnes qui ne sont pas forcément des spécialistes informatiques de réaliser par eux-mêmes l’essentiel des ressources multimédia, a été validée en confiant cette réalisation à des étudiants de génie électrique de HEI effectuant un travail de fin d’études. La plupart néophytes en programmation Java, ils se sont, en quelques mois, montrés capables de réaliser des ressources pédagogique comprenant des applets interactives et s’intégrant dans le site.

La "e-learning toolbox" a donc été conçue et développée en vue de faciliter le développement par les enseignants de leurs propres ressources pédagogiques et leur intégration sur le site. Cette section détaille l'ensemble des méthodes et outils informatiques que constitue cette boîte à outils d'aide à la conception de ressources.

Modèles de pages

La nécessité de définir une charte graphique et des principes de navigation cohérents à travers tout le site est rapidement apparue :

  1. la définition et le respect d'une charte graphique permet de conserver une certaine unité à travers toutes les pages du site, quelle que soit l'équipe qui en a assuré le développement ;
  2. un modèle de navigation cohérent a été défini, organisé sur 4 niveaux : thématiques, chapitres, éventuellement subdivisés en sections et enfin les ressources elles-mêmes (exposés, laboratoires, exercices, qcm). Seule la navigation au sein même d'une ressource est laissée à la libre appréciation de son concepteur. De la sorte, l'internaute retrouve une structure identique à travers les différentes thématiques développées, qui lui évite le sentiment de "se perdre" à travers les pages du site.


Figure 9. Définition des principes de navigation dans le site.

Cette charte et ces principes de navigation sont mis en œuvre concrètement par l'application de "Templates" ou "Modèles de page" proposé par le logiciel Dreamweaver (utilisé pour la création de pages Web). Il s'agit d'un type spécial de document qui sert à concevoir une mise en page "fixe". Certaines zones sont définies comme modifiables dans les documents basés sur ce modèle. Le reste de la page, en l'occurrence les menus de navigation à travers le site et la définition d'une "feuille de style" qui gère la mise en forme des pages (polices, etc.) ne peuvent être modifiés par les différents développeurs. Seul le titre de la page, son contenu et la navigation "interne" à travers les pages d'une ressource sont modifiables.

Figure 10a. Création de modèles de page.


Figure 10b. Application d'un modèle de page.

Moteur de recherche

Google offre gratuitement aux institutions d'éducation et aux organisations sans but lucratif de disposer d'un moteur de recherche à travers leur propre site.
L'inscription du domaine "www.e-lee.net" a permis de configurer un moteur de recherche performant à travers les pages du site, qui propose aux internautes le confort mais surtout l'efficacité des recherches Google.
En moins d'une seconde s'affiche une liste de pages correspondantes à la requête encodée par l'internaute. Cette recherche se fait, au choix de l'utilisateur, uniquement dans le domaine www.e-lee.net ou à travers tout l'internet. L'indexation du contenu du site est géré par Google, et mis à jour environ une fois par mois.
Un lien permet d'accéder depuis chaque page du site à ce moteur de recherche. Ce lien est automatiquement généré lors de l'application des modèles de pages (cfr § 5.1) sans que le développeur de la page doive configurer quoi que ce soit.

Figure 11. Le moteur de recherche sur le site "www.e-lee.net".

Questionnaires d'auto-évaluation

Une application (en langage XML) a été programmée pour permettre à un enseignant de développer des modules d'auto-évaluation sous forme de questionnaires à choix multiple (QCM). Cette application se différencie des logiciels présents sur le marché car elle gère des problèmes propres à la publication scientifique et permet l'intégration au sein de ces QCM de graphes, d'équations, de figures, etc.
Le XML (eXtensible Markup Language) est une sorte de langage HTML amélioré, qui permet de définir de nouvelles balises.
L'application que nous avons développée pour la génération de QCM fait appel à plusieurs fichiers, dont :

  1. une "grammaire", qui définit les balises pouvant être utilisées, ainsi que leurs attributs et l'imbrication des éléments possibles
  2. des fichiers de traitement de l'information contenue dans le QCM.

Le contenu de ces fichiers ne change pas.

Le professeur qui souhaite développer un QCM doit créer un fichier ".xml" qui répond aux règles définies dans la grammaire. Le contenu de ce fichier est constitué d'une hiérarchie de balises comportant des attributs.
Par exemple, la définition d'une question se définit par la balise <question>. On peut définir des questions à choix multiple, avec une seule ou plusieurs bonnes réponses possibles. Un deuxième attribut permet de définir la langue dans laquelle est rédigée la question. Il est possible d'intégrer des images (figures et/ou équations) dans l'intitulé de la question et des réponses. Les balises <reponse> se placent dans une balise <question>. L'attribution des valeurs "true" ou "false" à l'attribut "value" permet de définir les bonnes et les mauvaises réponses. L'enseignant a la possibilité de pondérer les questions pour le calcul du score final.

L'enseignant doit également créer deux pages HTML (l'une pour le QCM et l'autre pour le corrigé). Ces pages contiennent seulement l'appel à la fonction javascript qui permet la traduction du XML en HTML. Seuls deux paramètres doivent être précisés par l'enseignant : la langue dans laquelle afficher le questionnaire et le choix d'un calcul du score avec ou sans malus (points négatifs ou non dans le cas de réponse erronée).

L'internaute visualise la page du questionnaire, répond aux questions et valide le QCM. La page de correction se charge alors automatiquement.  Elle permet à l'étudiant de visualiser sa/ses réponses (bonnes ou mauvaises), la/les bonnes réponses, le calcul de son score et lui donne accès à une explication de la réponse (si prévue par l'enseignant).

Figure 12. Page de correction d'un QCM.

Les sources java

Les applets sont des programmes écrits en langage java, encapsulés dans une page HTML. L'exécution de ce code java se fait via la "machine virtuelle" contenue dans les navigateurs compatibles (tel Microsoft Internet Explorer, Netscape ou Mozilla). Les étudiants peuvent donc, en salle didactique ou depuis leur ordinateur personnel, visualiser ces animations grâce à un simple navigateur internet, sans l'installation d'aucun programme spécifique.

Les sources java développées par les différentes équipes sont mises en commun. Une série de classes graphiques ont été programmées qui permettent l'affichage de graphes, de primitives graphiques telles que des vecteurs, phaseurs, amplitudes d'harmoniques, etc. mais également la gestion de fenêtres graphiques (rafraîchissement d'écrans, zoom, …) permettent un développement plus rapide et plus aisé de nouvelles animations, même par des développeurs non spécialistes de la programmation java.

Figure 13a. Mise en commun des classes graphiques.
Ces classes sont, dans la mesure du possible, documentées : définition des variables, des méthodes (arguments et valeur retournée par la méthode).

Figure 13b. Documentation des sources java.

Le simulateur

En ce qui concerne les simulations, un algorithme est proposé, qui modélise les circuits électriques par la méthode de la topologie pseudo-variable développée l'UCL [6],[7]. L’analyse de la topologie du système est effectuée selon une procédure proche de celle utilisée en mécanique multicorps et permet de gérer automatiquement les changements de topologie liés à la commutation des interrupteurs électronique de puissance.
La traduction de cet algorithme en java est en cours de développement, une version beta (bibliothèque de composants réduite, certaines configurations non encore traitées dans l'algorithme) est disponible pour les partenaires du projet.

 Les fiches de documentation

Des fiches de documentation sont régulièrement proposées sur le site. Elles permettent au développeur néophyte de s'initier rapidement aux méthodes et outils développés dans la "e-learning toolbox". 
Dans la mesure du possible, elles privilégient une approche "pas-à-pas" et tentent de répondre aux questions "classiques" que se posent les enseignants qui commencent à développer des ressources multimédia.

Figure 14. Les fiches de documentation.

L'hébergement du site

Enfin, l'hébergement des pages développées par les différentes équipes est géré par le coordinateur du projet (UCL), leur épargnant ainsi tous les problèmes liés à la gestion d'un site.
La structure finale du site ayant été planifiée au début du projet, les différentes versions du site, soit la traduction dans les différentes langues, ont été distinguées à la racine du répertoire. Les fichiers et répertoires ont été organisés suivant une structure hiérarchisée, identique dans les différentes versions. Chaque équipe de développeur a alors pris en main la gestion d'une (ou plusieurs) langue(s) du site.
Le programme Dreamweaver comprend une série de fonctions permettant de gérer un site et de transférer les fichiers depuis et vers un serveur distant. De cette façon, les différentes équipes peuvent récupérer les ressources développées par d'autres en vue d'en faire la traduction/adaptation. Ils peuvent également copier facilement et directement les fichiers des ressources qu'ils ont développées sur le serveur de l'UCL, au moyen du protocole FTP.
 Figure 15. Gestion de site à distance dans Dreamweaver.