# Contenus interactifs # Présentation des contenus interactifs ### Les contenus interactifs H5P Dans cette présentation, vous retrouverez l'ensemble de contenus interactifs possibles grâce à H5P. Pour chaque contenu, une petite présentation vous permettra de comprendre quand et pour quoi utiliser ce type de contenu, illustré d'un visuel. Si vous voulez construire l'un de ces contenus dans un de vos cours Moodle, cliquez simplement sur le nom du contenu, vous serez alors redirigé·e·s directement sur la page tutorielle correspondante. #### [Accordion](https://wiki.unil.ch/cse/books/h5p/page/accordion) **Réduisez la quantité de texte présentée** à vos lecteurs sur la page de cours en utilisant cet accordéon interactif. Les apprenants décident quel thème examiner de plus près en développant le titre. Excellent pour fournir une vue d'ensemble avec des explications détaillées optionnelles. [![image-1628149448320.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/TMaeFqFf2JdYM7RI-image-1628149448320.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/TMaeFqFf2JdYM7RI-image-1628149448320.png) #### [Timeline](https://wiki.unil.ch/cse/books/h5p/page/timeline) Le module Timeline vous permet de créer une **frise temporelle interactive**, en plaçant une séquence d'événements dans un ordre chronologique. [![image-1628149459509.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/1kgRoRBpuN7qZyHq-image-1628149459509.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/1kgRoRBpuN7qZyHq-image-1628149459509.png) Pour chaque événement, vous pouvez ajouter des images et des textes. Vous pouvez également inclure des ressources provenant de Twitter, YouTube, Flickr, Vimeo, Google Maps et SoundCloud. Ce module H5P rend les frises temporelles facilement modifiables, partageables et réutilisables. #### [Dialog Cards](https://wiki.unil.ch/cse/books/h5p/page/dialog-cards) Les cartes de dialogue peuvent être utilisées pour **aider les apprenants à mémoriser des mots**, des expressions ou des phrases. Sur le recto de la carte, il y a un indice pour un mot ou une expression. En tournant la carte, l'apprenant révèle un mot ou une expression correspondante. [![image-1632233068260.54.30.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/zU9KRY7KxIWsgV16-image-1632233068260-54-30.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/zU9KRY7KxIWsgV16-image-1632233068260-54-30.png) Les cartes de dialogue peuvent être utilisées dans l'**apprentissage d'une langue**, pour **présenter des problèmes de mathématiques** ou aider les apprenants à **se souvenir de faits tels que des événements historiques**, **des formules ou des noms**. #### [Image Hotspots](https://wiki.unil.ch/cse/books/h5p/page/image-hotspots) Le module Image hotspots permet de créer une image avec **des points cliquables interactifs**. Lorsque l'utilisateur clique sur un point, une fenêtre contextuelle contenant un en-tête et du texte ou une vidéo s'affiche. [![image-1632233102737.47.27.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/5n14Sc5vn2PYHzX5-image-1632233102737-47-27.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/5n14Sc5vn2PYHzX5-image-1632233102737-47-27.png) A l'aide de l'éditeur H5P, vous pouvez ajouter autant de points que vous le souhaitez. #### [Chart](https://wiki.unil.ch/cse/books/h5p/page/chart "Chart") Un type de contenu graphique permettant aux utilisateurs de créer des **camemberts** et des **diagrammes** à barres avec H5P, pour présenter graphiquement des données statistiques simples sans créer l'illustration manuellement. #### [Agamotto](https://wiki.unil.ch/cse/books/h5p/page/agamotto) Présentez une séquence d'images que les utilisateurs sont censés regarder les unes après les autres, par ex. des photos d'un élément qui évolue dans le temps, des schémas ou des cartes organisés en différentes couches ou des images révélant **de plus en plus de détails**. Cette activité permet aux utilisateurs de comparer et d'explorer une séquence d'images de manière interactive. Les auteurs peuvent décider d'ajouter un court texte explicatif pour chaque image. [![image-1628149482229.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/OHymh1LSb3tO6ojH-image-1628149482229.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/OHymh1LSb3tO6ojH-image-1628149482229.png)![image-1628149494053.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/vDZ20iI43nDcNVs9-image-1628149494053.png) #### [Collage](https://wiki.unil.ch/cse/books/h5p/page/collage) Un type de contenu de collage de photos permettant aux utilisateurs de configurer plusieurs photos dans une mise en page personnalisée. Le module Collage vous permet de réaliser une **composition d'images**. [![image-1628149519827.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/bFXz6lgcCEUfTwIH-image-1628149519827.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/bFXz6lgcCEUfTwIH-image-1628149519827.png) #### [Image sequencing](https://wiki.unil.ch/cse/books/h5p/page/image-slider) Un type de contenu permettant aux utilisateurs de créer des **"sliders" d'image** réactifs avec un mode plein écran d'une manière conviviale. [![image-1628584916020.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/hiAJeFo3ED9mtPdY-image-1628584916020.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/hiAJeFo3ED9mtPdY-image-1628584916020.png) #### [Audio](https://wiki.unil.ch/cse/books/h5p/page/audio) Déposez un enregistrement audio au format .mp3, .wav, .ogg ou fournissez le lien d'un enregistrement audio. [![image-1628149533485.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/kLoWK8EoYNyk56iz-image-1628149533485.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/kLoWK8EoYNyk56iz-image-1628149533485.png) #### [Image Juxtaposition](https://wiki.unil.ch/cse/books/h5p/page/image-juxtaposition) Un type de contenu qui permet aux utilisateurs de comparer deux images de manière interactive. [![image-1628149542605.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/rEospUc9ZLmMwvf8-image-1628149542605.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/rEospUc9ZLmMwvf8-image-1628149542605.png) #### [Kewar Code](https://wiki.unil.ch/cse/books/h5p/page/kewar-code) Un type de contenu vous permettant d'intégrer des QR Code renvoyant à des pages internet, des évènements, d'autres activités ou contenus H5P, ou encore du texte, un lieu, un contact. [![image-1634565277947.47.17.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/CQAagrsZgnjHa1gx-image-1634565277947-47-17.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/CQAagrsZgnjHa1gx-image-1634565277947-47-17.png) #### [360 Virtual Tour](https://wiki.unil.ch/cse/books/h5p/page/360-virtual-tour "360 Virtual Tour") Ce type de contenu permet de naviguer dans un environnement visuel dynamique, à 360 degrés. [![image-1634633934679.58.43.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/KfMzaEbkxMKvEIQY-image-1634633934679-58-43.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/KfMzaEbkxMKvEIQY-image-1634633934679-58-43.png) # Accordion
Réduisez la quantité de texte présentée à vos étudiant·e·s sur votre page de cours en utilisant l'accordéon interactif : Accordion. Les apprenants décident quel thème examiner de plus près en développant le titre. Excellent pour fournir une vue d'ensemble avec des explications détaillées optionnelles. Le texte est structuré en différentes sections que l’utilisateur peut déplier d’un simple clic. Il permet de varier la présentation des contenus de votre Moodle. Des liens peuvent être insérés mais il n’est possible d’intégrer que du texte. [![image-1628175375759.56.10.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/xN1FS1Nav68aLuxg-image-1628175375759-56-10.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/xN1FS1Nav68aLuxg-image-1628175375759-56-10.png)
### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Accordion. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner l’activité « Accordion » [![image-1628581295973.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/ZNT1lToIlrAUjfIK-image-1628581295973.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/ZNT1lToIlrAUjfIK-image-1628581295973.png) ### Étape 2 : Paramétrer mon activité H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Entrez le Titre de votre 1ère section 3\. Entrez votre contenu « texte » [![image-1628581355379.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/gl28d7IepLeCZb29-image-1628581355379.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/gl28d7IepLeCZb29-image-1628581355379.png) 4\. Cliquez sur le bouton[![image-1628581413929.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/0EXLzJuAt0KIV0Gz-image-1628581413929.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/0EXLzJuAt0KIV0Gz-image-1628581413929.png)pour créer une 2ème section et recommencer la saisie (Titre, texte) Vous pouvez ajouter autant de panel que vous le désirez. A tout moment vous pouvez supprimer ou changer l'ordre de vos sections. En cliquant sur la croix pour supprimer ou à laide des flèches pour monter ou descendre vos sections. [![image-1629707774198.36.09.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/ciaxvz8brsr8RDMi-image-1629707774198-36-09.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/ciaxvz8brsr8RDMi-image-1629707774198-36-09.png) 5\. Cliquez enfin sur « Enregistrer » pour visualiser votre accordéon interactif. Vous retrouverez facilement votre Accordion dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Accordion à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Agamotto Présentez une séquence d'images à vos étudiant·e·s. Vous pouvez par exemple proposer une séquence d'images qui doivent se succéder, pour marquer une évolution dans le temps, ou révélant de plus en plus de détails. [![image-1628512392073.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/5r7m7HrEflWr4NFR-image-1628512392073.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/5r7m7HrEflWr4NFR-image-1628512392073.png) Cette activité permet de comparer et d'explorer une séquence d'images de manière interactive. En tant qu'enseignant·e·s, vous pouvez également décider d'ajouter un texte explicatif court qui accompagnera chaque image. ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Agamotto. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner l’activité « Agamotto » [![image-1628512867846.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/9AecPmD3EUZ0wWak-image-1628512867846.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/9AecPmD3EUZ0wWak-image-1628512867846.png) ### Étape 2 : Création de mon activité Agamotto H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* [![image-1628512907794.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/F06qbEReBUyG4odF-image-1628512907794.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/F06qbEReBUyG4odF-image-1628512907794.png) 2\. Nommer votre séquence d’images et ajouter votre première image [![image-1628512965322.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/U4nibjumJz09wEhv-image-1628512965322.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/U4nibjumJz09wEhv-image-1628512965322.png) 4\. Entrez le texte alternatif associé à votre image-prise de vue [![image-1628513000117.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Imc3IQ7fF7JFKGcz-image-1628513000117.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Imc3IQ7fF7JFKGcz-image-1628513000117.png) Ainsi qu'un texte de survol si souhaité. Le texte de survol s'affichera lorsque les étudiant·e·s passeront leur souris sur la photo. Il peut inclure des précisions, des définitions, des références, par exemple. 5\. Ajouter autant d’images que nécessaires en cliquant sur ![image-1628513089785.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/hCXZxLu2pK1grCPA-image-1628513089785.png) 6\. Enregistrez votre Agamotto en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Agamotto dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Agamotto à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Audio Vous pouvez déposer un enregistrement audio au format .mp3, .wav, .ogg ou encore fournir un lien URL d'un enregistrement audio. Parfait pour enrichir un parcours d'apprentissage par exemple. [![image-1634562302916.04.44.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/xPk3SRRRH3peNy4y-image-1634562302916-04-44.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/xPk3SRRRH3peNy4y-image-1634562302916-04-44.png) ### Étape 1 : Création du contenu H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Audio. Dans la barre latérale gauche, 1. Cliquez sur le menu « Banque de contenus » 2. Puis sur « Ajouter » 3. Et sélectionner l’activité « Audio»![image-1634562338515.03.09.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/OHkZ18D7BVo7x9Sd-image-1634562338515-03-09.png) ### Étape 2 : Paramétrer mon contenu H5P Dans le formulaire qui s’affiche, 1\. Nommez votre contenu audio *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* [![image-1634562389261.02.40.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/QSzm9dEUjIe9vEO3-image-1634562389261-02-40.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/QSzm9dEUjIe9vEO3-image-1634562389261-02-40.png) 2\. Ajouter votre audio en cliquant sur le **+** [![image-1634562433385.03.25.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/zgNsdj4wDnVc542m-image-1634562433385-03-25.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/zgNsdj4wDnVc542m-image-1634562433385-03-25.png) Insérez un fichier depuis votre ordinateur ou saisissez le lien URL correspondant : [![image-1634562507367.03.32.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/6mlUMj7jSu9MYmvG-image-1634562507367-03-32.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/6mlUMj7jSu9MYmvG-image-1634562507367-03-32.png) 3\. Paramétrez le mode d'affichage que vous souhaitez : [![image-1634562523196.03.46.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/kN0RZ2e3kmwHRd69-image-1634562523196-03-46.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/kN0RZ2e3kmwHRd69-image-1634562523196-03-46.png) Vous pouvez choisir entre : [![image-1634562600460.09.46.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/1se8nXeghKZXCG6t-image-1634562600460-09-46.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/1se8nXeghKZXCG6t-image-1634562600460-09-46.png)
#### Minimaliste [![image-1634562648963.04.29.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/lnoReHciQVAiFQSO-image-1634562648963-04-29.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/lnoReHciQVAiFQSO-image-1634562648963-04-29.png)
#### Complet [![image-1634562664031.04.44.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/NtWWL7JaRaaleE3h-image-1634562664031-04-44.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/NtWWL7JaRaaleE3h-image-1634562664031-04-44.png)
#### Transparent Rien ne s'affichera
4\. Paramétrez les commandes pour vos étudiant·e·s : [![image-1634562733689.04.12.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/4CvSI0tLox1hCa53-image-1634562733689-04-12.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/4CvSI0tLox1hCa53-image-1634562733689-04-12.png) 5\. Cliquez enfin sur « Enregistrer » pour visualiser votre Audio. Vous retrouverez facilement votre Audio dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Audio à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Chart Un type de contenu graphique permettant aux utilisateurs de créer des **camemberts** et des **diagrammes** à barres avec H5P, pour présenter graphiquement des données statistiques simples sans créer l'illustration manuellement. [![Capture d’écran 2023-02-14 à 16.48.30.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/LDG7XAaVH0Xub12w-capture-decran-2023-02-14-a-16-48-30.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/LDG7XAaVH0Xub12w-capture-decran-2023-02-14-a-16-48-30.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Chart. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner le contenu « Chart » [![Capture d’écran 2023-02-14 à 15.45.52.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/V1W7ipUH9bLhEO38-capture-decran-2023-02-14-a-15-45-52.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/V1W7ipUH9bLhEO38-capture-decran-2023-02-14-a-15-45-52.png) ### Étape 2 : Création de mon activité Collage H5P Dans le formulaire qui s’affiche, [![Capture d’écran 2023-02-14 à 15.54.00.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/ZbJuKXjP3WzHp1zQ-capture-decran-2023-02-14-a-15-54-00.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/ZbJuKXjP3WzHp1zQ-capture-decran-2023-02-14-a-15-54-00.png) 1\. Donnez un titre à votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Choisissez le type de graphique que vous souhaitez créer : Camembert ou Graphique en barre. 3\. Entrez vos données en écrivant le nom et la valeur numérique de chaque part du graphique. Choississez la couleur du texte et de la zone du camembert/graphique, faites attention à ce que la couleur de police soit lisible par rapport à la couleur de fond. 4\. Enregistrez votre Chart en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Chart dans votre Banque de contenus et pourrez le modifier, à tout moment. [![Capture d’écran 2023-02-14 à 16.48.30.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/LDG7XAaVH0Xub12w-capture-decran-2023-02-14-a-16-48-30.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/LDG7XAaVH0Xub12w-capture-decran-2023-02-14-a-16-48-30.png) ### Étape 3 : Intégrez votre activité Collage à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Collage Un type de contenu de collage de photos vous permet de configurer plusieurs photos dans une mise en page personnalisée. Le module Collage vous permet ainsi de réaliser une composition d'images. [![image-1628580778549.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/BxmZiLHacxn37meP-image-1628580778549.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/BxmZiLHacxn37meP-image-1628580778549.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Collage. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner le contenu « Collage » [![image-1628580834354.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/DPZkh33fplELhNzh-image-1628580834354.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/DPZkh33fplELhNzh-image-1628580834354.png) ### Étape 2 : Création de mon activité Collage H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* [![image-1628580861959.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/x4HDcIu2GoU8gkrO-image-1628580861959.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/x4HDcIu2GoU8gkrO-image-1628580861959.png) 2\. Choisissez le modèle de collage désiré 3\. Ajoutez votre première image en cliquant sur le [![image-1628580880777.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/ouWQT8Dg434ha7Ht-image-1628580880777.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/ouWQT8Dg434ha7Ht-image-1628580880777.png) [![image-1628580930197.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/DL2whof5jLJIXbhR-image-1628580930197.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/DL2whof5jLJIXbhR-image-1628580930197.png) 4\. Modifiez votre image • Zoomez ou dé-zoomez votre image à l'aide du + et - en haut à gauche [![image-1628580948970.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/X4qOPYmtY58Ctr9L-image-1628580948970.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/X4qOPYmtY58Ctr9L-image-1628580948970.png) • Avec votre souris ![image-1628580992996.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/wVWMoq08ikYBAn71-image-1628580992996.png), déplacez l’image pour cadrer comme souhaité [![image-1628581018311.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/4QaWQ1fS8Bf4Aa23-image-1628581018311.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/4QaWQ1fS8Bf4Aa23-image-1628581018311.png) 5\. Réglez l’ergonomie générale de votre collage. Gérez les espacements entre vos images, leurs tailles, etc. [![image-1628581058584.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/stAtC0CWZ9g8QrwF-image-1628581058584.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/stAtC0CWZ9g8QrwF-image-1628581058584.png) 6\. Enregistrez votre Collage en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Collage dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Collage à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Dialog Cards Les cartes de dialogue peuvent être utilisées pour aider les apprenants à mémoriser des mots, des expressions ou des phrases. Elles permettent également d'introduire des concepts, de réviser et de réguler leur croyances de maitrise. Sur le recto de la carte, il y a un indice ou une interrogation. En tournant la carte, l'apprenant révèle un mot, une expression ou une réponse correspondante. Les cartes de dialogue peuvent être utilisées dans l'apprentissage d'une langue, pour présenter des problèmes de mathématiques ou aider les apprenants à se souvenir de faits tels que des événements historiques, des formules ou des noms, mais également pour amorcer une réflexion. ### [![image-1632207354270.54.30.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/bRP66LQWf8a05x78-image-1632207354270-54-30.png) ](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/bRP66LQWf8a05x78-image-1632207354270-54-30.png)[![image-1632207348188.54.37.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/ON9Mi8Xi1IUPJHlg-image-1632207348188-54-37.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/ON9Mi8Xi1IUPJHlg-image-1632207348188-54-37.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Dialog Cards. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner l’activité « Dialog Cards » [![image-1632207923929.51.06.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/vXH9FqI6GaRSISCa-image-1632207923929-51-06.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/vXH9FqI6GaRSISCa-image-1632207923929-51-06.png) ### Étape 2 : Paramétrer mon activité H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Entrez une entête si vous le désirez 3\. Entrez une consigne [![image-1632207955175.50.16.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/NIxU4NX2CRdvN1pk-image-1632207955175-50-16.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/NIxU4NX2CRdvN1pk-image-1632207955175-50-16.png) 4\. Choisissez le mode de fonctionnement de vos cartes [![image-1632208066395.50.28.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/BcMoSIDASunE9emP-image-1632208066395-50-28.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/BcMoSIDASunE9emP-image-1632208066395-50-28.png) 5\. Remplissez le recto (question) et verso (réponse) de votre première carte. [![image-1632208117002.51.42.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/DcEO7MAoJT0OJBpV-image-1632208117002-51-42.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/DcEO7MAoJT0OJBpV-image-1632208117002-51-42.png) 6\. Cliquez sur le bouton[![image-1632208213241.09.38.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/0mZQlnwyiIeo6HMx-image-1632208213241-09-38.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/0mZQlnwyiIeo6HMx-image-1632208213241-09-38.png)pour créer une 2ème carte et recommencer la saisie (Question, Réponse) Vous pouvez ajouter autant de cartes que vous le désirez. A tout moment vous pouvez supprimer ou changer l'ordre de vos sections. En cliquant sur la croix pour supprimer ou à laide des flèches pour monter ou descendre vos sections. [![image-1632208360806.12.26.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/8O4oUdpgM3ObLn43-image-1632208360806-12-26.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/8O4oUdpgM3ObLn43-image-1632208360806-12-26.png) 5\. Cliquez enfin sur « Enregistrer » pour visualiser vos dialog cards. Vous retrouverez facilement vos Dialog cards dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Dialog Cards à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Image Hotspots Le module Image hotspots permet de créer une image avec des points cliquables interactifs. Lorsque l'étudiant·e clique sur un point, une fenêtre contextuelle contenant une en-tête et du texte, un image ou une vidéo s'affiche. A l'aide de l'éditeur H5P, vous pouvez ajouter autant de points que vous le souhaitez. [![image-1632232081688.47.27.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/XWEhomGH5BwArzTt-image-1632232081688-47-27.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/XWEhomGH5BwArzTt-image-1632232081688-47-27.png) [![image-1632232091632.47.41.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/nnKgaRcDJfShWHRQ-image-1632232091632-47-41.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/nnKgaRcDJfShWHRQ-image-1632232091632-47-41.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Image Hotspots. Dans la barre latérale gauche, 1. Cliquez sur le menu « Banque de contenus » 2. Puis sur « Ajouter » 3. Et sélectionner le contenu « Image Hotspots » ### Étape 2 : Création de mon contenu cliquable Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Et choisissez l'image d'arrière plan (sur laquelle les étudiant·e·s cliqueront pour voir apparaître des informations). [![image-1632232259902.39.24.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/nLdEl3NTO0xboJMb-image-1632232259902-39-24.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/nLdEl3NTO0xboJMb-image-1632232259902-39-24.png) 3\. Sélectionnez l'emplacement de la puce cliquable, et déplacer la à souhait dans votre image. [![image-1632232431886.53.24.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/BIygnx62daChsrXj-image-1632232431886-53-24.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/BIygnx62daChsrXj-image-1632232431886-53-24.png) Si vous voulez agrandir votre image pour repositionner votre puce avec plus de précision, cliquez sur la petite loupe, en bas à gauche : [![image-1632232477024.53.32.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/0VwaDR14m25UaHg5-image-1632232477024-53-32.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/0VwaDR14m25UaHg5-image-1632232477024-53-32.png) 4\. Une fois votre puce positionnée, compléter le contenu du pop up qui apparaitra lorsque vos étudiant·e·s cliqueront. Vous avez le choix du type de contenu : Texte, image ou vidéo. Vous pouvez ainsi insérer une vidéo depuis votre ordinateur ou à l'aide d'un URL (YouTube). [![image-1632232278340.39.47.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/scaled-1680-/lL2LKpsQW30frESL-image-1632232278340-39-47.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-09/lL2LKpsQW30frESL-image-1632232278340-39-47.png) 5\. Ajouter un second ou plusieurs autres contenus si souhaitez et d'autres puces sur la même image en cliquant sur "Ajouter puces cliquables". 6\. Enregistrez votre contenu image cliquable en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Image Hotspots dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Image Hotspots à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Image Juxtaposition Ce type de contenu vous permet de comparer deux images de manière interactive, horizontalement ou verticalement. [![image-1633938762817.50.48.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/LCRjItsWYIE4zxoy-image-1633938762817-50-48.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/LCRjItsWYIE4zxoy-image-1633938762817-50-48.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Image Juxtaposition. Dans la barre latérale gauche, 1. Cliquez sur le menu « Banque de contenus » 2. Puis sur « Ajouter » 3. Et sélectionner le contenu « Image Juxtaposition » [![image-1633938825448.48.05.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/b3uzRfsRJzt8ZvLN-image-1633938825448-48-05.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/b3uzRfsRJzt8ZvLN-image-1633938825448-48-05.png) ### Étape 2 : Création de mon contenu Image Juxtaposition Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Le Titre\* n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* *Le Titre serait affiché en haut de votre contenu, lors de la visualisation par les étudiant·e·s.* [![image-1633938855940.49.10.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/cpK6tNUUrK9oY0gW-image-1633938855940-49-10.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/cpK6tNUUrK9oY0gW-image-1633938855940-49-10.png) 2\. Ajouter votre première image en cliquant sur le bouton "**+** Ajouter". 3\. Ajouter un texte alternatif obligatoire et un texte de survol, facultatif. Par exemple, pour donner des informations complémentaires. [![image-1633938930822.49.24.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/D4GlaiG3OipS92r7-image-1633938930822-49-24.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/D4GlaiG3OipS92r7-image-1633938930822-49-24.png) 4\. Renouvelez cette opération pour votre seconde image. [![image-1633939097384.50.09.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/KcMZp0v6F5YbMlwY-image-1633939097384-50-09.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/KcMZp0v6F5YbMlwY-image-1633939097384-50-09.png) 5\. Définissez les paramètres de comportement. Par exemple, si vous souhaitez que la juxtaposition soit horizontale ou verticale. [![image-1633939158358.50.29.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/UeArdvSWdm6XnwAC-image-1633939158358-50-29.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/UeArdvSWdm6XnwAC-image-1633939158358-50-29.png) 6\. Enregistrez en cliquant sur [![image-1628585605915.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/jbXy5yWdX3CAaeml-image-1628585605915.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/jbXy5yWdX3CAaeml-image-1628585605915.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Image Juxtaposition dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Image Juxtaposition à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Image Sequencing Un type de contenu permettant aux utilisateurs de créer de créer un activité d'images à ordonner par glisser-déposer. [![Capture d’écran 2023-02-14 à 17.18.36.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/HqbO03qWriPqsjYM-capture-decran-2023-02-14-a-17-18-36.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/HqbO03qWriPqsjYM-capture-decran-2023-02-14-a-17-18-36.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Image Sequencing. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner l’activité « Image Sequencing » [![Capture d’écran 2023-02-14 à 16.55.42.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/Q6qx3YEi47Rd6LEV-capture-decran-2023-02-14-a-16-55-42.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/Q6qx3YEi47Rd6LEV-capture-decran-2023-02-14-a-16-55-42.png) ### Étape 2 : Création de mon activité Image Sequencing H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Entrez une description de la tâche. Il s'agit de la consigne que les apprenant·e·s doivent suivre. 3\. Entrez une description de la tâche alternative pour les personnes avec des déficits visuels. [![Capture d’écran 2023-02-14 à 16.56.09.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/CrAPFvPlNTLI3Zui-capture-decran-2023-02-14-a-16-56-09.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/CrAPFvPlNTLI3Zui-capture-decran-2023-02-14-a-16-56-09.png) 4\. Dans la partie Images, téléversez une image à trier et donnez lui un nom. Recommencez l'opération pour chaque image en cliquant sur "Ajouter image". [![Capture d’écran 2023-02-14 à 16.56.17.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/1K29NuY0i16sOIbg-capture-decran-2023-02-14-a-16-56-17.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/1K29NuY0i16sOIbg-capture-decran-2023-02-14-a-16-56-17.png) [![Capture d’écran 2023-02-14 à 17.00.28.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/CssND6bSJomQdwcL-capture-decran-2023-02-14-a-17-00-28.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/CssND6bSJomQdwcL-capture-decran-2023-02-14-a-17-00-28.png) 5\. Enregistrez votre Image Sequencing en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Image Sequencing dans votre Banque de contenus et pourrez le modifier, à tout moment. [![Capture d’écran 2023-02-14 à 17.18.36.png](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/scaled-1680-/HqbO03qWriPqsjYM-capture-decran-2023-02-14-a-17-18-36.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2023-02/HqbO03qWriPqsjYM-capture-decran-2023-02-14-a-17-18-36.png) ### Étape 3 : Intégrez votre activité Agamotto à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Kewar Code Vous pouvez intégrer des QR Code renvoyant à des pages internet, des évènements, d'autres activités ou contenus H5P, ou encore du texte, un lieu, un contact. [![image-1634565339984.47.17.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/J8x54eUChaS9Rhqz-image-1634565339984-47-17.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/J8x54eUChaS9Rhqz-image-1634565339984-47-17.png) ### Étape 1 : Création du contenu H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Audio. Dans la barre latérale gauche, 1. Cliquez sur le menu « Banque de contenus » 2. Puis sur « Ajouter » 3. Et sélectionner le contenu « Kewar Code» [![image-1634565361696.42.18.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/MsiuV04MusPMD0sV-image-1634565361696-42-18.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/MsiuV04MusPMD0sV-image-1634565361696-42-18.png) ### Étape 2 : Paramétrer mon contenu H5P Dans le formulaire qui s’affiche, 1\. Nommez votre contenu QR Code *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* [![image-1634565386292.42.44.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/H8t58AzFOiYMTr0N-image-1634565386292-42-44.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/H8t58AzFOiYMTr0N-image-1634565386292-42-44.png) 2\. Choisissez le type de QR code que vous souhaitez générer, parmi une variété de possibilité. [![image-1634565443451.42.48.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/WYgPTKGaQ1iiEqSi-image-1634565443451-42-48.png) ](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/WYgPTKGaQ1iiEqSi-image-1634565443451-42-48.png) 3\. Paramétrez le mode d'affichage que vous souhaitez : [![image-1634565513552.44.17.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/nzKUfxwbSEQAL6D5-image-1634565513552-44-17.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/nzKUfxwbSEQAL6D5-image-1634565513552-44-17.png) 4\. Cliquez enfin sur « Enregistrer » pour visualiser votre QR Code. Vous retrouverez facilement votre Audio dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Kewar Code à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # Timeline Vous pouvez créez une frise temporelle interactive, en plaçant une séquence d'événements dans un ordre chronologique. Pour chaque événement, vous pouvez ajouter des images et des textes. Vous pouvez également inclure des ressources provenant de Twitter, YouTube, Flickr, Vimeo, Google Maps et SoundCloud. Ce module H5P rend les frises temporelles facilement modifiables, partageables et réutilisables. Excellent pour fournir une vue d'ensemble chronologique. [![image-1628588179015.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/F418UeSFJysInDh2-image-1628588179015.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/F418UeSFJysInDh2-image-1628588179015.png) ### Étape 1 : Création de l’activité H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Timeline. Dans la barre latérale gauche, 1\. Cliquez sur le menu « Banque de contenus » 2\. Puis sur « Ajouter » 3\. Et sélectionner le contenu « Timeline » [![image-1628588310783.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/zz36p27Ns7OMs9D4-image-1628588310783.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/zz36p27Ns7OMs9D4-image-1628588310783.png) ### Étape 2 : Paramétrage de mon activité H5P Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Ce nom n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* 2\. Entrez le Titre de votre 1ère section 3\. Entrez votre contenu « texte » de présentation [![image-1628588375079.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/6GiYBJMSPdSEgksC-image-1628588375079.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/6GiYBJMSPdSEgksC-image-1628588375079.png) 4\. Personnalisez l’arrière plan de votre frise (facultatif) en intégrant une image depuis votre ordinateur ou à l’aide d’un URL 5\. Intégrez les crédits de l’image et une légende éventuelle [![image-1628588398203.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/DX6Ry151YZpn7QmR-image-1628588398203.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/DX6Ry151YZpn7QmR-image-1628588398203.png) 6\. Remplissez vos évènements : • Dans la section « Dates » : les évènement qui apparaitront sur la frise [![image-1628588413662.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/PJCSNcUhGIglJykH-image-1628588413662.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/PJCSNcUhGIglJykH-image-1628588413662.png) • Dans la section « Périodes » : les périodes qui s’afficheront en bas de votre frise #### Ajouter des « Dates »
1\. Entrez les dates de début et de fin de votre évènement 2\. Entrez le Titre de votre évènement 3\. Entrez le texte éventuel que vous voulez associer à cet évènement (explications, définitions, etc.) [![image-1628588518324.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/XWpCFjaxhkOLWyDT-image-1628588518324.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/XWpCFjaxhkOLWyDT-image-1628588518324.png)
4\. Ajouter un média URL et une miniature pour illustrer votre évènement Sous "Etiquette", ouvrez le menu déroulant "Média" [![image-1628588641207.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/RqpKc4B1OqjnMeGO-image-1628588641207.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/RqpKc4B1OqjnMeGO-image-1628588641207.png) [![image-1628588607957.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/eSdzWAr1LZ9CH5gd-image-1628588607957.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/eSdzWAr1LZ9CH5gd-image-1628588607957.png) 5\. Ajouter les crédits et une légende 6\. Ajouter une nouvelle date Cliquez sur « Ajouter item » et reproduire la procédure #### Ajouter des « Périodes » 7\. Entrez les dates de début et de fin de votre période 8\. Entrez le Titre de votre période 9\. Entrez le texte éventuel que vous voulez associer à cette période 10\. Ajouter une nouvelle période à votre frise Cliquez sur « Ajouter item » et reproduire la procédure 11\. Enregistrez votre Timeline en cliquant sur [![image-1628513206696.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/Xgs6nz9rdC7DEMmy-image-1628513206696.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/Xgs6nz9rdC7DEMmy-image-1628513206696.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Timeline dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité Timeline à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P"). # 360 Virtual Tour Ce type de contenu permet de naviguer dans un environnement visuel dynamique, à 360 degrés. [![image-1634633934679.58.43.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/KfMzaEbkxMKvEIQY-image-1634633934679-58-43.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/KfMzaEbkxMKvEIQY-image-1634633934679-58-43.png) ### Étape 1 : Création du contenu H5P Avant tout chose, rendez-vous sur la plate-forme Moodle de l'Unil. Une fois connecté·e à votre compte Moodle, rendez-vous dans votre tableau de bord et sélectionnez le cours pour lequel vous désirez créer un contenu Virtual Tour. Dans la barre latérale gauche, 1. Cliquez sur le menu « Banque de contenus » 2. Puis sur « Ajouter » 3. Et sélectionner le contenu « Virtual Tour » [![image-1634634536419.08.44.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/kvao0cCabY0YzZMM-image-1634634536419-08-44.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/kvao0cCabY0YzZMM-image-1634634536419-08-44.png) ### Étape 2 : Création de mon contenu Virtual Tour (360) Dans le formulaire qui s’affiche, 1\. Nommez votre activité *Le Titre\* n'apparaîtra pas dans votre cours, même une fois l'activité ou le contenu intégré. Il s'agit du nom qui s’affichera dans votre banque de contenus. Vous pourrez ainsi facilement le retrouver.* [![image-1634634579491.01.15.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/NiPye177cfo0MiOR-image-1634634579491-01-15.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/NiPye177cfo0MiOR-image-1634634579491-01-15.png) 2\. Ajouter votre première image ou séquence d'image en cliquant sur le bouton [![image-1634634615011.01.32.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/FZgd8jlR2oY1LJzb-image-1634634615011-01-32.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/FZgd8jlR2oY1LJzb-image-1634634615011-01-32.png)Et ajouter un texte alternatif obligatoire. Par exemple, la source. 3\. Ajouter de l'interactivité à votre contenu : [![image-1634635467580.23.03.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/gWjnp9aXhnNDoVDi-image-1634635467580-23-03.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/gWjnp9aXhnNDoVDi-image-1634635467580-23-03.png) 4\. Paramétrez les comportements généraux de votre contenu (eg. piste audio, qualité de rendu, ect.) [![image-1634634665804.03.18.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/trWQD4qVAmWqDnLg-image-1634634665804-03-18.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/trWQD4qVAmWqDnLg-image-1634634665804-03-18.png) 5\. Définissez les paramètres de comportement. Par exemple, si vous souhaitez que la juxtaposition soit horizontale ou verticale. [![image-1633939158358.50.29.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/scaled-1680-/UeArdvSWdm6XnwAC-image-1633939158358-50-29.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-10/UeArdvSWdm6XnwAC-image-1633939158358-50-29.png) 6\. Enregistrez en cliquant sur [![image-1628585605915.png](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/scaled-1680-/jbXy5yWdX3CAaeml-image-1628585605915.png)](https://wiki.unil.ch/cse/uploads/images/gallery/2021-08/jbXy5yWdX3CAaeml-image-1628585605915.png)pour visualiser votre contenu interactif. Vous retrouverez facilement votre Image Juxtaposition dans votre Banque de contenus et pourrez le modifier, à tout moment. ### Étape 3 : Intégrez votre activité 360 Virtual Tour à votre cours Moodle Vous pouvez maintenant **diffuser votre module H5P** dans votre page Moodle. Vous pouvez l'[intégrer directement sur la page d'accueil de votre cours à l'aide d'une Etiquette](https://wiki.unil.ch/cse/books/h5p/page/option-1-integration-dans-la-page-de-cours "Option 1 : Intégration dans la page de cours (Ressource Étiquette)") ou la [diffuser à l'aider d'une activité H5P](https://wiki.unil.ch/cse/books/h5p/page/option-3-diffusion-de-lactivite-ou-du-contenu-h5p "Option 2 : Diffusion de l’activité ou du contenu H5P").