Contenu interactif H5P

Note : Cette page fait référence au plugin tiers H5P. Les fonctionnalités H5P sont présentes en standard dans Moodle depuis la version 3.8 et les contenus H5P peuvent être créés dans la Banque de contenus et ajoutés à votre cours comme Activité H5P. Ces contenus peuvent aussi être intégrés dans des activités ou ressources de Moodle au moyen du bouton H5P de l'éditeur Atto ou le filtre Affichage H5P. Consulter H5P pour plus d'info à ce sujet.

Faits marquants

Points forts

• H5P vous donne accès à différents types de contenu interactif (voir les « Activités disponibles pour la création à partir du plugin » ci-dessous).
• H5P vous permet de partager et de réutiliser facilement le contenu.
  • Pour réutiliser le contenu, il suffit de télécharger le H5P que vous souhaitez modifier et d'effectuer vos modifications. Par exemple, traduire dans une nouvelle langue ou l'ajuster à une nouvelle situation.

Vue d'ensemble

Ajouter à votre cours des activités H5P

• H5P facilite la création, la diffusion et la réutilisation du contenu et des applications HTML5.
• H5P permet aux utilisateurs créatifs de créer des expériences Web riches et interactives d'une manière efficace : tout ce dont vous avez besoin est un navigateur Web et un site Web avec un plugin H5P.

Remarque: Moodle peut enchâsser les médias HTML5.

Utilisation libre

• Une fois publié, les contenus H5P sont disponibles sur tous les appareils numériques, fixes et mobiles (tablettes et téléphones intelligents).
• H5P est une technologie complètement libre d'accès, autorisée avec la licence MIT.
• Les démonstrations / téléchargements, les tutoriels et la documentation sont disponibles pour les utilisateurs qui souhaitent se joindre à la communauté.

Partage d'un contenu enrichi

• H5P permet aux CMS et aux LMS existants (tels que Moodle) de créer du contenu enrichi.
• Avec H5P, les auteurs peuvent créer et éditer des vidéos interactives, des présentations, des jeux, des publicités et plus encore.
• Le contenu peut être importé et exporté.
  • L'affichage et la modification du contenu H5P est possible en utilisant un navigateur Web.
• Le contenu enrichi, les applications et les composantes de contenu peuvent être partagés sur H5P.org.

Utilisation libre d'accès

• H5P est une technologie complètement libre et ouverte, autorisée avec la MIT license .
• Les démonstrations / téléchargements, les tutoriels et la documentation sont disponibles pour les utilisateurs qui souhaitent se joindre à la communauté.

Liens vers des exemples et des téléchargements

• Présentation de cours
• Vidéo interactive
• Jeux de mémoire
• Visitez les types de contenu H5P et la page des applications pour accéder à plus d'exemples de téléchargements (voir le lien de téléchargement où pointe la main dans l'image ci-dessous).

Versions compatibles avec Moodle

Moodle 2.7 à 3.3

Considérations techniques pour les administrateurs

Les potentialités pédagogiques de H5P ne sont plus à démontrer mais son fonctionnement technique pose question. Cette section explicite comment configurer ce plugin de manière sécurisée et liste les éléments d'intégration qui doivent encore être améliorés. L'analyse ici proposée se base sur des tests réalisés avec la version 1.18 du plugin H5P, téléchargée en juin 2019.

Un plugin qui fonctionne de manière non habituelle

H5P est composé d'un ensemble de librairies Javascript qui permettent de composer des contenus interactifs. Lors de son intégration à Moodle, les développeurs ont fait le choix de stocker les librairies dans l'API de gestion des fichiers de Moodle. Cette approche facilite grandement les mises à jour des librairies qui sont au total une centaine pour les 42 types de contenus H5P, mais elle peut surprendre au premier abord. C'est la raison pour laquelle les types de contenus H5P sont mis à jour via un Hub qui permet de ne pas se préoccuper des problèmes de dépendances.

Les paramétrages du Hub s'opère via le menu Administration du site > Plugins > Modules d'activité > H5P > Paramètres H5P. Notez que les données d'utilisation de H5P sur votre Moodle peuvent être envoyée vers H5P.org, et les données trackées par H5P sont clairement explicitées. Si vous ne souhaitez pas partager vos données d'utilisation, il vous suffit de décocher la case associée. Veillez à vider le cache du Hub (depuis la même page) pour que les changements soient pris en compte.

Le paramétrage du Hub et la sécurité

Pour installer de nouvelle librairie, vous ne passerez pas par le menu d'Administration du site, mais par le menu de création du contenu. C'est surprenant, angoissant mais pour peu que vous preniez la peine de bien définir les rôles qui peuvent gérer les mises à jour des librairies, cela ne pose pas de soucis de sécurité.

Voici les 2 capacités H5P dont il faut soigner l'attribution pour éviter les problèmes de sécurité :

• mod/hvp:updatelibraries : permet d'installer ou de mettre à jour toutes les librairies (attribuée au seul Gestionnaire par défaut car nécessite le contexte Sytème);
• mod/hvp:installrecommandedh5plibraries : permet d'installer ou de mettre à jour les seules librairies dites recommandées : 6 des plus importantes + 13 autres qui sont des dépendances.

