H5P: Drag and Drop

Lernende bewegen Text- oder Bildobjekte, um logische Verknüpfungen und inhaltliche Zusammenhänge zu visualisieren. Alle Arten von Relationen sind möglich: eins-zu-eins, eins-zu-viele, viele-zu-eins und viele-zu-viele.

Logo: Fill in the Blanks
Logo: Fill in the Blanks

    Drag and Drop hat meiner Ansicht nach einen unglücklichen Namen. Auch bei Drag the Words wird nämlich „gezogen und fallen gelassen“. Der Unterschied besteht darin, dass es bei Drag and Drop einen visuellen Zusammenhang gibt.

    Eine Aufgabe mit Drag and Drop erstellen

    Eine Drag und Drop-Aufgabe zu erstellen ist nicht ganz einfach. Dabei meine ich hier noch gar nicht die Entwicklung eines guten didaktische Design. Darauf gehe ich später ein. Bei Drag und Drop ist auch die technische Herstellung etwas schwieriger als bei vielen anderen H5P-Modulen. Didaktische DesignerInnen müssen nämlich graphische Objekte entwickeln und die Ablageflächen Pixel-genau positionieren. Dazu kommt noch, dass auch die Einstellungsmöglichkeiten sehr vielfältig und damit komplex sind. 1

    Wie immer schreibe ich hier nicht ein weiteres Tutorial zu Drag and Drop, sondern diskutiere die Handhabung des H5P-Moduls unter didaktischen Gesichtspunkten. Die genannten Schwierigkeiten im Umgang mit diesem Modul ergeben sich aus dem integrativen Zusammenspiel vier verschiedener Objekte:

    Hintergrund, Ablageflächen und verschiebbare Objekte

    Symbol Bedeutung Funktion
    nicht vorhanden Hintergrundbild Fixer Hintergrund ("Bühne") auf der die drei anderen Objekte positioniert werden.
    Ablagefläche Bereiche, auf den die Text- oder grafisches Objekte positioniert werden.
    Textobjekt Verschiebbare Textobjekte, die auf die Ablageflächen positioniert werden.
    Grafisches Objekt Verschiebbare grafisches Objekte, die auf die Ablageflächen positioniert werden.
  1. Es braucht einen gut entwickelten Hintergrund, wo die visuellen Darstellung(en) so organisiert sind, dass
    1. ein geeigneter Platz für Ablageflächen frei bleibt und außerdem noch
    2. ein geeigneter Platz für ein „Startreservoir“ vorhanden ist, aus dem die verschiebbaren Objekte entnommen werden.
  2. Eine weitere Schwierigkeit besteht darin, dass zusammengehörige Ablageflächen, Text- und grafische Objekte alle gleich groß sein sollten. Andernfalls verraten Sie bereits durch ihre unterschiedliche Form die Lösung der Aufgabe. Oder aber es ergibt sich ein unschönes Bild, wenn inhaltlich korrekte Objekte nicht dieselben Dimensionen haben, wie jene Ablageflächen, auf die sie positionieren werden.

Mit einem Beispiel lassen sich die oben erwähnten Schwierigkeiten besser verstehen.

Didaktische Überlegungen

Die erste große didaktische Leistung besteht bereits darin, Zusammenhänge grafisch umzusetzen. Im oberen Beispiel habe ich diese kreative Herausforderung nicht selbst unternommen. Ich habe die Grafik – mit dem Einverständnis der Autoren – aus „Introduction to the New Statistics“2 entnommen.

Wenn Sie sich die rechte Grafik näher anschauen, dann sieht sie ziemlich komplex aus. Selbst mit einem beträchtlichen statistischem Fachwissen ist nicht sofort klar, was die einzelnen Felder der Grafik bedeuten sollen. Deshalb habe ich die Aufgabe durch zwei Hinweise wesentlich erleichtert:

  • Es verschiedene Gruppen mit gleich großen Ablageflächen. Damit ist offensichtlich, dass z.B. die Symbole M, µ und N nur in die kleinen quadratischen Ablageflächen positioniert gehören.
  • Diese Einschränkung habe ich noch durch eine weitere Maßnahme unterstützt: Wenn Lernende auf ein zu verschiebendes Objekt klicken, „leuchten“ nur einige der Ablageflächen auf.

