# 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)