Icône de RoastPotatoes

RoastPotatoes

Manuel de l'utilisateur

Version bêta – créer des exercices interactifs pour le Web

1. À quoi sert RoastPotatoes ?

RoastPotatoes vous aide à fabriquer des exercices pour vos élèves : associer des mots, répondre à un quiz, compléter un texte, remettre une phrase en ordre, faire des mots croisés ou placer des étiquettes sur une image.

Chaque exercice devient une page Web (un fichier avec l'extension .htm). Les élèves l'ouvrent dans leur navigateur (Chrome, Firefox, Edge…) et la page corrige toute seule : elle donne un score et des messages d'encouragement. Elle fonctionne même sans connexion Internet.

RoastPotatoes est construit dans l'esprit de Hot Potatoes 7.0.3 : mêmes types d'exercices, mêmes réglages, et il sait ouvrir vos anciens fichiers Hot Potatoes (voir le chapitre 11).

Les six outils

OutilCe que l'élève faitFichier de travail
RMatchAssocie des éléments (mot et traduction, question et réponse…).jmt
RQuizRépond à des questions (choix multiple, réponse courte…).jqz
RClozeComplète un texte à trous.jcl
RMixRemet en ordre les mots ou les parties d'une phrase.jmx
RCrossRésout des mots croisés.jcw
RMapGlisse des étiquettes sur les bonnes zones d'une image.jmt

Deux sortes de fichiers

2. Installer le programme

Windows

Si Windows bloque le programme. Windows se méfie des programmes qu'il ne connaît pas. S'il affiche « Windows a protégé votre ordinateur », cliquez sur « Informations complémentaires », puis sur « Exécuter quand même ». Si votre ordinateur refuse complètement (protection « Smart App Control »), utilisez la version en ligne : elle ne demande aucune installation.

Linux (Debian, Ubuntu, MX Linux…)

Astuce. Les versions Linux sont récentes. Si l'une ne démarre pas sur votre machine, essayez une autre (par exemple l'AppImage à la place du .deb).

Dans un navigateur (sans installation)

Si le site de votre établissement propose la version en ligne, ouvrez simplement sa page index.html. Voir le chapitre 10.

3. Premiers pas : un exercice en 5 minutes

Nous allons fabriquer un exercice d'association : les couleurs en anglais et en français. Vous le trouverez déjà prêt dans le dossier exemples (fichier couleurs.jmt).

Étape 1 – Choisir l'outil

Au démarrage, la fenêtre d'accueil propose les six outils. Cliquez sur RMatch. Le bouton « Ouvrir un exercice… » en bas sert à rouvrir un fichier déjà fait, et le bouton « 📖 Manuel » ouvre ce manuel (on le retrouve aussi dans chaque éditeur : menu Aide → « Manuel de l'utilisateur »).

Fenêtre d'accueil
La fenêtre d'accueil.

Étape 2 – Saisir l'exercice

  1. Tapez le titre : Colours.
  2. Dans le tableau, tapez les mots anglais dans la colonne de gauche et leur traduction dans la colonne de droite.
  3. Le bouton « + Ajouter une paire » (en bas) ajoute une ligne ; « Supprimer », « Monter » et « Descendre » agissent sur la ligne sélectionnée.
L'éditeur RMatch
L'éditeur RMatch avec l'exemple « Colours ».

Étape 3 – Écrire les consignes

Cliquez sur Configurer… (ou touche F8). Dans l'onglet « Titres/Consignes », tapez le sous-titre et les consignes que les élèves liront, par exemple Match each English colour with its French name. Validez avec « OK ». Le chapitre 7 explique tous les onglets.

Étape 4 – Enregistrer le fichier de travail

Cliquez sur Enregistrer (ou Ctrl+S) et choisissez un dossier et un nom, par exemple couleurs.jmt. C'est votre brouillon.

Étape 5 – Créer la page Web