Die Begrenzung der „Distraktoren“ soll natürlich didaktisch motiviert sein. Ich bin davon ausgegangen, dass die Grafik Fachbegriffe von Grundgesamtheit (population) und Stichprobe (sample) gegenüberstellt. Dementsprechend habe ich die Aufgabe so aufgebaut, dass immer nur diese Gegensatzpaare zur Auswahl stehen. Probieren Sie es mal aus!

Demo: Drop and Drag in Action

Didaktische Einstellungen

Didaktische DesignerInnen müssen für jedes verschiebbare Objekt (draggable object) und auch für jede Ablagefläche (dropzone) Einstellungen vornehmen. Als Beispiel habe ich N – das Symbol für die Größe der Stichprobe – genommen.

Zuerst werden die Optionen für die verschiebbaren Objekte festgelegt. Es wird dabei nämlich entschieden, welche Ablageflächen für das jeweilige Objekt relevant sind.

Abb. 2: Drag and Drop Beispiel: Kommentare zu den gewählten Einstellungen für das verschiebbare ‚N‘-Objekt

Danach gilt es die Einstellungen für die Ablagezonen vorzunehmen.

Abb. 3: Drag and Drop Beispiel: Kommentare zu den gewählten Einstellungen für die Ablagefläche ‚N‘

Empfehlungen für selbstbestimmtes Lernen

Abschließend fasse ich die Überlegungen wieder in eine Empfehlung zu Verhaltenseinstellungen für selbstbestimmtes Lernen zusammen:

Abb. 4: Einstellungsempfehlungen für selbstbestimmtes Lernen

Zusammenfassung

Das H5P Drag and Drop Modul ist ein außerordentliches flexibles Werkzeug zur Visualisierung inhaltlicher Zusammenhänge. Er lässt bezüglich der Aufgabenstellung praktisch keine Wünsche offen: Es können alle Arten von logischen Relationen visuell dargestellt werden.

Allerdings unterscheidet sich die Struktur des didaktischen Designs der Drag and Drop Aufgaben wesentlich von anderen H5P-Modulen und ist auch etwas komplizierter in der Handhabung. Insbesondere sind (rudimentäre) Kenntnisse mit einem Grafikprogramm bei der Erstellung von Drag and Drop-Übungen vorteilhaft.

Ein großes Manko ist jedoch, dass es (derzeit?) keine Möglichkeit gibt die richtige Lösung anzuzeigen. 3 Selbst wenn alle Ablageflächen ausgefüllt sind, wird nur richtig oder falsch angezeigt, aber nicht, was die richtige Lösung wäre. Das ist gerade für selbstbestimmtes Lernen äußerst unangenehm. Lernende sind dann entweder zum Probieren gezwungen oder es muss ein Link zu eine grafischen Darstellung der Lösung vorbereitet werden.


Fußnoten

  1. Die Schwierigkeit dieses Moduls zeigt sich u.a. auch darin, dass das offizielle H5P-Tutorial zu Drag and Drop gleich fünfmal gelb hervorgehobene Hinweise aufweist.
  2. Cumming, G., & Calin-Jageman, R. (2017). Introduction to the New Statistics: Estimation, Open Science, and Beyond. Routledge.
  3. Siehe den Kommentar There is no show solution mode, angeblich weil es zu schwierig ist, die vielen Lösungsvarianten abzubilden. Auf derselben Seite meldet jedoch ein Mitglied der H5P-Community, dass er eine Lösung gefunden hat. Ich habe sie kurz getestet.  Diese wertvolle Erweiterung scheint – bis auf kleinere grafische Glitches – gut zu funktionieren.
    Warum solche Lösungsansätze von den  H5P-Programmieren bei Joubel nicht aufgegriffen werden, verstehe ich nicht. Je mehr ich mich mit H5P beschäftige, desto deutlicher wird es für mich, dass die H5P-Community nicht selbstorganisiert ist. Das zeigt sich für mich auch daran, dass alle Forumsbeiträge vor ihrer Veröffentlichung erst geprüft werden. Das ist nicht nur eine Bevormundung, sondern verdeutlicht auch eine Hierarchie innerhalb der Community.

Von Peter Baumgartner

Seit mehr als 30 Jahren treiben mich die Themen eLearning/Blended Learning und (Hochschul)-Didaktik um. Als Universitätsprofessor hat sich dieses Interesse in 13 Bücher, knapp über 200 Artikel und 20 betreuten Dissertationen niedergeschlagen. Jetzt in der Pension beschäftige ich mich mit Open Science und Data Science Education.

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Captcha loading...