| Les deux révisions précédentes
Révision précédente
Prochaine révision
|
Révision précédente
|
madoc:guide:22-creer_des_ressources_interactives [2024/09/11 16:59]
pertus-s |
madoc:guide:22-creer_des_ressources_interactives [2025/02/07 11:11] (Version actuelle)
aubert-d [5.3. Consulter les données d'apprentissage des étudiants] |
| <code>Cet article a été validé le 28/02/2024</code> | <code>Cet article a été mis à jour le 09/12/2024</code> |
| <note warning>Depuis la mise à jour de Madoc le 10/07/2024, ce tutoriel est en cours de mise à jour - Merci pour votre compréhension.</note> | |
| ======Créer des ressources interactives avec H5P et la banque de contenus (et Lumi) ====== | ======Créer des ressources interactives avec H5P et la banque de contenus (et Lumi) ====== |
| |
| ==Préambule== | ==Préambule== |
| Qu'est-ce que H5P ? C'est un ensemble d'activités (54 à ce jour) à visée pédagogique, à faire en ligne par l'étudiant. Elles peuvent être produites soit via le logiciel gratuit Lumi, soit directement dans Madoc ou Extradoc. Des informations, tutoriels et exemples peuvent être consultés sur la page suivante (en anglais, mais Google chrome propose une traduction de la page) : https://h5p.org/ \\ | Qu'est-ce que H5P ? C'est un ensemble d'activités (54 à ce jour) à visée pédagogique, à faire en ligne par l'étudiant. Elles peuvent être produites soit via le logiciel libre Lumi, soit directement dans Madoc ou Extradoc. Des informations, tutoriels et exemples peuvent être consultés sur la page suivante (en anglais, mais Google chrome propose une traduction de la page) : https://h5p.org/ \\ |
| |
| **Cet article ne traitera pas de chaque activité H5P en particulier, mais de la création, de l'insertion, et des paramètres généraux.** | **Cet article ne traitera pas de chaque activité H5P en particulier, mais de la création, de l'insertion, et des paramètres généraux.** |
| |
| <note warning> {{:madoc:icones-bloc:attention.png}}Attention : Pour des raisons techniques, H5P ne peut être utilisé pour des évaluation sommatives. Cet outil peut donc être considéré comme un moyen de permettre aux étudiants de mieux comprendre, revoir les notions du cours, de s’entraîner et de s'auto-évaluer.</note> | <note warning>__Attention__\\ Pour des raisons techniques, H5P ne peut être utilisé pour des évaluation sommatives. Cet outil peut donc être considéré comme un moyen de permettre aux étudiants de mieux comprendre, revoir les notions du cours, de s’entraîner et de s'auto-évaluer.</note> |
| |
| == Prérequis== | == Prérequis== |
| |
| ==Avant de commencer== | ==Avant de commencer== |
| <note tip> {{:madoc:icones-bloc:astuce.png}}Bon à savoir : \\ | <note tip>__Astuce__\\ |
| * H5P gère en autonomie les tailles de fichiers photos, vidéos et textes, il est conseillé de tester et visualiser une petite partie de l'activité, pour évaluer si le résultat convient. | * H5P gère en autonomie les tailles de fichiers photos, vidéos et textes, il est conseillé de tester et visualiser une petite partie de l'activité, pour évaluer si le résultat convient. |
| * H5P accepte le LaTeX, il suffit d’insérer le code entre des double dollars. Ex : $$//code LateX//$$ | * H5P accepte le LaTeX, il suffit d’insérer le code entre des double dollars. Ex : $$//code LateX//$$ |
| |
| ====1. Créer, sauvegarder et modifier une activité avec Lumi==== | ====1. Créer, sauvegarder et modifier une activité avec Lumi==== |
| ===1.1. Créer et sauvegarder une activité=== | ===1.1. Créer et sauvegarder une activité avec Lumi=== |
| * Ouvrir Lumi | * Ouvrir Lumi |
| * Cliquer sur la tuile **Editer H5P** puis sur **créer un nouveau H5P** | * Cliquer sur la tuile **Editer H5P** puis sur **créer un nouveau H5P** |
| * créer l'activité, soit avec Lumi (voir ci-dessus), soit directement depuis la banque de contenus Madoc/Extradoc ; | * créer l'activité, soit avec Lumi (voir ci-dessus), soit directement depuis la banque de contenus Madoc/Extradoc ; |
| * déposer le fichier .h5p de l’activité, créé avec Lumi dans la banque de contenus ou simplement sauvegarder l'activité, si elle est créée depuis la banque de contenus ; | * déposer le fichier .h5p de l’activité, créé avec Lumi dans la banque de contenus ou simplement sauvegarder l'activité, si elle est créée depuis la banque de contenus ; |
| * créer une activité « H5P bleu » dans l’espace de cours, pour lier le fichier présent dans la banque de contenus et le présenter sur l’espace de cours. | * insérer une activité « H5P bleu » dans l’espace de cours, pour lier le fichier présent dans la banque de contenus et le présenter sur l’espace de cours. |
| |
| ===2.1. Créer une activité H5P depuis la banque de contenu (sans lumi)=== | ===2.1. Créer une activité H5P depuis la banque de contenu (sans Lumi)=== |
| * Aller dans l’espace de cours Madoc, et activer le mode édition | * Aller dans l’espace de cours Madoc, et activer le mode édition |
| * En haut de la page, dans le menu déroulant « Plus », cliquer sur **Banque de contenus**, la page suivante s’affiche : {{:madoc:img22_10.png?800}} | * En haut de la page, dans le menu déroulant « Plus », cliquer sur **Banque de contenus**, la page suivante s’affiche :\\ |
| * Cliquer sur le bouton « Ajouter » : une boîte à liste s’ouvre, développant les types d’activités H5P | {{:madoc:22_ressinter1.png?800}}\\ |
| * Sélectionner l’activité souhaitée : la page spécifique à l’activité s’ouvre | Il est possible de présenter les fichiers qu'elle contient sous forme de tuiles (4) ou de liste (5). |
| | * Cliquer sur le bouton (1) « Ajouter » : une boîte à liste s’ouvre, développant les types d’activités H5P |
| | * Sélectionner (2) l’activité souhaitée : la page spécifique à l’activité s’ouvre |
| * Remplir les champs nécessaires (titre, description, licence Creative Commons via le bouton « beta données » le cas échéant, questions, propositions de réponses, textes, feedbacks, sons, images, vidéo, etc) propres à l’activité et au contenu | * Remplir les champs nécessaires (titre, description, licence Creative Commons via le bouton « beta données » le cas échéant, questions, propositions de réponses, textes, feedbacks, sons, images, vidéo, etc) propres à l’activité et au contenu |
| * Cliquer sur le bouton **Enregistrer** : l’activité s’affiche en mode lecture (elle peut alors être visualisée et testée) | * Cliquer sur le bouton **Enregistrer** : l’activité s’affiche en mode lecture (elle peut alors être visualisée et testée) |
| * Cliquer sur le bouton **Fermer** : la page de la banque de contenus s’affiche, et le fichier, avec une icône apparaît. | * Cliquer sur le bouton **Fermer** : la page de la banque de contenus s’affiche, et le fichier, avec une icône apparaît. |
| |
| ===2.2. Déposer un fichier .h5p=== | ===2.2. Déposer un fichier .h5p dans la banque de contenus=== |
| Pour ce faire, le fichier doit être présent sur le disque dur de l'ordinateur.\\ | Pour ce faire, le fichier doit être présent sur le disque dur de l'ordinateur.\\ |
| * Dans l’espace de cours, cliquer sur le **Plus** puis **Banque de contenus**\\ | * Dans l’espace de cours, cliquer sur le menu **Plus** puis **Banque de contenus**. La banque de contenus s’ouvre.\\ |
| La banque de contenus s’ouvre : {{:madoc:img22_3.png?1000}} | * Pour ajouter le fichier, cliquer sur le bouton (3 sur la figure précédente) **Déposer** puis **Choisir un fichier** et à nouveau **Choisir un fichier** |
| * Pour ajouter le fichier, cliquer sur le bouton (2) **Déposer** puis **Choisir un fichier** et à nouveau **Choisir un fichier** | |
| * Dans l’explorateur de fichiers qui s’est ouvert, sélectionner le fichier .h5p souhaité, puis cliquer sur le bouton **Ouvrir**, puis **Déposer ce fichier**, et enfin **Enregistrer**\\ | * Dans l’explorateur de fichiers qui s’est ouvert, sélectionner le fichier .h5p souhaité, puis cliquer sur le bouton **Ouvrir**, puis **Déposer ce fichier**, et enfin **Enregistrer**\\ |
| Après quelques instants, l’activité H5P importée s’ouvre. Cliquer sur le bouton **Fermer** pour revenir à la vue générale de la banque de contenus.\\ | Après quelques instants, l’activité H5P importée s’ouvre. Cliquer sur le bouton **Fermer** pour revenir à la vue générale de la banque de contenus.\\ |
| NB : le bouton (1) sert à créer un nouveau contenu H5P (pour les non utilisateurs de Lumi) | |
| |
| ===2.3. Publier une activité H5P sur Madoc, à partir de la banque de contenus=== | ===2.3. Publier une activité H5P sur Madoc/Extradoc, à partir de la banque de contenus=== |
| * Dans l’espace de cours, en mode édition, cliquer sur **Ajouter une activité ou ressource** dans la section souhaitée | * Dans l’espace de cours, en mode édition, cliquer sur **Ajouter une activité ou ressource** dans la section souhaitée |
| * Dans la fenêtre qui s’ouvre, cliquer sur l’icône portant le logo H5P bleu {{:madoc:img22_8.png?100}} | * Dans la fenêtre qui s’ouvre, cliquer sur l’icône portant le logo H5P bleu {{:madoc:img22_8.png?100}} |
| ====3. Gérer la banque de contenus==== | ====3. Gérer la banque de contenus==== |
| __Affichage des fichiers__\\ | __Affichage des fichiers__\\ |
| Il existe 2 présentations que l’on peut choisir à l’aide des boutons : bouton (3) de l'image ci-dessus, qui permet un affichage en icones et (4) qui permet un affichage en liste, avec plus d’indications, notamment combien de fois le fichier est utilisé dans l’espace de cours, la date de dernière modification dans la banque de contenu, etc.\\ | Il existe 2 présentations que l’on peut choisir à l’aide des boutons : bouton (4) de l'image présentée en 2.1. plus haut, qui permet un affichage en icones et (5) qui permet un affichage en liste, avec plus d’indications, notamment combien de fois le fichier est utilisé dans l’espace de cours, la date de dernière modification dans la banque de contenu, etc.\\ |
| __Modification__\\ | __Modification__\\ |
| Il est possible de modifier un fichier directement dans la banque de contenus, mais pour plus de cohérence il est recommandé de modifier le fichier du disque dur via Lumi, et de remplacer le fichier de la banque de contenus par le nouveau fichier modifié.\\ | Il est possible de modifier un fichier directement dans la banque de contenus, en cliquant dessus, puis sur le bouton **Modifier**. Il est également possible de modifier le fichier sur Lumi depuis le disque dur de l'ordinateur, puis de venir remplacer le fichier dans la banque de contenu (voir l'option 3 expliquée ci-dessous dans "Autres actions possibles"). En cas de remplacement de fichier, cela sera transparent pour les étudiants et les rapports de données d'apprentissage.\\ |
| __Autres actions possibles :__\\ | __Autres actions possibles :__\\ |
| En cliquant sur un fichier de la banque de contenu, il s’ouvre et une roue crantée apparaît au coin supérieur droit de l’écran, sous le bandeau bleu Madoc.\\ **Attention, si le cours possède une image d’illustration, cette roue crantée peut être difficile à discerner.** \\ | Cliquer sur un fichier, un bouton **Plus** propose les options ci-après :\\ |
| {{:madoc:img22_7.png?1000}}\\ | {{:madoc:22_ressinter2.png?700}}\\ |
| Au clic, elle affiche les possibilités suivantes :\\ | |
| **(1)** Rendre non listé [impact non identifié actuellement]\\ | **(1)** Rendre non listé [impact non identifié actuellement]\\ |
| **(2)** Renommer (il s’agit de renommer le fichier et non le titre de l’activité)\\ | **(2)** Renommer (il s’agit de renommer le fichier et non le titre de l’activité)\\ |
| ====4. Récupérer une activité H5P noir pour la convertir en H5P bleu ==== | ====4. Récupérer une activité H5P noir pour la convertir en H5P bleu ==== |
| Les activités H5P noir (picto noir), sont issues d'un plugin qui présente des dysfonctionnement avec les mises à jour de Madoc/Extradoc. Pour certaines, il est possible de récupérer les fichiers (.h5p), et de les publier sur la banque de contenus H5P, pour ensuite les remettre sur l'espace de cours via l'activité H5P (picto bleu) qui fonctionne bien. | Les activités H5P noir (picto noir), sont issues d'un plugin qui présente des dysfonctionnement avec les mises à jour de Madoc/Extradoc. Pour certaines, il est possible de récupérer les fichiers (.h5p), et de les publier sur la banque de contenus H5P, pour ensuite les remettre sur l'espace de cours via l'activité H5P (picto bleu) qui fonctionne bien. |
| * Cliquer sur l'activité H5P les paramètres de l'activité H5P noir, via les trois points verticaux sur la ligne, ou sur le nom de l'activité H5P, puis sur **Paramètres**. | * Cliquer sur les trois points verticaux à droite sur la ligne de l'activité, ou sur le nom de l'activité H5P, puis sur **Paramètres**. |
| * En bas de page, dans le menu « Afficher les options », cocher les cases **Afficher la barre d’action et le cadre** et **Autoriser le téléchargement**, puis **Enregistrer et afficher** | * En bas de page, dans le menu « Afficher les options », cocher les cases **Afficher la barre d’action et le cadre** et **Autoriser le téléchargement**, puis **Enregistrer et afficher** |
| * Cliquer sur menu **Réutiliser** situé sous l’activité, puis remonter la page et cliquer sur « Download as an .h5p file ». {{:madoc:img22_11.png?300}} \\ | * Cliquer sur menu **Réutiliser** situé sous l’activité, puis remonter la page et cliquer sur « Download as an .h5p file ». {{:madoc:img22_11.png?300}} \\ |
| Pour réutiliser l'activité sous H5P bleu, se référer aux rubriques 2.1.1 à 2.2. de cet article. | Pour réutiliser l'activité sous H5P bleu, se référer aux rubriques 2.1.1 à 2.2. de cet article. |
| |
| Supprimer ensuite l'activité H5P noir, devenu doublon inutile. | Supprimer ensuite l'activité H5P noir, devenue un doublon inutile. |
| |
| |
| | ===== 5. Pour aller plus loin ===== |
| ==== Pour aller plus loin ==== | |
| - L'espace Demomadoc propose des informations complémentaires : https://madoc.univ-nantes.fr/course/view.php?id=23889§ion=28 | - L'espace Demomadoc propose des informations complémentaires : https://madoc.univ-nantes.fr/course/view.php?id=23889§ion=28 |
| - Il est possible, pour une activité H5P déjà produite, de : | D'autres fonctionnalités : |
| * la dupliquer | ==== 5.1. Sauvegarder sur son disque dur==== |
| * la sauvegarder sur son disque dur | Se reporter au paragraphe 3 de cet article, et cliquer sur Télécharger (option 4 sur le visuel). |
| * l'intégrer dans une Page, un Livre ou une Zone texte et media, au moyen du lien iframe et de l'éditeur de texte de Madoc, en mode html (suivi des données étudiants possible) ; ou via le bouton H5P de l'éditeur de texte (pas de suivi des données d'apprentissage). | ==== 5.2. Intégrer une activité dans une ressource Madoc (bouton ou iframe) ==== |
| * Consulter les données d'apprentissage des étudiants : cliquer sur le menu **Rapport** | Une activité H5P peut être intégrée de 2 façon dans une ressource Madoc comportant un éditeur de texte : |
| Pour plus de détails et tutoriels sur la création des différents types de ressources, suivre ce lien : https://eplanet.polytech-reseau.org/course/view.php?id=33 | === 5.2.1. Via le bouton "H5P" de l'éditeur de texte=== |
| | <note warning>__Attention__\\ Dans ce mode d'intégration, les données d'apprentissage des étudiants (résultats des activités évaluées, ex QCM...) ne sont ni conservées ni consultables. Egalement, on ne peut activer l'achèvement d'activité que pour la ressource Madoc, et non l'activité H5P spécifiquement.</note> |
| | Dans la ressource choisie (Page, Livre, Zone texte et media...), \\ |
| | * Cliquer sur le bouton **H5P** de l'éditeur de texte. {{:madoc:22_ressinter3.png?100}} \\ |
| | * Sélectionner le fichier depuis l'ordinateur (menu **Déposer un fichier**) ou depuis la banque de contenus H5P (menu **Banque de contenus pour H5P**) {{:madoc:22_ressinter4.png?150}} \\ |
| | * Ajuster les **Options H5P**, puis |
| | * Valider en cliquant sur le bouton **Insérer H5P**. L'activité est insérée dans le contenu. |
| | === 5.2.2. Via l'ajout de l'activité, son paramétrage et l'utilisation de son lien iframe === |
| | Ce mode d'intégration permet d'activer l'achèvement d'activité sur la ressource ET sur l'activité H5P distinctement, et également d'accéder aux données d'apprentissage des étudiants sur l'activité H5P (voir 5.3.). En revanche, en cas d'//importation// de ressource ou d'activité, les liens peuvent ne plus être fonctionnels dans l'espace de cours de destination. |
| | Le principe est d'insérer une activité H5P bleu dans la section choisie, qui sera paramétrée pour être active mais invisible des étudiants (pour éviter le doublon avec le lieu d'insertion), d'ajuster les paramètres (ex achèvement d'activité...), puis de récupérer le lien iframe de cette activité pour l'insérer dans la ressource de destination. Par exemple, pour insérer une activité H5P (déjà présente dans la banque de contenus H5P) dans une Page, procéder comme suit : |
| | * Dans la section souhaitée, créer la ressource destination, ici, une Page, paramétrer, sans oublier de cocher "Bouton intégration" dans la rubrique "Options H5P", puis enregistrer et revenir à l'espace de cours ; |
| | {{:madoc:22_ressinter5.png?300}} |
| | * Dans la même section (par comodité) créer une activité H5P bleu, comme indiqué en 2.3. ; |
| | * Paramétrer cette activité selon le choix (achèvement d'activité...), et dans la rubrique "Réglages courants", sélectionner "Rendre disponible mais invisible sur la page de cours" (l'invisibilité s'applique aux étudiants) puis cliquer sur **Enregistrer et afficher** |
| | * Une fois l'activité affichée, cliquer sur la mention **Intégrer** |
| | {{:madoc:22_ressinter6.png?100}} \\ |
| | * Remonter en haut de la page, et cliquer dans le texte en script, qui commence par "<iframe", et le sélectionner à l'aide du clavier CTRL+A. Puis le copier (CTRL+C au clavier). Cliquer sur la croix en haut à droite pour fermer la fenêtre, puis ouvrir la ressource destination (ici, la Page) |
| | * Dans la Page, sélectionner le bouton <> dans l'éditeur de texte, à l'endroit souhaité, puis coller le lien iframe (CTRL+V au clavier). |
| | * Cliquer à nouveau sur le bouton <> de l'éditeur de texte pour voir l'activité intégrée. |
| | * Sauvegarder la ressource Page. |
| | Les données d'apprentissages sont disponible depuis l'activité H5P elle-même, et non dans l'activité Page. |
| | |
| | |
| | ====5.3. Consulter les données d'apprentissage des étudiants==== |
| | Dans l'activité HP5 bleu créée sur Madoc, |
| | * Cliquer sur l'onglet **Rapport des tentatives**, un premier niveau d'informations s'affiche : nom et prénom des étudiants ayant utilisé l'activité, date, score et nombre de tentatives |
| | * Cliquer sur **consulter les tentatives utilisateur**, un deuxième niveau d'information s'affiche : pour l'étudiant concerné, la liste de toutes les tentatives et la meilleure (paramètre par défaut, mais modifiable). On y trouve notamment le temps passé par l'étudiant sur l'activité. |
| | * Cliquer sur **Consulter le rapport** permet de voir les réponses de l'étudiants à toutes les questions, pour la tentative sélectionnée. |
| | <note important>__Important__\\ Il n'est à ce jour pas possible de télécharger les résultats, ni d'obtenir de vue détaillée pour plus d'un étudiant à la fois.</note> |
| | |
| | |
| | Pour consulter quelques tutoriels sur la création des différents types de ressources, suivre ce lien : https://eplanet.polytech-reseau.org/course/view.php?id=33 |
| ---- | ---- |
| |
| **[[moodle:faq|Retour à la FAQ]]**\\ | **[[madoc:faq|Retour à la FAQ]]**\\ |
| **[[:madoc|Retour au guide de l'utilisateur Madoc]]** | **[[:madoc|Retour au guide de l'utilisateur Madoc]]** |
| |
| |
| |
