Utilisation de Teleme

Teleme est un générateur de ressources pédagogiques interactives


Installation

Charger le fichier XPI

Téléchargez, depuis le campus numérique Epistemon, le fichier d'extension

teleme.xpi
Depuis Firefox choisissez Fichier/Ouvrir un fichier
puis sélectionnez ce fichier et valider. L'installation est automatique
Quitter puis relancer Firefox

Configuration du navigateur

Pour une meilleure ergonomie Télème utilise de plus en plus des menus contextuels.
Pour qu'ils n'entrent pas en conflit avec les menus contextuels par défaut il convient d'autoriser Télème à les désactiver dans les pages qu'il génère (et seulement celles-là).

Dans la barre de menu de Firefox choisissez: Edition > Préférences > Contenu
Sur la ligne "Activer le Javascript" qui doit être cochée, cliquer sur "Avancé"
Cocher "Autoriser les scripts à: Désactiver ou remplacer les menus contextuels"

Sous Firefox 3 !!!
Firefox 3 apporte des restrictions au chargement de fichiers XML locaux.
Dans le cadre de l'utilisation de Télème vous créez et modifiez des fichiers xml.
Pour permettre à Firefox 3 de le faire, tapez dans la barre d'adresse de Firefox3 "about:config".
Une boîte de dialogue apparaît qui vous demande de faire attention.
Cliquez pour dire que vous allez faire attention.
Pour aller plus vite, dans la barre de filtre tapez "security" puis faites un double-clic sur la ligne "security.fileuri.strict_origin_policy" afin de faire passer la valeur booléenne à false.
Note: Cette restriction est uniquement locale, elle n'affecte pas les fichiers Télème que vous mettez en ligne sur internet.

Activation de Teleme

Dans la barre d'outils de Firefox, allez dans le menu Outils et choisissez l'option Teleme
L'application Teleme s'ouvre dans un nouvel onglet


L'Interface Teleme

L'interface de Teleme comporte:

deux onglets:

deux boutons:
une étiquette indiquant le nouveau du fichier courant (ici "Nouveau").

Menu Fichiers

Ce menu contient les options suivantes:

Nouveau
Permet de créer une nouvelle séquence. Lors du premier test, il vous sera demandé de sauvegarder cette séquence sur le disque dur.
Ouvrir

Ce bouton ouvre une boîte de dialogue permettant d'aller choisir une fichier de séquence sur le disque dur. Par défaut la boîte de dialogue s'ouvre dans le même répertoire que le dernier fichier chargé. 


Enregistrer sous
Ce bouton ouvre la boîte de dialogue permettant d'aller sauvegarder la séquence pédagogique dans le répertoire de son choix.

Note 1: lors

Note 2: lors de la sauvegarde, en plus du fichier de séquence (extension.abi) trois fichiers spéciaux sont sauvegardés dans le même répertoire. Le fichier .l1.html.l2.html; teleme.html. Ce dernier fichier est un exécuteur de séquence pédagogique qui peut-être utilisé indépendament de l'extension Teleme. Il y a deux façons de lui indiquer avec quel fichier de séquence il doit être utilisé. 

Soit en le renommant pour lui donner le même nom que le fichier .abi correspondantc: test1.html appellera le fichier test1.abi.
Soit en l'appelant avec un argument "fichier": teleme.html?fichier=test1.abi appellera le même fichier.


Liste des fichiers récents

Cette liste comporte les dix dernières séquences sur lesquelles on a travaillé. Cette liste est mise à jour à chaque fois que l'on ouvre une séquence.


Aide

Appelle cette aide.


Onglet Créer/Modifier

C'est cet onglet qui est actif par défaut. En partie haute il présente la page de travail avec en partie une barre de menus, en partie basse la page de travail.

La page de travail


La page de travail permet de créer les différentes pages, ou écrans, qui composent la séquence pédagogique.

Menu de la page de travail :


Tester

Cet onglet permet d'utiliser la séquence dans les mêmes conditions que l'utilisateur final.
Lorsqu'on clique sur cet onglet, le fichier en cours d'élaboration est sauvegardé puis exécuté en activant directement la page en cours de développement dans l'autre onglet. L'onglet "Tester" remplace l'option habituelle "Enregistrer" en proposant en plus d'utiliser immédiatement ce que l'on vient de sauvegarder.

