H5P

Aus MoodleKnowledgeBase
Zur Navigation springen Zur Suche springen

Einleitung

H5P (HTML5 Package) ist ein sogenanntes Content Collaboration Framework. D.h., dass es eine Basis zur gemeinschaftlichen Erstellung von interaktiven Inhalten bereitstellt.
Dazu nutzt H5P moderne Webtechnologien (HTML5, CSS3 und JavaScript), um Inhalte interaktiv darzustellen und auf unterschiedlichen Geräten und Plattformen verfügbar zu machen.
Hierbei werden verschiedene, sogenannte Content Types (siehe unten) angeboten, die unterschiedliche Bedürfnisse und Szenarien adressieren. Hierbei bietet die H5P-Lernaktivität in Moodle verschiedene Umsetzungsmöglichkeiten an, wie beispielsweise interaktive Präsentationen, Lernkarten oder die intuitive Einbettung von iFrames. Die im UDE-Moodle unterstützten Content Types sollen im Folgenden kurz bechrieben werden.

Verfügbare H5P-Inhaltstypen an der UDE

  • Accordion
    • Ermöglicht den Text in einzelne Bereiche anzuzeigen, die dann einzeln aufgeblättert werden können
  • Advanced fill the blanks
    • In einem zuvor definierten Lückentext müssen die darin deklarierten Lücken schriftlich ausgefüllt werden.
    • Nach dem Ausfüllen bekommen die Lernenden ein Feedback, ob die Antwort korrekt oder nicht korrekt ist.
    • Advanced bedeutet, dass die Verfügbarmachung von erweitertem Feedback (z.B. direkte Referenzierung auf den textuellen Kontext, der auszufüllenden Lücke) möglich ist.
  • Agamotto
    • Ermöglicht die Ansicht von Bildern, die der Reihe nach angeschaut oder detailreicher dargestellt werden sollen, i.d. Art eines Zoomeffektes.
    • Es besteht die Möglichkeit, Text bzw. Informationen die das aktuelle Bild beschreiben hinzuzufügen.
    • Wird über einen Slider gesteuert.
  • Branching Scenario (beta)
    • Dient der Erstellung einer Form adaptiven Lernens
    • Verzweigte Storylines: Lernende bekommen auf Grundlage ihrer Auswahl/ Entscheidungen unterschiedliche Lernmaterialien angezeigt
    • Dieser Inhaltstyp befindet sich aktuell noch aktiv in der Entwicklung!
  • Chart
    • Visuelle Ansicht für den Vergleich von Zahlen (Diagramme)
    • Zwei Varianten: Bar und Pie
      • Bar: Ansicht der Zahlen in Stabdiagrammen
      • Pie: Ansicht der Zahlen im Kreisdiagramm
  • Column
    • Dient der Organisation von H5P Inhaltstypen mit ähnlicher Thematik.
    • D.h., dass ähnliche Themen - Inhaltstyp-übergreifend - gruppiert werden können.
  • Course Presentation
    • Hier können neue interaktive Präsentationen für Moodle erstellt werden
    • Interaktiv bedeutet, dass in der Präsentation Fragen beantwortet werden können (Multiple Choice), die dann auch in die Bewertung eingetragen werden
    • Es besteht allerdings weder die Möglichkeit eine bereits vorhandene Präsentation hochzuladen, noch eine in h5p erstellt in einem weiterverwendbaren Format (wie ppt oder pdf) herunterzuladen
    • Wenn eine Person die Präsentation gesehen hat, zwischenzeitlich aber Änderungen daran vorgenommen wurden, wird der jeweiligen Person bei der nächsten Ansicht der Präsentation angezeigt, dass eine Veränderung vorgenommen wurde
  • Crossword
    • Ermöglicht die Erstellung eines Kreuzworträtsels.
    • Im Bedarfsfall können zu den gesuchten Wörtern Hinweise gegeben werden.
    • Auch die Deklaration eines Lösungswortes ist möglich. Dabei ist jedoch darauf zu achten, dass sich dieses aus den gesuchten Wörtern bilden lässt.
  • Dialog Cards
    • Dienen dem Memorieren von Wörtern, Ausdrücken oder Sätzen.
    • Auf der Vorderseite befindet sich ein Hinweis. Beim Drehen der Karte erfährt man den damit zusammenhängenden Ausdruck (Begriff).
    • Es können z.B. Bilder, Audio-Dateien oder Tipps hinzugefügt werden. Durch die Integration von Audio-Dateien eignet sich dieser Inhaltstyp insbesondere für Szenarien im Kontext des Spracherwerbs.
  • Dictation
    • Ermöglicht die Überprüfung von orthografischen Kenntnissen (Diktat-Übung).
    • Audiodateien, optional in unterschiedlichen Geschwindigkeitsstufen und/oder einer festgeschriebenen Anzahl an Abspielmöglichkeiten, können eingestellt werden.
    • Zu den Audiodateien werden korrespondierende Eingabefelder angelegt, mithilfe derer die Nachschrift für das Gesprochene eingegeben und automatisch überprüft werden kann.
  • Documentation Tool
    • Erlaubt die Erstellung einer strukturierten Abfolge, für einen Schreibprozess.
    • Es können Unterpunkte (Abfolge) gesetzt werden.
  • Drag and Drop
    • Die Autorin*innen können zwei oder mehr Elemente (Text oder Bild) per „Drag and Drop“ miteinander verknüpfen.
    • Kann eigenständig oder innerhalb anderen Inhaltstypen verwendet werden.
  • Flashcards
    • Hier können Lernkarten erstellt werden
    • Es können Tipps gegeben werden
    • Aktive Eintragung von Wörtern möglich
    • Groß- und Kleinschreibung wird nicht berücksichtigt
    • Wird in die Bewertung übernommen
  • Iframe Embedder
    • Ermöglicht die intuitive und effiziente Einbindung von (externen) Ressourcen, wie z.B. Webseiten oder JavaScript-Applikationen
    • Die Breite, Mindestbreite sowie Höhe des iFrames können eingestellt werden
    • Der iFrame-Inhalt kann für den Vollbildmodus des Browsers "freigegeben" werden
  • Image Choice
    • Die Autorin/ der Autor können eine Bildauswahl-Frage erstellen.
    • Dabei werden die Lernenden durch eine Frage dazu aufgefordert, eine bestimmte Teilmenge zuvor durch den/ die Autor:in eingestellter Bilder auszuwählen.
  • Image Hotspots
    • Die Autorin/ der Autor kann ein Bild hochladen und beliebig viele interaktive Hotspots definieren.
    • Ein Hotspot kann mit Text oder einem Video befüllt werden.
    • Die Farbe eines Hotspots (auf dem Bild) kann individuell gewählt werden.
  • Image Juxtaposition
    • Ermöglicht das Überblenden zweier Abbildungen
    • Die Ansicht zwischen Abbildung 1 und 2 kann dabei mittels Schieberegler anteilig gewechselt werden
      • Die Startposition (in %) sowie die Richtung (horizontal vs. vertikal) des Schiebereglers können voreingestellt werden
    • Wichtig: die Abbildungen sollten dieselben Proportionen (Breite u. Höhe) haben, da sonst der (fehlende) Differenzbereich weiß-aufgefüllt wird
  • Image pairing
    • Lernende bekommen Bilder angezeigt, deren zuvor definierte Paare sie identifizieren und korrekt einander zuordnen müssen.
    • Bilderpaare müssen nicht aus demselben Bild bestehen, wodurch die Überprüfung von (impliziten) Relationen möglich ist.
  • Image Sequencing
    • Lernaufgabe, bei der die Lernenden mehrere Abbildungen angezeigt bekommen.
    • Die Abbildungen können dabei eine optionale Beschreibung erhalten.
    • Diese müssen anschließend, in einer zuvor definierten Reihenfolge, korrekt angeordnet werden.
  • Image Slider
    • Hier bekommen die Lernenden mehrere Bilder in einem Slider (horizontal-navigierbare Folge von Abbildungen) angezeigt.
  • Interactive Book
    • Mehrere H5P Inhaltstypen können integriert bzw. verwendet werden. Dabei sind beliebig viele Inhalte auf einer Seite sowie beliebig viele „Buchseiten“ möglich.
    • Das Layout wird automatisch an den verwendeten Inhalten (Inhaltstypen) angepasst.
    • Stellt eine (erweiterte) Alternative, im Buch-Stil, z.B. zum Typ Course Presentation dar.
  • Interactive Video (für Videos bis 50MB)
    • Die Autor*innen können ein Video hochladen.
    • Das Video kann an frei wählbaren Punkten gestoppt und mit anderen H5P Inhaltstypen erweitert werden.
      • Richtige/falsche Antworten (u.a. über MC-Fragen-Elemente) können z.B. die Reihenfolge die Wiedergabe ändern (richtige Antwort überspringt einen Teil, falsche Antwort zeigt den Teil des Videos, der die richtige Antwort gibt).
      • Die Nutzer*innen können zu den verschiedenen Lesezeichen/Stopps in der Wiedergabe springen.
    • Darüber Hinaus lässt sich das Video durch optionale oder verpflichtende Elemente (z.B. Text) ergänzen.
  • KewAr Code
    • Bietet eine einfache und direkte Möglichkeit, QR-Codes zu erstellen.
    • Folgende Informationen können kodiert werden: Kontakt (u.a. Name, E-Mail-Adresse, Telefonnummer, Webseite, etc.), Event (u.a. Uhrzeiten, Örtlichkeit, Beschreibung, etc.), E-Mail-Adresse, ausgewählte H5P Inhaltstypen, Örtlichkeit, Telefonnummer, SMS (Vorlage), Text und URLs (Links).
  • Mark the Word
    • In einem vorgegebenen Text müssen die Lernenden eine bestimmte Anzahl zuvor definierter Wörter (richtig) markieren
  • Personality Quiz
    • Dient der Erstellung einer Fragenfolge, mit alternativen Antwortmöglichkeiten.
    • Fragen beziehen sich hierbei auf persönliche Präferenzen.
  • Quiz (Question Set)
    • Die Autor*innen erstellen eine Folge verschiedener Fragentypen.
    • Mehrere H5P Inhaltstypen können integriert bzw. verwendet werden.
    • Das Aussehen der Fragen kann mit Bildern etc. erweitert werden.
  • Sort the Paragraphs
    • Ermöglicht die Deklaration mehrerer Texte (Absätze), welche zufällig vom System gemischt und von den Lernenden wieder in die korrekte Reihenfolge zu bringen sind.
  • Summary
    • Lernende müssen Schlüsselinformationen, die in einem Text, Video oder einer Präsentation gegeben werden, in eine (korrekte) Reihenfolge bringen.
  • Timeline
    • Hier können auf einer Zeitachse verschiedene (sequentielle) Zeitpunkte und/oder -räume definiert werden
    • Diese Zeitangaben können sich überschneiden
    • Zu jeder Zeitangabe kann eine Überschrift, ein ergänzender Text sowie externe Medien (Hyperlinks, Google Maps, Twitter, Wikipedia, YouTube etc.) hinzugefügt werden
  • Virtual Tour (360)
    • Ermöglicht die Einbettung eines 360°-Bildes, dass mit diversen Elementen (z.B. Fragen, Text und Interaktionen) angereichert werden kann