Choisissez le format de la page dans la liste (par exemple « Glisser-déposer »), puis cliquez sur Créer la page. Le programme propose un nom (couleurs.htm, dans le même dossier) et ouvre la page dans votre navigateur pour que vous l'essayiez.

La page produite
La page que verront les élèves (format « Glisser-déposer »).
Astuce. Faites toujours l'exercice vous-même avant de le donner : essayez une mauvaise réponse, puis la bonne.

4. La fenêtre d'un éditeur

Tous les éditeurs se présentent de la même façon.

ÉlémentRôle
Nouveau / Ouvrir / EnregistrerCommencer un exercice, en rouvrir un, l'enregistrer. Si vous avez des changements non enregistrés, le programme vous demande confirmation avant de les perdre.
Créer la pageFabrique la page Web. Selon l'outil, une liste « Format de la page » permet de choisir l'aspect de l'exercice.
Insérer un son…Ajoute un petit bouton « lecture » dans le texte (voir chapitre 6).
Configurer…Ouvre les réglages : textes, boutons, couleurs, minuteur… (chapitre 7).
TitreLe titre de l'exercice, affiché en haut de la page.
MenusFichier, Édition, Insérer, Options et Aide. Le menu Fichier propose aussi « Créer la page Web » pour chaque format.
Barre du basMontre le nombre d'éléments de l'exercice et le nom du fichier.

Le titre de la fenêtre se termine par une étoile (*) quand il y a des changements non enregistrés.

5. Les six outils

5.1 RMatch – associer

Convient aux mots et traductions, aux questions et réponses courtes, aux dates et événements, aux images et légendes…

Les formats de page

FormatAspect
Listes déroulantesChaque élément de gauche a une liste déroulante qui propose les réponses.
Glisser-déposerL'élève glisse les réponses à côté des éléments de gauche.
Glisser-déposer horizontal (JMH)Éléments de gauche alignés en haut (des images, par exemple), réponses à glisser en dessous.
Tri par catégories (JMS) et vertical (JMSV)L'élève classe des éléments dans des boîtes. Écrivez le nom de la catégorie à gauche, répété pour chaque élément de cette catégorie, et l'élément à classer à droite. Une ligne dont la gauche est vide devient un « intrus » qui n'appartient à aucune catégorie.
Jeu de mémoire (JMem)L'élève retourne les cartes deux par deux pour retrouver les paires.
Page RMatch à listes déroulantes
Le même exercice au format « Listes déroulantes ».

Pour mélanger. Dans « Configurer » → « Autres », cochez « Mélanger les éléments de gauche ». Vous pouvez aussi limiter le nombre de paires affichées (« Limiter le nombre de questions affichées »).

5.2 RQuiz – questions

À gauche, la liste des questions ; à droite, le détail de la question choisie.

L'éditeur RQuiz
L'éditeur RQuiz avec l'exemple « Animals quiz ».

Les quatre types de questions

TypeComment l'élève répondComment le saisir
Choix multipleClique sur une proposition.Une proposition par ligne ; cochez « Juste » pour la bonne réponse.
Réponse courteTape sa réponse.Saisissez toutes les réponses acceptées. Le « % » permet d'accepter une réponse « presque juste ».
HybrideTape d'abord sa réponse. Après plusieurs essais ratés, la question devient un choix multiple.Comme la réponse courte ; la colonne « QCM » indique les propositions qui apparaîtront dans la liste.
Sélection multipleCoche toutes les bonnes réponses.Cochez « Juste » pour chaque bonne réponse.

Dans « Configurer » → « Autres », vous pouvez mélanger les questions, mélanger les réponses, limiter le nombre de questions affichées, respecter les majuscules…

5.3 RCloze – texte à trous

Tapez ou collez votre texte. Pour créer un trou : sélectionnez un mot, puis cliquez sur « Créer un trou ». Dans le texte, un trou s'écrit entre doubles crochets :

[[réponse|autre réponse acceptée||indice]]

L'éditeur RCloze
L'éditeur RCloze avec l'exemple « At home ».

