Création des exercices interactifs avec : Didapagescircgdquevilly.spip.ac-rouen.fr/IMG/pdf/tutoriel-complet...Didapages p.2 p.4 p.5 p.7 p.10 p.13 p.16 p.18 p.21 p.23 p.26 p.27 1

1. Répondre en écrivant des réponses 2. Répondre en cochant une fois

3. Répondre en cochant plusieurs fois 4. Répondre sélectionnant dans une liste 5. Répondre en classant 6. Répondre en coloriant

7. Valider par un commentaire8. Valider par des couleurs9. Valider par une image10. Valider par des images11. Valider par un commentaire sonore12. Faire une page récapitulant les scores

____________________________________________________________________________ DEC22 --- C. Jézégou Créer des exercices avec Didapages page 1 / 29

Création des exercices interactifs avec :

DidapagesDidapages

p.2p.4p.5p.7p.10p.13p.16p.18p.21p.23p.26p.27

1. Répondre en écrivant les réponses

Dans cet exemple de texte à trous, le lecteur doit saisir au clavier les réponses attendues

(exemple : Page 2 du livret)

- Saisir le texte à trous et insérer les espaces nécessaires (1)

- Insérer les lignes de saisie puis les placer convenablement (2)

-

Paramètrer chaque ligne de saisie :- Saisir la réponse juste (3) - Saisir le nombre de points à en jeu (4) - Valider (5)

- Ajouter les éléments suivants (6) :

- un bouton valider - un bouton multifonction «refaire» (si besoin) - un élément score


1

2

5

4

3

66

http://www.isfec22.fr/dida/media/exinteractivite/index.html

- Paramètrer l'élément score :

- Cocher score de la page (7)

- Saisir le titre (8)

- Choisir la couleur et la taille du titre (9)

- Valider (10)

- Paramètrer le bouton multifonction (si besoin) :

- Saisir le nom du bouton (11)

- Saisir le numéro de page à réinitialiser (12)

- Valider (13)

- Paramètrer le bouton valider :


- Saisir le nombre de tentatives (15)

- Cocher « comptabiliser les scores » et «afficher les messages» (16)

- Saisir les numéros des éléménts devant apparaître (le bouton refaire, le score, la zonemessages) et le numéros des éléments devant disparaître (le bouton valider) (17)

- Valider (18)


7

89

10

12

13

11

14

1615

1718

2. Répondre en cochant la bonne réponse

Dans cet exemple le lecteur doit trouver et cocher la bonne réponse associée à chaque mot.


Paramétrage des éléments de la page :

- Insérer les objets images (1)

- Insérer les objets sons et liés aux sons (2) :

- les 3 sons MP3- l'image symbolisant le son (x3) - les zones réactives

- Paramétrer les zones réactives

- Masquer chaque objet son MP3 en le disposant sous l'image. Superposer ensuite les zones réactives.


1

2

1


Paramétrage des éléments de réponse :- Insérer un bouton de sélection (3) puis le placer sur la page à l'endroit qui convient (4)

- Paramétrer le bouton de sélection :

- Saisir l'indice 1 (5) qui sera commun à tous les boutons de la première réponse (même groupe).- Saisir le nombre de points en jeu (6) - Ne pas modifier l'état correct des boutons (« Déselectionné » doit être coché) (7)

-

-

- Copier le bouton de sélection ligne 10 et le coller 3 fois (8) :

- Placer et aligner les 4 boutons correctement (9)

- Rectifier l'état correct du bouton correspondant à la bonne réponse (ici le bouton ligne 10) (10)

- Insérer un nouveau bouton de sélection (11) puis le placer sur la page à l'endroit qui convient (12)


3

6

5

47

98

10

- Paramétrer ce bouton de sélection :

- Saisir l'indice 2 (13) qui sera commun à tous les boutons de la deuxième réponse.- Saisir le nombre de points en jeu (14) - Ne pas modifier l'état correct des boutons (« Déselectionné » doit être coché) (15)

-

-