Weiterführende Informationen

Weiterführende Informationen:
...zur Erstellung von Content Types: https://h5p.org/documentation/for-authors/tutorials
...vollwertige Beispiele zu den Content Types: https://h5p.org/content-types-and-applications
...Kurzübersicht zu allen H5P-Inhaltstypen (losgelöst vom Moodle der UDE): Datei:Kurzübersicht - H5P Inhaltstypen Oktober 2020.pdf

Offener Moodle-Kurs zu H5P:
Einfach mit der Unikennung oder als "Gast" anmelden.
...Erste Schritte in Moodle: https://moodle.uni-due.de/course/view.php?id=11029

Video-Tutorial
Explizit sei hier auf das Video-Tutorial Interaktive Lernmodule in Moodle erstellen mit H5P hingewiesen.
Produziert von Laura-Marie Schmidt, für den Showroom Lehre digital (Germanistik, 2020).

H5P Vorlagen

Für den Inhaltstyp Course Presentation stehen zwei Vorlagen als ZIP-Datei bereit, die sich am Corporate Design der UDE orientieren:

Bewertungsübersicht in Moodle

Welche H5P-Inhaltstypen das Gradebook (Bewertungsübersicht) in Moodle nutzen können, d.h. Punkte der Lernenden speichern bzw. übertragen können, haben wir Ihnen in dem nachfolgenden Dokument zusammengestellt: Datei:H5P-Bewertungsübersicht-in-Moodle.pdf