Les formats de page

FormatPrincipe
Texte à trous (zones de saisie)L'élève tape les mots qui manquent.
Find-it A (FIa)Chasse aux erreurs. Pour chaque mot entre [[ ]], écrivez d'abord le mot correct puis le mot faux affiché dans le texte : [[cats|dogs]]. L'élève clique sur les mots faux et la correction apparaît.
Find-it B (FIb)Même saisie. L'élève clique sur un mot faux, puis tape lui-même la correction.
Listes déroulantes (JCdd)Chaque trou devient une liste. Écrivez la bonne réponse en premier, puis les autres choix : [[additive|substractive]].
Glossaire (JGloss)Le texte est à lire. Chaque mot entre [[ ]] est cliquable et montre sa définition, saisie comme indice : [[goal posts||poteaux de but]].

Dans « Configurer » → « Autres », vous pouvez aussi remplacer les zones de saisie par des listes déroulantes, ajouter une liste des mots à placer, respecter les majuscules, et ajouter un clavier de caractères spéciaux (très utile pour les langues étrangères).

Page RCloze
La page de l'exemple « At home ».

5.4 RMix – remettre en ordre

  1. Écrivez les parties de la phrase dans le bon ordre, une par ligne. Les élèves les recevront mélangées.
  2. Un raccourci : tapez la phrase entière dans la case du haut, puis cliquez sur « Découper en mots » (ou « Découper en lettres » pour un exercice sur un mot). La ponctuation devient une partie à part.
  3. Si plusieurs ordres sont corrects, écrivez les autres phrases acceptées, une par ligne, avec les mêmes parties dans un autre ordre. Le programme vous avertit si une phrase ne correspond pas.
L'éditeur RMix
L'éditeur RMix avec l'exemple « A simple sentence ».

Deux formats de page : cliquer sur les parties (elles s'ajoutent à la phrase dans l'ordre des clics) ou glisser-déposer.

Page RMix
La page de l'exemple.

Plusieurs phrases dans le même exercice

La barre « Phrase : 1 / 1 » permet d'ajouter d'autres phrases (« + Ajouter une phrase ») : chacune a ses parties et ses autres phrases acceptées, la liste déroulante sert à passer de l'une à l'autre. Avec plusieurs phrases, « Créer la page (cliquer sur les parties) » fabrique une page qui les présente une par une, avec un compteur « Sentence 1 / 3 » et un message « Next sentence! » après chaque phrase réussie. Les boutons « <= » et « => » permettent de changer de phrase sans valider (ce qui est commencé est gardé), et le bouton « Finish » termine l'exercice même si des phrases ne sont pas faites (un avertissement s'affiche, il faut cliquer une deuxième fois) ; la note finale est la moyenne des phrases, une phrase non faite comptant 0. Ces textes se changent dans « Configurer » → « Messages ». Le glisser-déposer ne gère qu'une phrase. L'exemple trois-questions.jmx contient trois questions.

Dans le fichier .jmx, la première phrase est enregistrée comme d'habitude et les suivantes à la fin du fichier : Hot Potatoes peut l'ouvrir, mais il n'y verra que la première phrase.

5.5 RCross – mots croisés

Il y a deux façons de fabriquer la grille.

A. Générer la grille automatiquement

  1. À droite, dans « Mots à placer », écrivez une ligne par mot : le mot, un point-virgule, puis sa définition. Exemple : LION ; The king of the jungle.
  2. Cliquez sur « Générer la grille automatiquement ». Les mots sont croisés pour faire la plus petite grille possible. Si un mot ne peut pas se croiser avec les autres, le programme vous le dit : vous pourrez le placer à la main.

B. Remplir la grille à la main

Les définitions se complètent automatiquement à droite : chaque mot de la grille apparaît avec son numéro, horizontalement ou verticalement. Tapez simplement la définition en face du mot.