- Copier le bouton de sélection ligne 14 et le coller 3 fois (15) :

- Placer et aligner les 4 boutons correctement (16)

- Rectifier l'état correct du bouton correspondant à la bonne réponse (ici le bouton ligne 16) (17)

Recommencer les mêmes opérations en insérant des boutons de sélection de goupe 3...


11

13

11

14

15

1516

17

3. Répondre en cochant plusieurs fois :

Dans cet exemple le lecteur doit trouver et cocher les bonnes réponses.


- Ouvrir la console d'édition

- Insérer et placer les images (1)

- Insérer une case à cocher (2) et la placer sous la première image

- Paramètrer la case à cocher (4)

- Copier cette case à cocher autant de fois que nécessaire [5]

- Placer chaque case à cocher sous une image

- Modifier si nécessaire l'état correct des cases


1

2

4

5


4. Répondre en sélectionnant la réponse dans une liste :

Dans cet exemple le lecteur sélectionne dans la liste proposée le nom de l'animal qui convient à l'expression.


- Ouvrir la console d'édition et nsérer un objet texte (1)

- Placer et dimensionner la boîte et fixer les paramètres d'apparence de la boîte puis saisir toutes les expressions sans nommer l'animal (2)

- insérer un objet liste (3)

- Ouvrir les paramètres de cet objet liste et :

- Saisir les propositions (4) séparées par une virgules sans espace ! (dans le désordre)

- Saisir éventuellement le texte inititial (5)

- Saisir la proposition juste (6] elle doit être strictement identique à celle de la proposition

- Valider [7]

- copier [8] la liste de la ligne 4 et coller [9] en-dessous autant de fois que nécessaire...

- placer chaque liste sur une ligne de texte [10] (les listes sont crées en haut à gauche de la page)


5

6

1

2

3

4

7


- Ouvrir un à un les paramètres des listes copiées :

- Les propositions de la listes sont déjà saisies [11] grâce au «copier/coller» de la liste 4- Modifier la proposition juste [12] correspondant à l'expression.


8

9

10

11

11

12

12

5. Répondre en utilisant le "glisser déposer" d'éléments

Dans cet exemple le lecteur doit faire glisser des éléments de texte vers des zones dites cibles .


- Ouvrir la console d'édition (1)

- Laisser 6 lignes vierges et insérer un objet texte à la ligne 10 (2)

- Placer et dimensionner la boîte puis saisir le texte (3)

- Ouvrir les paramètres de l'élément texte et cocher «Déplaçable uniquement sur les zone cibles» (4)

- Valider par un clic sur Ok (5)

- Copier l'élément texte ligne 10 (6) et coller sur les 5 lignes suivantes (7) (les paramètres de l'élément 10 seront copiés)

tous les éléments copiés se trouvent en haut et à gauche de la page

- Placer, redimensionner et modifier le texte de chaque boîte sur la page (8)


8

1

3

4

2

5

6

7



- Dans la console d'édition, placer à la ligne 4 une zone cible (9)

- Placer et redimensionner la boîte (10)

- Cliquer sur la clé pour ouvrir les paramètres de la boîte zone cible et fixer :

- choisir les couleurs de la boîte (11)

- saisir les numéros des lignes de 10 à15 séparés par une virgule sans espace (12)

- Valider

- Copier l'élément zone cible ligne 4 (13) et coller sur les 5 lignes suivantes (14) (les paramètres de l'élément 4 seront copiés)

tous les éléments copiés se trouvent en haut et à gauche de la page

- Placer, redimensionner chaque zone cible (15)


9

10

11

12

13

14

- Modifier les paramètres de chaque zone cible (16) :

élément 4 élément 5 élément 6

élément 7 élément 8 élément 9

- Vérifier les paramétrages par un essai (17) :

..

- Modifier la présentation finale des éléments texte (18) :


16

17

18

6. Répondre en coloriant :

Dans cet exemple le lecteur répond en coloriant des images selon un code à couleurs précisé dans l'énoncé. Le coloriage est obtenu

