CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer,...

10
C CRÉER RÉER UN UN LIVRE LIVRE INTERACTIF INTERACTIF AVEC AVEC D DIDAPAGES IDAPAGES Didapages : pour quoi faire ? Il permet de créer et de lire des livres interactifs. Il est : Interactif : les pages se tournent, on peut insérer différents médias Facile et gratuit Illimité : contenus variables à l’infini … Didapages : quel contenu ? Textes Saisie directe ou utilisation de la fonction copier/coller Images JPG non progressif Sons MP3 Vidéos FLV uniquement (AVI, MPEG, MOV... doivent être convertis. Une même vidéo ne peut être utilisée qu'une seule fois dans le livre Animations SWF (flash) Ne nommer jamais vos fichiers avec des accents, des trémas, des traits d’union. Exercice 1 : Démarrer un nouveau projet 1.Lancer Didapages 1 . 2.Démarrer un nouveau projet et définissez ses paramètres. 3.Cliquer sur créer pour auto-générer le livre. 4.Ouvrir le livre en cliquant sur la couverture, puis sur le coin ou sur les tranches pour tourner les pages. 1 Didapages est téléchargeable à l'adresse suivante : http://www.fruitsdusavoir.org/ TICE CDDP64 1/10 Remarques :

Transcript of CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer,...

Page 1: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Didapages : pour quoi faire ?Il permet de créer et de lire des livres interactifs. Il est :

• Interactif : les pages se tournent, on peut insérer différents médias• Facile et gratuit • Illimité : contenus variables à l’infini …

Didapages : quel contenu ?

Textes Saisie directe ou utilisation de la fonction copier/coller

Images JPG non progressif

Sons MP3

Vidéos FLV uniquement (AVI, MPEG, MOV... doivent être convertis. Une même vidéo ne peut être utilisée qu'une seule fois dans le livre

Animations SWF (flash)

Ne nommer jamais vos fichiers avec des accents, des trémas, des traits d’union.

Exercice 1 : Démarrer un nouveau projet

1.Lancer Didapages1.

2.Démarrer un nouveau projet et définissez ses paramètres.

3.Cliquer sur créer pour auto-générer le livre.

4.Ouvrir le livre en cliquant sur la couverture, puis sur le coin ou sur les tranches pour tourner les pages.

1 Didapages est téléchargeable à l'adresse suivante : http://www.fruitsdusavoir.org/

TICE CDDP64 1/10

Remarques :

Page 2: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 2 : Éditer une page de garde

Sur la première page, nous allons intégrer un titre, du texte et une image

1. Se positionner sur la première page et cliquer sur Éditer pour la modifier.

2. Insérer une première zone de texte pour le titre, puis une autre pour la description du projet. Inscrire le texte en cliquant sur la zone.

3. Pour déplacer une zone, cliquer, maintenir cliqué et déplacer le numéro. Pour modifier la taille d'une zone, cliquer, maintenir cliqué et déplacer l'étoile.

4. Afin d'insérer une média, il faut au préalable l'importer dans la projet depuis le Menu Projet

TICE CDDP64 2/10

Remarques :

Page 3: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

5. Il suffit ensuite d'ajouter une zone image à la page et de choisir le bon fichier.

6. Enregistrer le livre (ne pas mettre de caractères spéciaux, d'accents ou d'espaces).

Exercice 3 : Insérer du sonChaque média doit être importé avant d'être intégré à une page.

1.Dans Firefox, installer le module Embedded Objects2 qui permet de télécharger de nombreux médias

2.Télécharger un son au format mp33 depuis internet et l'intégrer à la nouvelle page.

3.A l'aide du logiciel Audacity, enregistrer un son et l'inclure dans la page.

2https://addons.mozilla.org/fr/firefox/addon/5258 3http://www.mp3000.net/

TICE CDDP64 3/10

Remarques :

Page 4: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 4 : Insérer des vidéos

1.Dans Firefox, à l'aide du module Embedded Objects, télécharger plusieurs vidéos et les intégrer dans une nouvelle page de Didapages.Exemples de sites téléchargement direct:

http://www.energivores.tv

Exemples de sites avec Embedded objects:

http://c-est-pas-sorcier.france3.fr/http://www.curiosphere.tvhttp://www.canal-educatif.frhttp://www.m6.frhttp://www.alloclips.comhttp://videos.tf1.fr/clip-musique/http://www.ina.fr

Seul le format flv est supporté. Si vos vidéos ne sont pas à ce format (avi, mpeg, mob...), il faut télécharger un logiciel vous permettant de les convertir.

Vous pouvez utiliser le logiciel suivant : Free Video to Flash Converter4

2.Télécharger une vidéo à l'adresse suivante :http://www.evenement.sncf.com/sncf/enseignants/module_voyage.html

La convertir en flv et l'intégrer à Didapages.

4http://www.01net.com/telecharger/windows/Internet/editeur_de_site/fiches/50701.htmlTICE CDDP64 4/10

Remarques :

Page 5: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 5 : Insérer des animations flash

Les animations Flash ont une extension particulière : .swf. Nous allons donc chercher ce type de fichier sur internet.

1. Dans votre navigateur internet, se rendre sur le moteur de recherche Google.

2. A droite de la zone de saisie, sélectionner Recherche avancée. Saisir les expressions recherchées, puis en face de format choisir Shockwave Flash.

3. N'apparaissent alors que les animations flash correspondant à la recherche.

4. Télécharger une ou deux animations et les insérer dans Didapages.

TICE CDDP64 5/10

Remarques :

Page 6: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 6 : aligner des objets

Il est possible d'aligner plusieurs éléments sur une page.

1.Insérer 4 images et les aligner verticalement au centre et horizontalement en haut. Penser à ne pas laisser une partie de la zone image vide.

Exercice 7 : Créer un modèle de pages

Si vos pages doivent avoir toutes le même contenu, il est possible de créer un modèle de page.

1. Créer une nouvelle page qui vous servira de page de modèle. Y insérer les différentes zones souhaitées.

2. Dans l'édition de la page, cliquer sur Gestion des pages-types. Lui donner un nom et enregistrer.

3. Sur une nouvelle page, dans la barre du haut, cliquer sur le Puis choisir le modèle crée précédemment. La nouvelle page possède alors les mêmes attributs que la page de modèle.

Si le nombre de pages identiques est limité, on peut également copier la page et la coller sur une nouvelle page vierge.

TICE CDDP64 6/10

Remarques :

Page 7: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 8 : Créer un exerciceNous allons créer un exercice de type QCM sur l'identification du son [a] dans différents mots.

1. Sur une nouvelle page, créer ou importer les éléments suivants :

• Une zone de texte pour le titre

• 4 zones d'images et 4 zones de sons correspondantes

• 4 zones de texte correspondantes aux images

• 8 zones de textes pour oui/non

2. Insérer maintenant 8 cases à cocher.

3. Il faut maintenant paramétrer ces cases. N'oubliez pas d'indiquer les points en jeu pour chaque case.

4.Insérer maintenant un bouton validation et le score score. Il ne vous reste plus qu'à tester votre exerciseur.

TICE CDDP64 7/10

Remarques :

Page 8: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 9 : Insérer une zone réactive

La zone réactive permet de faire apparaître ou disparaître un objet par survol ou par clic.

1. Sur une nouvelle page, dans l'édition, insérer une zone réactive.

2. Insérer ensuite une image (qui apparaitra de suite) et un texte (qui apparaitra au survol).

3.Éditer la zone de survol et en face de l'option Visibilité au survol, indiquer + et le numéro de la zone. Placer la zone de survol au dessus de l'image.

4.Tester le résultat

TICE CDDP64 8/10

Remarques :

Page 9: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 10 : Utiliser le bouton multifonction

Le bouton multifonction permet d'imprimer une sélec-tion de pages, de réinitialiser une page ou de créer un lien vers une page internet.

1. Insérer un bouton multifonction et lui attribuer un lien vers le site internet de votre choix.

Exercice 11 : Générer le livre

Une fois le livre terminé, il faut l'exporter.

1.Cliquer sur Générer le livre. Un rapport d'erreurs peut apparaître.

2.Cliquer sur suivant puis sélectionner le répertoire d'exportation. Le livre s'exporte alors.

3.Dans le répertoire, cliquer sur index.html pour ouvrir le livre. L'ensemble du dossier peut être placé sur internet pour une consultation en ligne.

TICE CDDP64 9/10

Remarques :Remarques :

Page 10: CRÉER UN LIVRE INTERACTIF AVEC DIDAPAGES ·  · 2013-11-203. Pour déplacer une zone, cliquer, ... module Embedded Objects2 qui permet de télécharger de ... mpeg, mob...), il

CCRÉERRÉER UNUN LIVRELIVRE INTERACTIFINTERACTIF

AVECAVEC D DIDAPAGESIDAPAGES

Exercice 12 : Créer un CD-ROM auto-exécutable du projet

1. Faire une copie de votre dossier exporté

2. Sur internet, télécharger le lecteur flash intitulé : lecteur.exe5 ou lecteur9.exe, puis le copier dans le dossier généré de votre livre.

3. Supprimer les fichiers lecteur.swf et index.html

Le projet s'ouvre maintenant en grand écran lorsqu'on clique sur lecteur9.exe

Il faut maintenant crée un fichier de démarrage pour l'auto-exécution du futur CD-ROM.

4.Dans le bloc-note de Windows, saisir les informations suivantes:

5.Enregistrer le fichier dans votre projet généré sous le nom : Autorun.inf

Il ne vous reste plus qu'à graver votre projet sur CD-rom à l'aide d'un logiciel de gravure.

5http://www.fruitsdusavoir.org/forum/viewtopic.php?id=343TICE CDDP64 10/10

Remarques :