Erstellen von interaktiven Videos im TU Graz TeachCenter mithilfe von H5P
H5P ist ein webbasiertes Open-Source-Tool zur Erstellung von interaktiven Lerninhalten, die Sie in Ihrem TeachCenter-Kurs (TC-Kurs) als H5P-Aktivität anlegen können. Ein interaktiver Lerninhalt im Speziellen ist das H5P Interactive Video, bei dem Sie verschiedene Interaktionen zu einem Video hinzufügen können. Einige Möglichkeiten für interaktive Inhalte in einem Video sind zum Beispiel:
Textfelder (Labels)
Links
Bilder
Single-Choice-Fragen
Multiple-Choice-Fragen
Richtig oder Falsch-Fragen
Lückentexte (Fill in the Blanks)
Antworten an die richtige Stelle ziehen (Drag-and-Drop)
die korrekten Wörter markieren (Mark the Words)
Text an die richtige Stelle ziehen (Drag Text)
Verweise an andere Videostellen (Crossroads)
Viel Erfolg und viel Spaß mit H5P - probieren Sie doch auch andere interaktive Aktivitäten außer den Videos aus!
Ab Moodle 3.9 erstellen Sie H5P-Videos im sogenannten Inhaltsspeicher.
Die hier beschriebene Möglichkeit ist die schnellste und einfachste, um ein H5P-Video zu erstellen. Allerdings ist es mit dieser Option nicht möglich, Punkte oder Ergebnisse der Studierenden auszulesen, sondern das Video kann nur der Selbstüberprüfung dienen. Eine Anleitung für H5P-Videos, bei denen Sie die Bewertung der Studierenden auch auslesen können, finden sie in Abschnitt 2.
Klicken Sie in Ihrem TeachCenter-Kurs links im Menü auf den Button Inhaltsspeicher.
Abb. 1: Inhaltsspeicher im Menü
Fügen Sie nun das Video in den Inhaltsspeicher hinzu: Klicken Sie oben rechts auf den Button Hinzufügen und suchen Sie nach Interactive Video.
Abb. 2: Interactive Video hinzufügen
Vergeben Sie einen Titel für das Video.
Klicken Sie im Bereich Videodateien auf das +-Symbol, um eine Videodatei hinzuzufügen. Bitte laden Sie keine MP4-Dateien direkt in das TeachCenter, sondern verwenden Sie nur Weblinks, z. B. zu YouTube-Videos.
Abb. 3: Videodatei hinzufügen
Wechseln Sie in den Reiter Schritt 2 -Interaktionen hinzufügen, um interaktive Fragen oder Aufgaben hinzuzufügen (für eine detaillierte Anleitung siehe Abschnitt 2).
In Schritt 3 – Zusammenfassende Aufgabe können Sie noch eine abschließende Aufgabe zur Selbstüberprüfung der Lernziele erstellen, die am Ende des Videos angezeigt wird.
Speichern Sie das interaktive Video, indem Sie über oder unter dem Video auf Sichern klicken.
Abb. 4: Sichern des interaktiven Videos
Sie sehen eine Vorschau. Klicken Sie auf Schließen. Sie können das Video jederzeit wieder im Inhaltsspeicher finden und bearbeiten.
Um das Video für Studierende in Ihrem TeachCenter-Kurs verfügbar zu machen, müssen Sie es in ein Textfeld einbetten.
Um ein zuvor erstelltes H5P-Video im TC-Kurs einzubetten, legen Sie zuerst ein Textfeld an: Bearbeiten einschalten > Aktivität oder Material anlegen > Textfeld.
Abb. 5: H5P-Button im Texteditor
Wählen Sie Repositories durchsuchen > Inhaltsspeicher und dann das gewünschte H5P-Video.
Abb. 6: Repositories durchsuchen
Abb. 7: Dateiauswahl im Inhaltsspeicher
Wählen Sie Alias/Verknüpfung zur Datei anlegen - so werden spätere Änderungen, die Sie an der Datei im Inhaltsspeicher vornehmen, auch in der eingebetteten Datei übernommen.
Ändern Sie wenn nötig Autor:in und Lizenz und klicken Sie auf Datei auswählen, dann auf H5P einfügen. Sie sehen im Textfeld nun einen Platzhalter für die H5P-Aktivität.
Abb. 8: Einstellungen zu der H5P-Aktivität
Abb. 9: Platzhalter für die H5P-Aktivität
Wenn gewünscht, ergänzen Sie noch zusätzlichen Text im Textfeld. Nehmen Sie ggf. noch weitere Einstellungen am Textfeld vor, z. B. Voraussetzungen/Sichtbarkeit.
Klicken Sie auf Sichern und zum Kurs. Das Video ist nun im Kurs eingebettet.
Ein H5P-Video mit auslesbaren Ergebnissen einfügen
Diese Option muss gewählt werden, wenn die H5P-Aktivität bewertet werden soll und Sie die Detailergebnisse und Punkte der Studierenden einsehen möchten (siehe Abschnitt 4).
Wechseln Sie in den Bearbeitungsmodus (rechts oben im Kurs: Bearbeiten einschalten).
Fügen Sie eine neue blaue H5P-Aktivität hinzu: Aktivität oder Material anlegen > H5P.
Geben Sie der Aktivität einen Namen.
Im Abschnitt Paketdatei klicken Sie auf das Dateisymbol. Wählen Sie das interaktive Video aus dem Inhaltsspeicher aus. Belassen Sie die Auswahl Alias/Verknüpfung erzeugen - ansonsten werden spätere Änderungen am Video im Inhaltsspeicher nicht in der Aktivität übernommen.
Abb. 10: Paketdatei auswählen
Abb. 11: Dateiauswahl im Inhaltsspeicher
Wenn Sie das Video im Kurs einbetten möchten (siehe Abschnitt 2.3), setzen Sie unter H5P-Optionen das Häkchen Einbetten-Taste.
Abb. 12: H5P-Optionen
Nehmen Sie weitere Einstellungen vor, z. B. unter Bewertung die möglichen Maximalpunkte und die Bestehensgrenze.
Es öffnet sich ein Fenster mit einem Code-Fragment zum Einbetten. Wählen Sie die gewünschte Videogröße oder das dynamische Format aus und kopieren Sie den entsprechenden Code in die Zwischenablage.
Abb. 14: Code-Fragment zum Einbetten
Erstellen Sie ein Textfeld: Bearbeiten einschalten > Aktivität oder Material anlegen > Textfeld.
Wechseln Sie zum HTML-Modus, indem Sie in der Menüleiste auf </> klicken.
Fügen Sie dort den zuvor kopierten Code ein.
Schließen Sie den HTML-Modus durch erneuten Klick auf </>. Klicken Sie auf Speichern und zum Kurs.
Damit Studierende nur noch das eingebettete Video sehen, nicht jedoch die blaue H5P-Aktivität, gehen Sie zu den Einstellungen der blauen H5P-Aktivität und wählen Sie im Abschnitt Weitere Einstellungen > Verfügbar, aber auf der Kursseite verborgen.
Abb. 15: Verfügbarkeit der H5P-Aktivität einstellen
Detaillierte Anleitung zum Einfügen von interaktiven Fragen
Öffnen Sie das Video im Inhaltsspeicher und klicken Sie auf Bearbeiten.
Stoppen Sie das Video an der Stelle, wo Sie eine Frage oder Aktivität einfügen möchten. Die genaue Startzeit kann aber auch innerhalb einer Frage angepasst werden
Wählen Sie in Schritt 2 das Multiple-Choice-Symbol aus der Werkzeugleiste.
Abb. 16: Werkzeugleiste
Haken Sie am besten Video pausieren, wenn es bei der Startzeit ankommt an. Unter Anzeigen als wählen Sieam besten Popup, damit die Aktivität nicht übersehen wird.
Abb. 17: Einstellungen für die Interaktion
Fügen Sie einen Namen und eine Frage in die entsprechenden Textfelder ein.
Abb. 18: Mulitple-Choice-Frage erstellen
Geben Sie die verfügbaren Antworten (Optionen) in die Textfelder ein und haken Sie Richtig! an, wenn es sich um eine richtige Antwort handelt - es kann mehrere richtige Antworten geben. Um weitere Antwortmöglichkeiten einzugeben, klicken Sie auf OPTION HINZUFÜGEN.
Abb. 19: Antworten hinzufügen
Wenn gewünscht, haken Sie unter Verhaltenseinstellungen“Wiederholen”-Button anzeigen an. Damit dürfen die Lernenden die Aufgabe mehrmals wiederholen.
Abb. 20: Verhaltenseinstellungen
Scrollen Sie bis zum Ende des Editors und klicken Sie auf Fertig.
Der Inhaltstyp Drag and Drop (Ziehen und Ablegen) ermöglicht es den Lernenden, einen Text oder ein Bild auf eine oder mehrere entsprechende Ablagezonen zu verschieben. Sie fügen dafür zuerst den Hintergrund, die Ablagezonen und die Antworten hinzu und ergänzen erst im letzten Schritt, welche Antworten in welche Ablagezone gehören.
Wählen sie das Drag-and-Drop-Symbol aus der Werkzeugleiste.
Abb. 23: Werkzeugleiste mit Drag-and-Drop-Symbol
Haken Sie Video pausieren, wenn es bei der Startzeit ankommt an. Unter Anzeige als wählen Sie Popup, damit die Aufgabe später nicht übersehen wird.
Fügen Sie einen Namen in das entsprechende Textfeld ein. Der Name wird später auch angezeigt. Hier können Sie also z. B. die Aufgabenstellung hineinschreiben.
Wählen Sie den Reiter Schritt 1 - Einstellungen in der oberen linken Hälfte des Editors.
Abb. 24: Schritt 1 - Einstellungen
Laden Sie ein Hintergrundbild hoch, indem Sie auf Hinzufügen klicken. Falls Sie das Bild bearbeiten möchten (zuschneiden, rotieren etc.), klicken Sie auf Bild bearbeiten.
Geben Sie unter Aufgabengröße an, wie groß (in Pixeln) das Hintergrundbild sein soll.
Wählen Sie den Reiter Schritt 2 Aufgabe in der oberen rechten Hälfte des Editors.
Abb. 25: Schritt 2 - Aufgabe
Um die Ablagezonen zuplatzieren, klicken Sie das konzentrische Kreis-Symbol an. Platzieren Sie so viele Ablagezonen wie nötig.
Abb. 26: Button zum Anlegen von Ablagezonen
Geben Sie eine Beschriftung für die Zonen im Textfeld ein (für Studierende später nicht sichtbar) und klicken Sie auf Fertig.
Abb. 27: Anlegen einer Zone
Klicken Sie auf das im Video eingefügte Ablagefeld, um die Größe und Position anzupassen. Mit einem Doppelklick kann die Interaktion wieder bearbeitet werden.
Abb. 28: Bearbeiten des Ablagefelds
Klicken Sie nun auf das Text-Symbol, um Antwortmöglichkeiten hinzuzufügen.
Abb. 29: Button zum Anlegen von Antwortmöglichkeiten
Fügen Sie einen Text(so erscheint das Element dann für die Studierenden) in das entsprechende Textfeld ein und wählen Sie die Ablagezonen, in die das Element gezogen werden kann - auch die falschen.
Abb. 30: Anlegen einer Antwort
Das Feld können Sie später auch im Vorschaufenster bearbeiten und anpassen.
Abb. 31: Hinzugefügte Antwort
Um zu definieren, welche Ablagezone die richtige für bestimmte Elemente ist, klicken Sie zweimal auf die Ablagezone. Wählen Sie das richtige Element und haken Sie Diese Ablagezone kann nur ein Element beinhalten und Automatisches Ausrichten aktivieren an. Klicken Sie auf Fertig.
Abb. 32: Einstellungen der Ablagezone
Scrollen Sie bis zum Ende des Editors und klicken Sie auf Fertig.
Achtung, Ergebnisse der Studierenden können nur ausgelesen werden, wenn die Datei aus dem Inhaltsspeicher in eine H5P-Aktivität als Paketdatei geladen wurde (siehe Abschnitt 2) - NICHT, wenn die Datei nur aus dem Inhaltsspeicher direkt in ein Textfeld geladen wurde.
Achtung! Teilnehmer:innen müssen den kleinen Stern am Ende der Zeitleiste anklicken und dann Antworten absenden auswählen, um die Antworten zur Bewertung abzusenden. Stellen Sie sicher, dass die Teilnehmer:innen darüber informiert sind.
Der Zugriff auf die Bewertungen der Kursteilnehmer:innen erfolgt direkt über die blaue H5P-Aktivität. Klicken Sie auf die Aktivität, dann rechts oben auf Alle Versuche ansehen . Filtern Sie ggf. nach den Namen der Studierenden.
Abb. 34: Versuche ansehen
Sie sehen in der Übersicht die erreichten Prozente.
Klicken Sie auf Nutzerversuche ansehen, um eine Übersicht über die einzelnen Versuche zu sehen.
Abb. 35: Übersicht der Versuche
Klicken Sie auf Bericht anzeigen, um die abgegebenen Antworten im Detail zu sehen.
Abb. 36: Übersicht der Versuche eines:einer Teilnehmenden
Jede H5P-Aktivität, für die Punkte vergeben werden, scheint auch in der Bewertungsübersicht (links im Hauptmenü: Bewertungen) als eigene bewertete Aktivität - ähnlich wie Quizzes und Abgaben - auf.
Hilfe & Kontakt
Bei Fragen zum TeachCenter / TeachCenter Exam: tc@tugraz.at
TU Graz Lehr- und Lerntechnologien