par un clic sur une zone sensible placée sur chaque image à colorier.(exemple : Page 7 du livret)

- Ouvrir la console d'édition (1)

- Insérer les objets suivants : (2)- un objet texte pour la consigne (obj2)- un objet son mp3, un objet image et une zone sensible pour une lecture sonore de la consigne (obj 26 à 28)- 6 objets images (obj 3 à 8)- 6 objets textes pour nommer les images (obj 9 à 14) - 1 bouton valider (obj30)- 1 bouton multifonction «refaire» (obj33)- 3 objets images pour apprécier les réponses (obj 35 à 37)


2


- Insérer un bouton multi-positions à la ligne 15 (impérativement après les images) (4)

- Placer cet objet sur la première image et le redimensionner afin qu'il recouvre parfaitement l'image située en-dessous (5)

- Paramèter le bouton multiposition (6)

- Définir le nombre d'états (7) nécessaires (3 états)

- Définir la couleur de chaque état (8) :

Etat 1 : mettre tous les curseurs à 0 pour que le bouton soit complètement transparent (9)

-

Etat 2 : Cliquer sur la palette pour choisir la couleur rouge (10) puis ajuster le curseur alpha à 50 pour rendre le bouton légèrement transparent afin que l'image en-dessous demeure vivible.

Etat 3 : Cliquer sur la palette pour choisir la couleur jaune (12) puis ajuster le curseur alpha à 50 (13) pour rendre le bouton légèrement transparent afin que l'image en-dessous demeure vivible.

- Définir la position correcte (14) ici la couleur rouge état2

- Valider les paramètres.

Nous pouvons vérifier qu'un clic répété sur l'image de la baleine provoque un changement successifs de couleurs. Passons à la création et au paramètrage des autres boutons.


8

11

7

10

4

5

6

9

12

13

13

- Sélectionner le bouton multi-positions de la ligne 15 (15)

- Cliquer sur copier (16) de la ligne

- Cliquer sur coller (17) de la ligne suivante (coller 5 fois)

Vous disposez maintenant de 5 nouveaux boutons multi-positions déjà paramètrés ils sont placés en haut à gauche de la page.

Replacer chaque bouton multi-positions sur chaque image et le redimensionner (18) .

- Rectifier et vérifier la position correcte des états de chacun d'eux (19) .


15

17

16

Boutons 17 18 19 Boutons 15 16 20

18

19 19

7. Valider les réponses par un score et des commentaires :

Dans cet exemple de texte à trous, la validation par le lecteur fait

apparaître le score obtenu et des commentaires sur les réponses apportées(exemple : Page 8 du livret)



- Paramètrer chaque ligne de saisie :- Saisir la réponse juste (3) - Saisir les messages si faux/ juste (4) - Saisir le nombre de points à en jeu (5)

- Ajouter les éléments suivants (6) :

- une zone message - un bouton valider - un bouton multifonction «refaire» (si besoin)


1

2

5

4

3

6

7


- un élément score

- Paramètrer la zone message :

- Saisir le titre de la boîte messages (7)

- Paramètrer l'élément score :

- Cocher score de la page (8)

- Saisir le titre (9)

- Choisir une couleur au texte (10)

- Valider (11)

- Paramètrer le bouton multifonction (si besoin) :


- Saisir le numéro de page à réinitialiser (10)

- Valider (11)

- Paramètrer le bouton valider :


- Saisir le nombre de tentatives (13)

- Cocher « comptabiliser les scores » et «afficher les messages» (14)

- Saisir les numéros des éléménts devant apparaître (le bouton refaire, le score, la zone messages) et le numéros des éléments devant disparaître (le bouton valider) (15)


8

910

11

12

13

14

12

1413

1516

- Valider (16)

8. Valider les réponses par des couleurs.

Dans cet exemple dès validation des réponses par le lecteur, les bonnes réponses seront surlignées de vert, les erreurs de rouge...




- Ajouter un croquis auteur après les lignes de saisie (3)