Formeln darstellen mit TeX in H5P

Innerhalb von H5P können mathematische Ausdrücke und weitere Formeln mithilfe von TeX beschrieben und dargestellt werden.
Dazu muss lediglich der jeweilige TeX-Ausdruck an die Stelle (reguläre Eingabefelder) im H5P-Editor eingetragen werden, an der später der Ausdruck bzw. die Formel erscheinen soll. Hierbei werden, unabhängig vom Inhaltstyp, alle Textfelder in H5P unterstützt.

Für die Deklaration eines TeX-Ausdrucks stehen drei mögliche Wege zur Verfügung:

  • \( LaTeX Code \) für die Inline-Darstellung, d.h. für Satzteile usw.
  • \[ LaTeX Code \] oder optional $$ LaTeX Code $$ für die Block-Darstellung, d.h. als eigenständige zentrierte Formel.


Eine generelle Anleitung zur Nutzung von Tex in Moodle ist hier zu finden: Formeln darstellen mit TeX in moodle

Wichtige Hinweise

Bitte beachten Sie, dass es aktuell (11.2020) zu Problemen kommt, wenn der Inhaltstyp Single Choice in andere Inhaltytpen (z.B. Course Presentation) eingebettet wird. Sofern Sie eine solche Konstellation umsetzen möchten, nutzen Sie hierzu den Inhaltstyp Multiple Choice und realisieren Sie diesen in der Art und Weise einer Single-Choice-Fragestellung. Die autonome Nutzung des Inhaltstyps Single Choice ist hingegen problemlos möglich.