L'éditeur RCross
L'éditeur RCross avec l'exemple « Animals crossword ».
Page RCross
La page des mots croisés : l'élève clique sur un numéro pour lire la définition et taper sa réponse.

5.6 RMap – image à zones

Les élèves glissent des étiquettes sur les bonnes zones d'une image (une carte, un schéma du corps humain, une photo…).

  1. Cliquez sur Choisir l'image… et prenez une image (png, jpg, gif…).
  2. Tracez une zone avec la souris : cliquez sur l'image, gardez le bouton enfoncé, puis relâchez.
  3. Dans la liste de droite, tapez l'étiquette de la zone.
  4. Pour corriger : cliquez sur une zone pour la sélectionner, déplacez-la avec la souris, ou agrandissez-la par le petit carré du coin. La touche Suppr la supprime. Vous pouvez aussi changer ses coordonnées dans la liste.
  5. « Affichage » permet de zoomer ou de dézoomer l'image pour travailler plus précisément.
L'éditeur RMap
L'éditeur RMap : deux zones tracées sur l'image.
Page RMap
La page : les étiquettes sont en bas, l'élève les glisse sur les zones.
L'image reste à côté de votre exercice. Quand vous enregistrez ou créez la page, l'image est copiée dans le même dossier. Gardez-les ensemble quand vous déplacez les fichiers.

6. Le menu « Insérer » : liens, images, sons

Le menu Insérer ajoute des éléments à l'endroit du curseur dans le champ de texte où vous étiez (une question, une réponse, une étiquette, une définition, les consignes…). Cliquez d'abord dans ce champ, puis ouvrez le menu.