- Dans les paramètres choisir la couleur de fond vert (4) et fixer le paramètre alpha à 50 (5) pour qu'il soit légèrement transparent

- Redimensionner le croquis afin qu'il recouvre àpeine le premier champ de saisie (6)


1

2

3 4

5

5


- Copier ce premier croquis auteur sur les 4 lignes suivantes (7)

- Placer chaque croquis près du champ qu'il recouvrera ultérieurement (8)

- Copier/coller un autre croquis à la ligne 12 (9) puis modifier sa couleur de fond (10) en gardant le paramètre alpha à 50

- Placer chaque croquis rouge près du champ qu'il recouvrera ultérieurement (11)

-


7

8

9

10

11

Paramètrer chaque champ de saisie :- Saisir la réponse juste (12) - Les éléments visibles si faux/ juste (13) (croquis rouges ou verts)- Saisir le nombre de points à en jeu (14) pour chaque réponse

- Placer les croquis auteur verts et rouges sur le champ de saisie qui convient (15) .

- Ajouter les éléments suivants (16) : un bouton valider, un bouton multifonction «refaire» (si besoin) et un élément score.

- Paramètrer chacun de ces éléments :


12

13

14

15

16

9. Valider par un exercice par une image :

Dans cet exemple la validation de l'exercice fera apparaître une image selon le niveau de réussite obtenu.


-

- Insérer tous les éléments nécessaires à l'exercice...

- Evaluation de l'exercice :

- Ouvrir la console d'édition et insérer les éléments suivants (1)

- Renseigner les paramètres du bouton valider :

- Saisir nom du bouton et le nombre de tentatives (2)

- Cocher «comptabiliser les scores» (3)

- Saisir l'élément devant disparaître à la validation (le bouton valider) (4)

- Saisir l'élément devant apparaître à la validation (le bouton refaire) (4)


- Renseigner les paramètres du bouton refaire :

- Saisir nom du bouton (6)

- Saisir le numéro de la page à réinitialiser (7)



2

1

3

45

1

3

4


- Renseigner les paramètres des 3 images :

- Cocher «Pas d'interactivité» (5)


- Renseigner les paramètres de l'élément score :

- Cocher «score la page» (7)

- Le score ne devant pas apparaître ne pas mettre de titre et mettre le texte en blanc (8)

- Saisir les visibilités (9) :

- apparition de l'image « mecontent.jpg » pour un score compris entre 0 et 70%- apparition de l'image «bof.jpg » pour un score compris entre 70 et 90%- apparition de l'image « content.jpg » pour un score compris entre 90 et 100%


- Pour une meilleure présentation :

- superposer les 3 images - superposer les boutons refaire et valider et l'élément score7


5

6

9

12

content.jpg bof.jpg mecontent.jpg

8

7

10

11

10. Valider par des images chaque réponse d'un exercice :

Cette boîte permet au lecteur d'effectuer des tracés libres. Une boîte d'outils lui permet de modifier la couleur ou l'épaisseur du tracé.


- Ouvrir la console d'édition et nsérer un objet texte (1)

- Placer et dimensionner la boîte et fixer les paramètres d'apparence de la boîte puis saisir toutes les expressions sans nommer l'animal (2)

- insérer un objet liste (3)

- Ouvrir les paramètres de cet objet liste et :

- Saisir les propositions (4) séparées par une virgules sans espace ! (dans le désordre)

- Saisir éventuellement le texte inititial (5)

- Saisir la proposition juste (6] elle doit être strictement identique à celle de la proposition

- Valider [7]

- copier [8] la liste de la ligne 4 et coller [9] en-dessous autant de ____________________________________________________________________________ DEC22 --- C. Jézégou Créer des exercices avec Didapages page 23 / 29

56

1

2

3

4

7


fois que nécessaire...

- placer chaque liste sur une ligne de texte [10] (les listes sont crées en haut à gauche de la page)

- Insérer pour chaque ligne :- une image matérialisant une bonne réponse [11] « content.jpg » et une image matérialisant une mauvaise réponse [12] « mécontent.jpg »