Note: lors de la création d'une nouvelle séquence, l'onglet "Tester" ne peut pas être utilisé tant qu'in n'a pas sauvegardé au moins une fois le fichier dans un répertoire donné (Enregistrer sous).

L'exécuteur contenu dans l'onglet "Tester" comporte une petite barre de navigation présentant les options suivantes:

Note: les paramètres définis sur la page d'entête peuvent influer sur la barre ci-dessus. L'option "Tout recommencer" peut-être absente si l'utilisation de la séquence a été voulue univoque (ce qui n'a de sens qu'au sein d'une plate-forme gèrant cette fonctionnalité). La barre de navigation peut-être aussi complètement absente, la séquence doit alors gèrer elle-même toute ses fonctions de navigation.

Composition d'une page

La composition d'une page (ou d'un écran) s'effectue:
Dans les deux cas le menu contextuel ci-dessous s'affiche.
Menu Contextuel.
Première colonne: les éléments qui peuvent être posés.
Deuxième colonne: les attributs qui peuvent modifiés.
nom: permet de repérer la page dans certaines fonctions spéciales.
couleur: couleur de fond de la page (voir plutôt couleur de fond dans l'entête)
image: image de fond de la page.
minuterie: temps laissé à l'usager pour interagir avec la page.
visible: page visible ou non pour l'usager. Une page invisible peut contenir un système expert ou d'autres données appelées par une fonction spéciale.
Troisième Colonne: les actions.
monter: rapproche la page du début de la séquence, descendre l'éloigne.


Les deux premiers éléments définissent des types de texte, les suivants des interactions.
A chaque élément correspond un menu propre qui peut être appelé en cliquant sur le bouton d'élément s'ils sont visibles ou contextuellement par un clic droit.

Titre


Elément textuel en couleur et grands caractères. A la création il contient le mot "Titre". On peut le modifier en cliquant dessus.
ou appeler le menu contextuel par un clic droit.


Consigne


Elément textuel en noir gras et caractères ordinaires. A la création il contient le mot "Consigne". On peut le modifier en cliquant dessus, ou appeler le menu contextuel par un clic droit.


Note: Il n'y a que deux éléments textes afin de ne pas encombrer le menu par une multitude de styles. Dans la pratique, chaque élément textuel peut être complètement reconfiguré par l'éditeur html.

Interactions

Tous les éléments textuels contenus dans les interactions se modifient selon le même principe qu'un titre ou une consigne (cf supra).

QCM: Questionnaire à choix multiples.


Le QCM est généré automatiquement avec un certain nombre de sous éléments minimaux: une question et deux réponses.
Question
Permet d'éditer le libellé de la question.
Réponse
Contient l'élément "choix" et, éventuellement, un commentaire.
Choix
Permet d'éditer le libellé d'une réponse donnée.

Menus contextuels correspondants:




Association.


Une interactivité d'association consiste à retrouver la correspondance d'éléments initialement dans le désordre. Cette opération se fait par "Glisser / Déposer". Une association est générée automatiquement avec deux paires d'éléments à mettre en correspondance. On peut en rajouter à volonté.
Paire
Une paire contient un élément "fixe" et un élément "glisse". Leur nom désigne leur comportement au moment de l'utilisation.
Fixe
C'est l'élement, qui, pour l'utilisateur final, constituera la cible vers laquelle glisser l'élément correspondant.
Glisse
C'est l'élément mobile que l'utilisateur devra glisser vers la cible.

Pratique:
Dans l'onglet "Créer/Modifier" tous les éléments (glisse et fixe) sont déplaçables. Lors de leur génération ils sont rangés et numérotés. Ils peuvent éventuellement venir recouvrir les boutons correspondants. (dans la barre de menu, les boutons "Jetons" et "Boutons" permettent modifier l'affichage.
Rajouter des paires = Cliquer sur le bouton association puis sur "Paire". Il est possible aussi de cliquer sur un bouton "paire" puis sur "dupliquer" mais c'est fortement déconseillé à des utilisateurs non avertis car générer des éléments identiques dans un contexte où la discrimination est essentielle est source de confusion et d'erreurs.
Méthodologie conseillée:
  1. Générer le nombre de paires souhaitées puis les ranger en face à face sur l'écran.
  2. Donner à chaque élément le contenu souhaité. (en cliquant dessus comme pour n'importe quel autre élément).
  3. Mettre les éléments dans la disposition proposée à l'utilisateur.
Un seul "fixe" et plusieurs "glisses". Il est possible de créer des paires dissymétriques avec un seul élément fixe et plusieurs éléments "glisse". Pour ce faire, cliquer sur le bouton "paire" concerné puis sur "glisse".
Mode d'appariement: en cliquant sur le bouton "Association" puis sur "position_cible" on peut définir la façon dont les éléments vont venir se ranger lors de leur mise en correspondance par l'utilisateur.
La position "adjacent" verra l'élément "glisse" se coller à droite de l'élement glisse.
La position "recouvert" verra l'élément "glisse" se superposer exactement à l'élement glisse à partir du coin supérieur gauche.
La position "centre" verra l'élément "glisse" se centrer au dessus de l'élement glisse.
Dans le cas d'éléments "glisse" multiples on veillera a prévoir un élément "fixe" suffisament grand. Les éléments "glisse" viendront s'afficher étagés en fonction de leur nombre et de la taile du "fixe" correspondant.
Le redimensionnement d'un "fixe" ou d'un "glisse", comme pour tous les calques, s'opère en plaçant le pointeur de la souris au milieu de l'élément puis en le déplaçant en maintenant le bouton droit de la souris enfoncé.

Plusieurs fixes et un seul glisse. Il est également possible de supprimer certains éléments "glisse" en laissant les "fixe" correspondants célibataires. L'utilisateur sera évalué lorsque toutes les associations possibles auront été réalisées.

Texte à trous.


Le texte à trous se définit trés simplement en tapant le texte et en plaçant les expressions à mettre en trou entre crochets.
Exemple: des p'tits [trous] des p'tits [trous] toujours des p'tits [trous]...
On peut aussi définir un trou comme un mini qcm. Taper pour cela chacune des options séparées par un / et faire précéder la bonne réponse d'une *.
Exemple: Rabelais était un [soldat/peintre/*médecin/navigateur] de la renaissance, mais c'était surtout un humaniste.
Note:Il est possible d'insérer des trous dans du texte html. Il faudra néanmoins faire trés attention à ce qu'aucun élément de balise html ne vienne s'insérer entre les crochets d'un trou, ce qui n'est pas toujours facile à voir à partir de l'éditeur html WISIWYG.

Réponse ouverte.

Cette interaction permet à l'utilisateur de taper librement une réponse. Cette réponse est mémorisée et modifiable tant qu'il ne quitte pas la séquence.
Deux sous éléments sont générés automatiquement:
  1. Question: destiné à recevoir la consigne.
  2. Zone d'écriture: emplacement où l'utilisateur pourra taper sa réponse. La taille de la zone d'écriture se définit en plaçant le pointeur de la souris sur la zone et en le déplaçant avec un clic droit maintenu.
Note: La zone d'écriture est destinée, lors de l'utilisation, à devenir une zone d'écriture en texte brut. Elle est a priori vide. Si l'on souhaite placer un texte d'invite, celui-ci ne doit pas comporter de code html, il serait affiché mais pas interprété.

Mots Croisés.

L'élément mots croisés se présente comme un élément ordinaire, comme pour les textes à trous, c'est la manière de saisir les données qui permet de définir le mot croisé.
Les données définissant le mot croisé se répartissent en trois zones séparées par des //

Exemple de codage d'une grille:

Système-Expert

l'interaction système-expert nécessite deux choses:
Les systèmes-experts étant un domaine assez complexe, un chapitre particulier leur est consacré.

Fonctions Spéciales (fragments de code spécifique)

Teleme commporte un certain nombre de fonctions spéciales qui peuvent être appelées à partir de fragments de codes inclus dans un élément textuel quelconque.
Toutes ces fonctions doivent s'inscrire dans une paire de doubles accolades ouvrantes et fermantes et obéissent à la syntaxe suivante: {{nom_de_fonction(arg1,...argn) texte_affiché}}

Aller à une page donnée:

{{aller(page,numéro_de_page)aller à la page n}}
Exemple: {{aller(page,10)Dixième page}}

Fichier son:

Le fichier son doit être au format mp3.

{{son(url)}}
Exemple: {{son(bonjour.mp3)}}

Afficher une Popup:

Une popup classique (passe en arrière plan quand elle perd le focus)
{{popup(url,hauteur,largeur)Texte du lien}}
Exemple: {{popup(aide.html,500,500)Consulter l'aide}}

Afficher une popup toujours visible.
popin 
(toujours visible tant qu'elle n'a pas été fermée)
{{popin(url,marge haute,marge gauche,hauteur,largeur)Texte du lien}}
Exemple: {{popin(aide.html,100,100,500,500)Consulter l'aide}}

Méthode de création d'une popin. (positionnement intuitif).
  1. Taper le code sans les paramètres de positionnement. ex: 
    {{popin(aide.html)Consulter l'aide.}}. Validez.
  2. Cliquez sur le nouveau lien "Consulter l'aide".
    La popin s'affiche à une position par défaut.
  3. Faites glisser la popin (clic gauche maintenu) à l'emplacement souhaité.
  4. Dimensionnez la popin (clic droit maintenu).
  5. Double cliquez sur la popin: une boîte de dialogue s'affiche avec ses coordonnées.
    ex: "26,356,478,543". Sélectionnez et copiez ces coordonnées.
  6. Collez les coordonnées dans le code:
    {{popin(aide.html,26,356,478,543)Consulter l'aide}} et validez.
  7. Désormais la popin s'affiche à la position indiquée.

Afficher une note:

L'élément à afficher en note doit être un élément consigne ou un titre d'une page du document.
La page contenant l'élément à afficher doit avoir un nom.
(Pour nommer une page, cliquer sur le bouton "page" puis sur le bouton "nom".)

Dans l'exemple ci-dessous on considèrera qu'il existe une page nommée "lexique" dont le cinquième élément est une consigne contenant la définition du mot "pélagique" : (qui concerne la haute mer).

Méthode de création d'une note. (positionnement intuitif).
  1. Taper le code sans les paramètres de positionnement. ex: 
    {{popnote(lexique_5)pélagique.}}. Validez.
    (dans l'argument lexique_5, "lexique" correspond au nom de la page et "5" au rang de l'élément.)
  2. Cliquez sur le nouveau lien "pélagique".
    La note s'affiche à une position par défaut.
  3. Faites glisser la note (clic gauche maintenu) à l'emplacement souhaité.
  4. Dimensionnez la note (clic droit maintenu).
  5. Double cliquez sur la note: une boîte de dialogue s'affiche avec ses coordonnées.
    ex: "26,356,478,543". Sélectionnez et copiez ces coordonnées.
  6. Collez les coordonnées dans le code:
    {{popnote(lexique_5,26,356,478,543)pélagique}} et validez.
  7. Désormais la note s'affiche à la position indiquée.
Pour fermer la note:

Inclure un élément d'une page dans une autre page

Cette fonction a été développée pour permettre l'affichage déporté d'une question de système-expert. Elle peut sans doute servir à bien d'autres choses.
L'élément à afficher en note doit être un élément consigne ou un titre d'une page du document.
La page contenant l'élément à afficher doit avoir un nom.
(Pour nommer une page, cliquer sur le bouton "page"  puis sur le bouton "nom".)
NB: Les pages de systèmes-experts sont par défaut nommées "système-expert", elles peuvent cependant être librement renommées.

Méthode de création d'une inclusion. (positionnement intuitif).
  1. Taper le code sans les paramètres de positionnement. ex: 
    {{inclure(Latin_1.1)}}. Validez.
    (dans l'argument Latin_1.1, "Latin" correspond au nom de la page et "1.1" à la position de l'élément.
    cet exemple provoque l'inclusion depuis une page de système-expert "Latin" d'un élément de la liste des interrogations et dans cette liste, de la première interrogation)
  2. L'inclusion s'affiche à une position par défaut.
  3. Faites glisser l'inclusion (clic gauche maintenu) à l'emplacement souhaité.
  4. Dimensionnez l'inclusion (clic droit maintenu).
  5. Double cliquez sur l'inclusion: une boîte de dialogue s'affiche avec ses coordonnées.
    ex: "26,356,478,543". Sélectionnez et copiez ces coordonnées.
    NB: en maintenant la touche CTRL pendant que vous cliquez vous empêcherez l'irruption perturbante de la boîte de modification.
  6. Collez les coordonnées dans le code:
    {{inclure(latin_1.1,26,356,478,543)}} et validez.
  7. Désormais l'inclusion restera à la position indiquée.

Entête:

La page d'entête permet de définir un certain nombres de données valables pour toute la séquence lorsqu'elle est en cours d'utilisation (sans effet dans l'onglet Créer/Modifier).
On accède à la page d'entête en remontant en amont de la page 1.
Par défaut l'entête s'affiche avec trois boutons: Paramètres, Identifiants, Documents globaux.

Paramètres

Les paramètres se modifient en cliquant sur le bouton puis en sélectionnant le paramètre à modifier.

Usage

Actuellement ce paramètre n'a d'effet que pour une séquence pédagogique utilisée dans un cours de la plateforme EPISTEMON.
Il peut prendre trois valeurs:
Multiple: L'utilisateur utilise la séquence. A chaque fois qu'il la reprend aprés s'être interrompu, il la retrouve exactement dans l'état dans laquelle il l'avait laissée, éventuellement enrichie des annotations de son tuteur. S'il le souhaite, un bouton "Tout recommencer" lui permet de remettre à zéro toutes les interactions.
Unique: L'utilise la séquence, les interactions se modifient au fur et à mesure de leur usage. Il n'est pas possible (sauf intervention du tuteur) de revenir en arrière. L'évaluation est donc unique.
Amnésique: Le travail de l'utilisateur est mémorisé tant qu'il parcourt la séquence mais est perdu dés qu'il la quitte. C'est actuellement le seul mode de fonctionnement possible en dehors de la platefome EPISTEMON.
Quand la valeur est à oui, à la fin de chaque interaction une popup apparaît avec le score obtenu. Sinon il est toujours possible de consulter l'ensemble de ses résultats en cliquant sur le bouton "Evaluation" (onglet "Tester").

Annotations

Actuellement ce paramètre n'a d'effet que pour une séquence pédagogique utilisée dans un cours de la plateforme EPISTEMON.
Quand sa valeur est à "Oui" l'utilisateur final a la possibilité de déposer des annotations dans un endroit quelconque de la séquence. L'utilisateur doit, dans ce cas utiliser le navigateur Firefox. L'utilisateur peut choisir de déposer des annotations publiques, dans ce cas le tuteur pourra les visualiser en consultant la séquence, ou privées, elles ne resteront alors visibles que par l'utilisateur.

Requêtes

Actuellement ce paramètre n'a d'effet que pour une séquence pédagogique utilisée dans un cours de la plateforme EPISTEMON.
Lorsque l'utilisateur a déposé une annotation sur une page quelconque d'une séquence, de prolonger cette annotation par une requête dirigée vers son tuteur ou vers l'ensemble du groupe. Si la valeur est "tuteur" la requête est dirigée vers la messagerie interne du tuteur. Si la valeur est à "forum" la requête est dirigée vers le forum du groupe dans le fil de discussion correspondant à la séquence. Dans les deux cas un lien est créé pour que les pairs et/ou le tuteur, puissent consulter la page annotée d'où provient la requête.
Si la valeur est à "non", l'utilisateur n'a pas la possibilité d'émettre de requêtes.

Barre_navigation

Par défaut, la valeur de ce paramètre est à "oui". Si l'on met la valeur à "non", la barre de navigation "Suivant" "Précédent" disparaît. Il faut alors avoir intégralement géré la navigation à partir de fonctions {{aller(etc...)}} (cf supra).

Identifiants

Pour l'instant, "identifiants" ne comporte qu'une rubrique "titre de la séquence". Le titre indiqué ici est celui qui apparaîtra dans la barre supérieure de de la fenêtre quand la séquence sera utilisée de façon autonome.

Documents globaux

Ce bouton permet de définir un certain nombre de documents qui seront disponibles tout au long de la séquence. Ces documents sont accessibles à travers un menu déroulant situé dans la barre de navigation (Onglet Tester ou utilisation autonome).
Pour chaque document on définira l'adresse (ou URL) et le texte du lien (qui apparaîtra dans le menu déroulant).


Saisie

Lorqu'on souhaite modifier des données textuelles en cliquant sur élément, une fenêtre de saisie s'affiche avec une boîte de texte affichant le contenu de l'élément en texte brut, c'est à dire que s'il y a du code html celui-ci est affiché. On peut alors modifier le contenu puis, aprés avoir cliqué sur le vouton "Valider" l'élément est mis à jour avec ce nouveau contenu.
Le bouton "html" permet de passer la main à un éditeur html Wisiwyg (htmlarea) pour définir de façon plus intuitive et plus confortable le contenu de l'élément (tableaux, polices, couleurs etc...).
Le  bouton "alineas" ajoute à chaque retour de ligne de la boîte de texte une balise "<BR>" qui correspond à un saut de ligne en html afin que les sauts de lignes prévus se retrouvent affichés une fois le texte validé.
Le bouton "zoom" permet, lorsque le volume de texte est important, d'étendre la fenêtre de saisie sur tout l'écran.
Le bouton avec un "X" permet de fermer la fenêtre sans valider.

Editeur HTML Wisiwyg.


L'éditeur HTML utilisé est HTMLarea-3.0 légèrement adapté pour un interfaçage efficace avec Teleme.
Cet éditeur permet de rédiger comme en traitement de texte mais également de pratiquer le copier / coller depuis des pages internet ou depuis un traitement de textes. L'éditeur HTML tout comme la séquence pédagogique sont intégralement Wisiwyg dans la mesure où ils permettent de visualiser instantanément les images même en liens relatifs. On préfèrera d'ailleurs systématiquement placer les images dans le répertoire même de la séquence, ou dans un sous répertoire, et les adresser par un lien relatif, faute de quoi la séquence pédagogique serait trés difficile à publier ultérieurement dans un autre environnement.
Note: La commodité de cet éditeur incite à l'utiliser largement. Il faudra néanmoins faire attention aux points suivants. Une mise en page avec de nombreuses reprises et repentirs peut génèrer un code html extrêmement complexe et confus qui pourra éventuellement être mal interprété. Dans le cas de textes à trous, veiller à ce qu'aucun code html ne soit inclus à l'intérieur des trous. Dans la pratique, plutôt que d'insérer une trés grande quantité de code html dans un élément (par exemple "consigne"), on préfèrera fractionner le problème en créant plusieurs éléments contenant chacun une partie plus modeste du code à afficher.

Les calques

Hormis les "Réponses ouvertes" tous les éléments peuvent être mis en mode calque.
Les "Associations" sont nécéssairement dans ce mode.
En mode utilisation (Onglet "Tester") tous les calques sont fixes, sauf les éléments "glisse" des associations.

Positionnement.

Les éléments en mode "calque" peuvent être placés librement à n'importe quel emplacement sur la page. Le positionnement se fait par un "glisser" avec le pointeur de la souris. Le dimensionnement se fait aussi à l'aide du pointeur de la souris mais en maintenant le clic droit enfoncé.
Note: (Configuration Teleme en ligne sous Epistemon).
Le clic droit a pour effet habituel de faire surgir un menu contextuel avec "Actualiser, Enregistrer sous, etc...". Lors d'une opération de recadrage, l'appartion de ce menu est extrêmement génante. Pour permettre à Teleme de le bloquer aller dans le menu Firefox "Edition / Préférences / Contenu / Activer le Javascript: Avancé / Autoriser les scripts à: Désactiver ou remplacer les menus contextuels.

Couleurs, cadres etc...

Un clic droit sur un calque fait apparaître une boîte de dialogue permettant de définir certains éléments supplémentaires.
  1. La couleur de fond du calque. (Cliquer sur "choisir" pour obtenir automatiquement le code nécessaire).
    Il est aussi possible d'écrire dans le champ "transparent" pour obtenir un fond transparent.
  2. La largeur de la bordure. Si elle est égale à zéro, il n'y a pas de bordure. 
  3. La couleur de la bordure.
  4. Le numéro que l'on tape ici permet de définir, en cas de superposition de calques, leur ordre d'affichage. On peut ainsi définir précisément les modalités de recouvrement. Le nombre le plus élévé correspond à la couche supérieure.
Conseil: L'utilsation de calques risque de provoquer un affichage un peu confus. Une fois tous les calques générés, cliquer dans le menu supérieur sur "Boutons" afin de cacher les boutons des différents éléments et de voir les calques tels qu'ils apparaîtront à l'utilisateur. Utiliser alors les menus contextuels.

A propos

Auteur:
Jean-Marie Ball
Contributeurs:
Sylvie Colle
Frédéric Doorémont

Service NTE
et étudiants de Master FLE de l'Université du Littoral Côte d'Opale