Changelog (Änderungsprotokoll)

April 2018

  • Der Inhaltstyp "Image Hotspots" steht nun zur Verfügung.


Juni 2018

  • Der Inhaltstyp "Drag and Drop" steht nun zur Verfügung.
  • Der Inhaltstyp "Personality Quiz" steht nun zur Verfügung.
  • Der Inhaltstyp "Quiz (Question Set)" steht nun zur Verfügung.


Juli 2018

  • H5P Vorlagen für den Inhaltstyp Course Presentation (im Corporate Design der UDE) hinzugefügt.


August 2018

  • Generelle Unterstützung von TeX in H5P, zur Darstellung von Formeln [Testphase gestartet]
  • Der Inhaltstyp "Summary" steht nun zur Verfügung.


September 2018

  • Der Inhaltstyp "Documentation Tool" steht nun zur Verfügung.


Oktober 2018

  • Der Inhaltstyp "Interactive Video" steht nun zur Verfügung. [Testphase gestartet]


Dezember 2018

  • Der Inhaltstyp "Dialog Cards" steht nun zur Verfügung.


Mai 2019

  • Der Inhaltstyp "Branching Scenario (beta)" steht nun zur Verfügung.
  • Der Inhaltstyp "Virtual Tour (360)" steht nun zur Verfügung.


Oktober 2019

  • TeX wurde in H5P integriert.


Dezember 2019

  • Der Inhaltstyp "Advanced fill the blanks" steht nun zur Verfügung.
  • Der Inhaltstyp "Agamotto" steht nun zur Verfügung.
  • Der Inhaltstyp "Dictation" steht nun zur Verfügung.
  • Der Inhaltstyp "Image pairing" steht nun zur Verfügung.


März 2020

  • Kurzübersicht zu allen H5P-Inhaltstypen (PDF, im Abschnitt "Weiterführende Informationen") wurde hinzugefügt.


Mai 2020

  • Hinweis auf Video-Tutorial (Interaktive Lernmodule in Moodle erstellen mit H5P) hinzugefügt.


August 2020

  • Der Inhaltstyp "Interactive Book" steht nun zur Verfügung.


Oktober 2020

  • Der Inhaltstyp "KewAr Code" steht nun zur Verfügung.


Dezember 2020

Abgerufen von „https://wiki.uni-due.de/moodle/index.php?title=H5P&oldid=2127“