8

9

10

11 12

- Ouvrir un à un les paramètres des listes, les propositions de la listes sont déjà saisies [13] grâce au «copier/coller» de la liste 4

- Modifier la proposition juste [14] correspondant à l'expression.- Saisir les visibilités :

- si la réponse est juste : numéro de l'image qui sera visible [15]- si la réponse est fausse : numéro de l'image qui sera visible [16]

- Pour chaque ligne empiler les deux images l'une sous l'autre (17)

- Insérer un bouton valider, un objet score et éventuellement un bouton multifonctions « refaire » (18)

- Paramètrer le bouton valider : - Saisir le nom du bouton, le nombre de tentatives - Cocher « comptabiliser les scores » (19) - Saisir les numéros des éléménts : (20)

- devant apparaître (le bouton refaire +27, le score +26,) - devant disparaître (le bouton valider -25)

Valider


16

13

14

15

12

17

1315

16

18

19

20

11. Valider les réponses par un commentaire sonore

Dans cet exemple, après validation le lecteur entendra

un commentaire sonore sur le travail réalisé.


Les éléments glisser/déposer de la page :

- Insérer une zone cible (1)

- Passer quelques lignes dans la console et insérer les images (2)

- Paramétrer la zone cible

- Copier la zone cible autant de fois que nécessaire (avant les images) (3)

- Paramétrer toutes les zones cibles

- Valider par un clic sur Ok

Les éléments sonores de la page :

- Insérer les sons mp3 (4)

- Insérer l'image symbolisant le son autant de fois que nécessaire (5)

- Insérer les zones réactives et les placer sur chaque image symbole du son (6)

- Paramétrer chaque zone sensible

- Cacher les sons mp3 sous chaque image symbole du son


21

3

4

5

6


Les éléments de validation :

- Insérer un bouton de validation, un objet score et éventuellement un bouton multiposition (refaire) (7)

- Créer les fichiers sons (à l'aide de Dspeech ou en s'enregistrant soi-même)

- Insérer les fichiers sons (8)

- Insérer si besoin les images validant l'exercice (9)

- Paramétrer l'élément score

- Cocher «score la page» (10) - Choisir un titre et une couleur (11)

- Saisir les visibilités :

- pour un score compris entre 0 et 70% (12) : - apparition de l'image +47 « mecontent.jpg » - lancement du fichier son +19 «deserreurs.mp3»

- pour un score compris entre 65 et 95% (13) : - apparition de l'image +49 «bof.jpg » - lancement du fichier son +19 «unerreur.mp3»

- pour un score compris entre 95 et 100% (14) - apparition de l'image « content.jpg » pour - lancement du fichier son +19 «unerreur.mp3» - lancement du fichier son +19 «unerreur.mp3»

- Valider par un clic sur Ok

- Paramétrer le bouton valider (15)

- Empiler les smileys

- Cacher les fichiers sons en les empilant et en les glissant sous les smileys (16)


7

3

4

11

10

1213

15

16

14

8

9

13. Faire une page récapitulant les scores

Dans cet exemple, à la fin du livret une page affichera l'ensemble des scores obtenus


- Ouvrir la console d'édition et insérer les éléments textes permettant de récapituler les scores (1)

- Insére

- Insérer les éléments scores (3)

- Renseigner les paramètres de chaque élément de score (4):

- Insérer deux éléments scores en bas de page (5)

- Insérer un bouton refaire, un bouton imprimer et 3 images pour l'évaluation (6)


1

3

4 4 4

5


- Paramétrer le bouton mutifonction «refaire tout le livret » un bouton refaire (7)

-

- Paramétrer les scores du livre :


1

6

7

Documents

Création des exercices interactifs avec : Didapagescircgdquevilly.spip.ac-rouen.fr/IMG/pdf/tutoriel-complet...Didapages p.2 p.4 p.5 p.7 p.10 p.13 p.16 p.18 p.21 p.23 p.26 p.27 1