Le menu Insérer
Le menu Insérer (ici dans la version en ligne ; dans le programme, il se trouve au même endroit).
CommandeCe qu'elle fait
Lien hypertexte… (Ctrl+K)Ajoute un lien vers un site. Une petite fenêtre demande l'adresse, le texte affiché et l'ouverture dans une nouvelle fenêtre. Si du texte est sélectionné, il devient le texte du lien.
Image…Ajoute une image : vous choisissez le fichier, un texte de remplacement (lu par les lecteurs d'écran) et, si vous voulez, une largeur en pixels. L'image est copiée dans un dossier images à côté de la page.
Son…Ajoute un petit bouton ► qui joue un son (voir plus bas).
Gras, Italique, SoulignéMet en forme le texte sélectionné (Ctrl+B, I, U).
Saut de lignePasse à la ligne dans la page.
Caractères spéciauxLettres accentuées françaises, espagnoles, portugaises, italiennes et allemandes, guillemets, euro, etc.
La fenêtre Insérer un lien
La petite fenêtre « Insérer un lien ».

Les sons

Attention. Quand vous mettez la page sur un site, envoyez aussi le dossier sounds (et le dossier images), au même endroit que la page. Sinon le son ne jouera pas.

7. La fenêtre « Configurer »

Elle règle l'aspect et les textes de la page. Ouvrez-la avec le bouton Configurer… ou la touche F8. Elle comporte huit onglets, comme dans Hot Potatoes. Validez avec OK ; la croix en haut à droite ou la touche Échap ferme sans appliquer.

Onglet Titres/Consignes
L'onglet « Titres/Consignes ».
OngletCe qu'on y règle
Titres/ConsignesLe sous-titre et les consignes affichés en haut de la page.
MessagesLes textes que voit l'élève : « Correct! », « Try again », « Your score is… », le message de fin de temps, les symboles ✔ et ✘…
BoutonsLe nom de chaque bouton (« Check », « Hint »…), les boutons facultatifs (indice, voir la réponse), et la navigation : bouton « Exercice suivant », « Sommaire », « Retour ».
ApparenceLe look de la page (« Look of the page ») : Tuiles (par défaut, comme les exercices du site : consigne dans un bandeau, cartes, grands boutons, adapté au téléphone), Classique (la page de Hot Potatoes), Cartes (plus sobre) ou Quiz couleurs (couleurs fixes). Avec Tuiles et Cartes, la page s'affiche en mode sombre si l'ordinateur ou le téléphone est en mode sombre, et un bouton 🌙 / ☀️ en haut à gauche permet de changer ; le navigateur retient ce choix pour les exercices suivants. Puis la police, la taille du texte et les couleurs (fond de la page, fond de l'exercice, titres, texte, liens, boutons, image de fond), que tous les looks reprennent sauf Quiz couleurs.
MinuteurUn compte à rebours, en minutes et secondes. Quand le temps est écoulé, le travail est noté et l'exercice se bloque.
AutresLes réglages propres à chaque outil (mélanger, limiter, majuscules, clavier de caractères…) et le texte de lecture à afficher à côté de l'exercice.
PersonnaliséTrois chaînes personnelles et un champ de code pour la balise <head> de la page (réservé aux utilisateurs avancés). Pour certains formats, les chaînes règlent l'espacement, la taille du texte des cartes ou la surbrillance automatique.
CGIEnvoi des résultats par e-mail avec FormMail, et suivi SCORM 1.2. Fonctions avancées : elles demandent un serveur préparé pour cela.
Onglet Boutons
L'onglet « Boutons ». Le bouton « Parcourir… » choisit la page de l'exercice suivant ou du sommaire.
Onglet Apparence
L'onglet « Apparence » : en haut, le look de la page ; puis on choisit une couleur avec le sélecteur ou on tape son code (#RRGGBB).

Enchaîner plusieurs exercices

Dans l'onglet « Boutons », cochez « Inclure le bouton Exercice suivant », puis cliquez sur Parcourir… et choisissez la page de l'exercice suivant. Le programme écrit l'adresse relative (par exemple unite2/exercice2.htm) : la chaîne continue à marcher quand vous déplacez tout le dossier sur un site, à condition de garder les fichiers à la même place les uns par rapport aux autres.

Les boutons du bas

BoutonRôle
ChargerLit les réglages d'un fichier de configuration (.cfg), y compris celui de Hot Potatoes.
EnregistrerGarde les réglages comme réglages par défaut de tous vos nouveaux exercices. Ils sont stockés dans le fichier english8.cfg : sous Windows dans %APPDATA%\RoastPotatoes, sous Linux dans ~/.config/RoastPotatoes.
Enregistrer sousÉcrit les réglages dans un fichier de votre choix.
OK / AideApplique les réglages à l'exercice en cours / affiche une aide sur l'onglet.
Astuce. Réglez une fois vos couleurs et vos textes en français (« Vérifier », « Bravo ! »…), puis cliquez sur « Enregistrer » : tous vos prochains exercices les reprendront.

8. Ce que voient les élèves

Page RQuiz
Une page RQuiz.

9. Mettre vos exercices sur un site

Une page produite par RoastPotatoes est un simple fichier : il suffit de la copier sur votre site.

  1. Créez la page (.htm).
  2. Copiez la page et, s'il existe, le dossier sounds et le dossier images sur le serveur, dans le même dossier.
  3. Donnez aux élèves l'adresse de la page.

10. La version en ligne

RoastPotatoes existe aussi dans une version pour navigateur, sans installation. C'est la même chose que le programme, avec quelques différences :

Pour installer la version en ligne sur votre site

Décompressez RoastPotatoes-en-ligne.zip et copiez tout son contenu dans un dossier de votre serveur (par exemple /hp/). Ouvrez ensuite index.html dans le navigateur. Le fichier LISEZ-MOI.txt du dossier rappelle ces étapes.

11. Reprendre des exercices Hot Potatoes 7

12. Questions fréquentes et problèmes

ProblèmeCe qu'il faut essayer
Windows refuse de lancer le programme.Voir le chapitre 2 (« Si Windows bloque le programme »). À défaut, utilisez la version en ligne.
Le son ne joue pas.Le dossier sounds doit être à côté de la page, avec le fichier dedans. Préférez le format mp3. Sur un site, vérifiez les majuscules et les minuscules.
Une image n'apparaît pas.Même chose : le dossier images doit être à côté de la page. Pour RMap, l'image est dans le même dossier que la page.
« Créer la page » demande si je veux continuer.Le programme a repéré un oubli (aucun trou dans le texte, une question sans bonne réponse, une paire incomplète…). Lisez le message, corrigez, ou continuez si c'est voulu.
« Exercice suivant » ne mène nulle part.Vérifiez l'adresse dans « Configurer » → « Boutons ». Utilisez « Parcourir… » plutôt que de la taper. Les deux pages doivent rester dans les mêmes dossiers l'une par rapport à l'autre.
Les accents s'affichent mal.Les pages sont en UTF-8. Si le problème vient d'un serveur, ajoutez dans ses réglages que les fichiers .htm sont en UTF-8.
J'ai fermé sans enregistrer.Le programme demande toujours une confirmation s'il y a des changements non enregistrés. Pensez à enregistrer le fichier de travail avant de créer la page.
Je veux modifier une page déjà créée.Rouvrez le fichier de travail (.jmt, .jqz, .jcl, .jmx, .jcw), modifiez, puis recréez la page. On ne modifie pas la page directement.
Sous Linux, le programme ne démarre pas.Avec le .deb ou l'archive, essayez l'AppImage (elle règle le bac à sable toute seule). En ligne de commande, vous pouvez aussi lancer roastpotatoes --no-sandbox.

13. Raccourcis clavier

RaccourciAction
Ctrl+NNouvel exercice
Ctrl+OOuvrir un fichier
Ctrl+SEnregistrer
Ctrl+Maj+SEnregistrer sous
Ctrl+WCréer la page (premier format du menu)
Ctrl+DCréer la page en glisser-déposer (RMatch et RMix seulement)
F8Ouvrir « Configurer »
Ctrl+KInsérer un lien
Ctrl+B / I / UGras / italique / souligné
Ctrl+QFermer la fenêtre
ÉchapFermer la fenêtre « Configurer » ou une petite fenêtre de saisie
Entrée (RCross)Changer le sens de saisie dans la grille
Suppr (RMap)Supprimer la zone sélectionnée

14. Petit glossaire

Fichier de travailLe brouillon de votre exercice, que vous pouvez rouvrir dans RoastPotatoes (.jmt, .jqz, .jcl, .jmx, .jcw).
Page WebLe fichier .htm que les élèves ouvrent dans leur navigateur.
NavigateurLe programme qui affiche les pages Web : Chrome, Firefox, Edge, Safari…
Adresse relativeUne adresse qui part du dossier de la page (suite/exercice2.htm) et non de la racine du disque ou du site. Elle continue de marcher quand on déplace tout le dossier.
TrouUn mot du texte que l'élève doit retrouver (RCloze).
IndiceUne aide pour répondre. Elle fait baisser un peu le score.
Retour (feedback)Le message affiché après une réponse.
Code de couleur (#RRGGBB)Une couleur écrite avec 6 chiffres ou lettres, par exemple #ff0000 pour le rouge. Le sélecteur de couleur le remplit pour vous.
Version portableUn programme qui se lance sans être installé.

Les exemples fournis

Le dossier exemples contient des exercices tout prêts à ouvrir avec RoastPotatoes :

FichierOutilContenu
couleurs.jmtRMatchLes couleurs en anglais et en français
animaux.jqzRQuizTrois questions : choix multiple, réponse courte, sélection multiple
maison.jclRClozeUn texte à trous avec une réponse alternative et un indice
phrase.jmxRMixUne phrase à remettre en ordre
trois-questions.jmxRMixTrois phrases à remettre en ordre, présentées une par une
animaux.jcwRCrossDes mots croisés sur les animaux
pomme-de-terre.jmt et .pngRMapDeux étiquettes à placer sur une image

RoastPotatoes bêta – Manuel de l'utilisateur