Les types de contenus à installer : tous !

Une des difficultés dans la gestion de ces librairies est leurs dépendances, dont on peut avoir une idée en consultant le menu Administration du site > Plugins > Modules d'activité > H5P > Bibliothèques H5P. Cela explique pourquoi il est assez difficile de configurer H5P avec seulement une partie des types de contenus activés.

Même si certaines activités semblent redondantes avec des outils Moodle, vous serez sans doute amené à les installer car elles seront appelées par un autre type de contenu. Si vous souhaitez par exemple créer des vidéos interactives, vous devrez activer, les choix multiples, vrai/faux et autres outils de questions sinon vos vidéos ne pourront contenir que des éléments non interactifs (textes, images, ...) !

La mise à jour des types de contenus

Lorsque vous mettez à jour les types de contenus, les anciennes activités H5P ne sont pas automatiquement mises à jour. Vous devez passer par le menu Administration du site > Plugins > Modules d'activité > H5P > Bibliothèques H5P pour cliquer sur les flèches vertes à côté de la liste des librairies en bas de page. Tous vos anciens contenus seront ainsi mis à jour.

L'activité H5P intégrée à Moodle : 2 points à améliorer

Notez que la création, la suppression et la duplicaction d 'une activité H5P fonctionne de manière conforme aux modules Moodle. La gestion de l'achèvement d'une activité H5P est aussi parfaitement fonctionnel, ainsi que le backup et restore.

Il n'est par contre pas encore possible de réinitialiser une activité H5P. Voir le bugtracker H5P pour suivre le support de la réinitialisation Nous vous conseillons de documenter la possibilité de dupliquer une activite H5P pour vider les traces.

Le plugin répond parfaitement aux exigences des RGPD.

Traduction Nous regrettons cependant que la traduction de l'interface d'édition ne soit pas parfaite mais vous pouvez aussi suivre l'amélioration du support des langues via le bugtracker de H5P.

Installation

• À partir de la base de données des plugins Moodle
• Pour terminer l'installation, visitez la page de Notifications

Attention, il existe 2 pages de paramètres :

• l'une est accessible directement dans la gestion du plugin ;
• l'autre est située dans un sous-menu accessible depuis Administration du site > Plugins > Modules d'activité > H5P > Bibliothèques H5P

Les activités H5P sont supportées sur l'app mobile à 2 conditions :

1. dans Administration du site > App mobile > Activer les services web pour appareils mobiles (enablemobilewebservice) évidemment !
2. dans Administration du site > Sécurité > Sécurité HTTP > Autoriser l'intégration dans un cadre ('allowframembedding').

Remarque 1.- Le texte d'aide dans ce 2e paramètre comporte une information erronée en ce qui concerne les activités H5P. Ce texte dit "Ce réglage est ignoré pour l'App mobile, dans laquelle l'intégration des cadres est toujours autorisée." En fait, pour H5P il faut cocher la case Autoriser, sinon ça ne marchera pas !

Remarque 2.- Si l'admin de votre Moodle a oublié d'activer cette "autorisation d'intégration dans un cadre", dans l'appli Mobile 2 messages d'erreur différents seront affichés à l'utilisateur qui voudrait utiliser une activité H5P dans un cours, selon son rôle (plus exactement selon ses capacités).

• rôle étudiant : This site is not configured properly for displaying mobile H5P content. Please contact a site administrator.
• rôle administrateur : Iframe embedding must be enabled in order to display H5P content in the mobile app. You can enable it by checking Allow frame embedding" in Site Administration / Security / Http Security

Utilisation

Options d'affichage

Vous pouvez activer / désactiver :

• L'affichage de la barre d'action et le cadre
• Le bouton de téléchargement
• Le bouton Copyright

Téléchargement ou création d'une activité

Lors de la création d'un contenu H5P l'utilisateur a le le choix de créer ou de télécharger son contenu. Pour s'initier à cette activité, il est possible de télécharger un exemple sur H5P.org.

• Si vous choisissez de déposer un fichier (.h5p) vous pourrez le télécharger ou le glisser-déposer dans la zone désignée.

• Il est alors facile de compléter les paramètres de l'activité interactive avec l'éditeur intégré dans le plugin.

• Si vous choisissez de "Créer" une activité, la liste déroulante des modifications vous permettra de choisir l'une des options suivantes :

Activités disponibles pour la création à partir du plugin

Les exemples d'activités sont nombreuses sur le site H5P.org. On y retrouve des exemples de vidéo interactive, des jeux de mémoire, des glisser - déposer sur une image, des espaces à compléter, des mots à placer au bon endroit, des cartes d'apprentissage de vocabulaire, etc. N'hésitez pas à vous référer à sa documentation et à ses exemples très variés.

• Accordion - Un type de contenu accordéon permettant aux utilisateurs d'ajouter des accordéons WAI - ARIA accessibles. WAI - ARIA est utilisé pour augmenter l'accessibilité des pages Web, en particulier les contenus dynamiques et les composants d'interface utilisateur développés avec Ajax, HTML, JavaScript et les technologies associées.

Remarque. Les images collées dans la zone de texte n'apparaîtront pas dans l'activité finale, seul le texte sera affiché.

• appear.in for Chat and Talk - Type de contenu de vidéoconférence permettant aux auteurs de configurer des salles de conférence.

• Audio - Un lecteur audio facile à utiliser.

• Graphique - 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.

• Collage - Un type de contenu de collage de photos permettant aux utilisateurs de configurer plusieurs photos dans une mise en page personnalisée en utilisant seulement un navigateur Web afin d'afficher leurs photos d'une manière élégante.

• Présentation de cours - Un type de contenu de présentation qui permet aux utilisateurs d'ajouter des choix multiples, de remplir les blancs, des textes et d'autres types d'interactions à leurs présentations en utilisant seulement un navigateur Web afin de faire des présentations attrayantes.

• Cartes de dialogue - Un type de contenu permettant aux auteurs de créer d'excellentes ressources d'apprentissage des langues avec H5P.

• Outil de documentation - Un type de contenu permettant aux auteurs de créer des guides pour des processus de rédaction structurés avec H5P.

• Glisser-déposer - Un type de contenu par glisser-déposer permettant aux auteurs de créer de nombreuses formes de glisser-déposer à l'aide d'un simple navigateur Web afin de créer des défis engageants avec H5P.

• Glisser les mots - Un type de contenu permettant aux auteurs de créer des défis basés sur le texte où les utilisateurs doivent glisser les mots dans des espaces vides dans les phrases. Excellent pour la formation linguistique.

• Remplir les blancs - Type de question permettant aux créatifs de créer des blancs de remplir les blancs, également connus sous le nom de tests de colmatage.

Remarque. Moodle dispose de deux plugins supplémentaires permettant de créer facilement des contenus en colmatage à l'aide des éditeurs de texte Moodle : l'éditeur colmatage pour TinyMCE et l'éditeur colmatage pour Atto.

• Trouver le hotspot - Un type de contenu permettant aux auteurs de créer un test basé sur l'image où l'apprenant doit trouver le bon endroit sur une image. Utilisez ce type de contenu avec le plugin H5P pour défier vos utilisateurs.

• Flashcards - Un type de contenu permettant aux auteurs de créer des flashcards.

• Carte de vœux - Pour créer facilement une carte de vœux.

• Devinez la réponse - Un type de contenu permettant aux auteurs de créer des défis où l'utilisateur doit deviner une réponse basée sur une image.

• l'encodeur Iframe - L'encodeur Iframe permet de réaliser facilement un H5P à partir d'applications JavaScript déjà existantes.

Remarque. Moodle lui-même peut utiliser des simulations PhET. Vous pouvez les intégrer dans une page ou dans une question d'un quiz.

• Hotspots d'images - Un type de contenu permettant aux créateurs d'ajouter des hotspots aux images. Les hotspots peuvent révéler des textes, des images et des vidéos lorsqu'on clique dessus.

• Vidéo interactive - Un type de contenu vidéo interactif permettant aux utilisateurs d'ajouter des questions à choix multiples et de remplir les questions vides, du texte en pop-up et d'autres types d'interactions à leurs vidéos en utilisant uniquement un navigateur Web. Rendez vos vidéos plus attrayantes.

Cliquez ici pour accéder à une démonstration vidéo interactive

• Marquer les mots - Un type de question permettant aux auteurs de créer des défis où l'utilisateur doit marquer des types spécifiques de verbes dans un texte.

• Jeu de mémoire - Type de contenu de jeu de mémoire permettant aux auteurs d'ajouter leurs propres images (et du texte facultatif) à un jeu de mémoire. Pour jouer au jeu, les utilisateurs recherchent des paires d'images, qui afficheront un message texte spécifié une fois qu'une paire correspondante aura été trouvée.

• Choix multiples - Type de contenu permettant aux auteurs de créer des défis où l'utilisateur doit identifier un ou plusieurs choix corrects.

• Jeu de questions - Un type de contenu permettant aux auteurs de créer des quiz. De nombreux types de questions sont proposés, comme les choix multiples, remplir les espaces vides, glisser les mots, marquer les mots et glisser-déposer régulier.

• Quiz à choix unique - Un type de contenu permettant aux auteurs de créer des jeux-questionnaires simples et fluides composés de questions à choix unique.

• Résumé - Un constructeur de résumé. Ce type de contenu permet aux auteurs de créer des défis où l'utilisateur doit choisir entre les énoncés et construire le bon résumé.

• Timeline - Un type de contenu permettant aux créatifs de créer des timelines interactives.

• Flux utilisateur Twitter - Un flux Twitter.

Voir aussi

• La page d'accueil H5P.org
• Le Forum H5P pour discuter de H5P
• Les exemples à télécharger qui vous inspireront des utilisations créatives et amusantes.
• Le code source disponible sur le dépôt GitHub