Interaktive Übungen

{{Fit für OER!}}

Eigene interaktive Übungen entstehen durch Kopieren, Einfügen und Verändern vorhandener Beispiele einfach und schnell.

Ein sinnvolles einfaches Verfahren ist es, sich den WikiText zu einer interaktiven Übung zu kopieren und diesen dann den eigenen Vorstellungen entsprechend zu modifizieren.

Eine andere Möglichkeit ist, sich auf der [[Hilfe:Interaktive Übungen]] anzuschauen, welche Möglichkeiten für interaktive Übungen es gibt, und dann den entsprechenden WikiText zu kopieren und den eigenen Vorstellungen entsprechend zu modifizieren:

'''Interaktive Übungen''' können im ZUM-Wiki und in den Wikis der [[Wiki-Family]] mit Hilfe einiger dafür installierter [[Hilfe:Erweiterungen|Erweiterungen]] zur [[MediaWiki]]-Software selbst erstellt werden.

Die wichtigsten Werkzeuge bzw. Möglichkeiten hierfür sind die [[#Erweiterung Quiz|Erweiterung Quiz]], das [[#Quiz-Script Framework|Quiz-Script Framework]] sowie die Möglichkeit auf andere Art das [[#Verstecken und Anzeigen|Verstecken und Anzeigen]].

== Lückentext ==

=== Lückentext mit dem Quiz-Script Framework ===
{| class="wikitable"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="lueckentext-quiz">
Werden Zahlen '''addiert''' (zusammengezählt), so nennt man das Ergebnis '''Summe'''.
</div>
| width="50%" | 
<nowiki>
<div class="lueckentext-quiz">
Werden Zahlen '''addiert''' (zusammengezählt), so nennt man das Ergebnis '''Summe'''.
</div>
</nowiki>
|-
|}

=== Lückentext mit Quiz ===

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%"| 
<quiz>
{ Ergänze die fehlenden Präpositionen!
| type="{}" }
Karl: "Hallo Anne, ich bin  { im } Kino, wo bist du?"
Anne: "Ich warte { vor } dem Eingang! Und wo bist du?"
Karl: "Ich stehe { hinter } { dem } Eingang."
Anne: "Gehen wir noch { ins } Cafe Central?"
Karl: "Gern, { im } Cafe Central war ich schon lange nicht."
</quiz>
| width="50%"|
<pre>
<quiz>
{ Ergänze die fehlenden Präpositionen!
| type="{}" }
Karl: "Hallo Anne, ich bin  { im } Kino, wo bist du?"
Anne: "Ich warte { vor } dem Eingang! Und wo bist du?"
Karl: "Ich stehe { hinter } { dem } Eingang."
Anne: "Gehen wir noch { ins } Cafe Central?"
Karl: "Gern, { im } Cafe Central war ich schon lange nicht."
</quiz>
</pre>
|}

=== Mehr ===

{{Siehe|Lückentexte}}

== Memo-Quiz ==

'''Memo-Quiz''' ist die Bezeichnung für ein [[Memo-Spiel]], das mit dem [[Quiz-Script Framework]] ermöglicht wird.

===Memo-Quiz mit dem Quiz-Script Framework ===
 
{{siehe|Quiz-Script Framework#Memo-Quiz}}

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="memo-quiz">

<big>'''Geometrische Figuren'''</big><br>
Finde die Paare aus je einem Bild und dem dazu passenden Begriff.

{| 
|-
| [[Bild:Dreieck.svg|100px]] || Dreieck
|-
| [[Bild:Viereck1.jpg|100px]] || Viereck
|-
| [[Bild:Kreisfläche bestimmen.png|100px]] || Kreis
|}
</div>
| width="50%" |
<pre>
<div class="memo-quiz">

<big>'''Geometrische Figuren'''</big><br>
Finde die Paare aus je einem Bild und dem dazu passenden Begriff.

{| 
|-
| [[Bild:Dreieck.svg|100px]] || Dreieck
|-
| [[Bild:Viereck1.jpg|100px]] || Viereck
|-
| [[Bild:Kreisfläche bestimmen.png|100px]] || Kreis
|}
</div>
</pre>
|}

== Multiple Choice ==

=== Multiple Choice mit Quiz - Eine Antwort gesucht ===

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
'''Klicke auf die richtige Lösung!'''

<quiz display="simple">
{Kennst du den Mann, der da __________ in der letzten Reihe sitzt?}
- hinter
- vorne
+ hinten
</quiz>
| width="50%" |
<pre>
'''Klicke auf die richtige Lösung!'''

<quiz display="simple">
{Kennst du den Mann, der da __________ in der letzten Reihe sitzt?}
- hinter
- vorne
+ hinten
</quiz>
</pre>
|}

=== Multiple Choice mit Quiz - Mehrere Fragen ===

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<quiz display="simple">
{Frage 1}
- falsche Antwort Nr. 1
+ richtige Antwort
- falsche Antwort Nr. 2

{Frage 2}
+ richtige Antwort
- falsche Antwort Nr. 1
- falsche Antwort Nr. 2

</quiz>
| width="50%" |
<pre>
<quiz display="simple">
{Frage 1}
- falsche Antwort Nr. 1
+ richtige Antwort
- falsche Antwort Nr. 2

{Frage 2}
+ richtige Antwort
- falsche Antwort Nr. 1
- falsche Antwort Nr. 2

</quiz>
</pre>
|}

=== Multiple Choice mit dem Quiz-Script Framework ===

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
Die folgenden Aufgaben können auch mehrere richtige Antworten enthalten! 

<div class="multiplechoice-quiz">

Wer hat Amerika entdeckt? (Christoph Kolumbus) (!Marco Polo) (!James Cook)

Welches Tier ist ein Säugetier? (!Hai) (Wal) (Känguru) (!Meise) (Maus) (!Biene)

Wie lange dauerte der dreißigjährige Krieg? (!4 Jahre) (!10 Jahre) (30 Jahre) (!9 Monate)

</div>
| width="50%" |
<pre>
Die folgenden Aufgaben können auch mehrere richtige Antworten enthalten! 

<div class="multiplechoice-quiz">

Wer hat Amerika entdeckt? (Christoph Kolumbus) (!Marco Polo) (!James Cook)

Welches Tier ist ein Säugetier? (!Hai) (Wal) (Känguru) (!Meise) (Maus) (!Biene)

Wie lange dauerte der dreißigjährige Krieg? (!4 Jahre) (!10 Jahre) (30 Jahre) (!9 Monate)

</div>
</pre>
|}

=== Mehr ===

{{Siehe|Multiple Choice}}

== Puzzle ==

=== Puzzle mit dem Quiz-Sript Framework ===

Das [[Quiz-Script Framework]] von [[Felix Riesterer]] ermöglicht auch ein leichtes Erstellen von Bilder-Puzzles im ZUM-Wiki.

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="lueckentext-quiz">
[[Bild:Ostern_ganz_vorschau.jpg|100px|right]] <!-- Anzeige Gesamtbild -->
{| class="puzzle"
|'''[[Bild:Ostern_1_1.jpg|100px]]'''
|'''[[Bild:Ostern_1_2.jpg|100px]]'''
|'''[[Bild:Ostern_1_3.jpg|100px]]'''
|-
|'''[[Bild:Ostern_2_1.jpg|100px]]'''
|'''[[Bild:Ostern_2_2.jpg|100px]]'''
|'''[[Bild:Ostern_2_3.jpg|100px]]'''
|-
|'''[[Bild:Ostern_3_1.jpg|100px]]'''
|'''[[Bild:Ostern_3_2.jpg|100px]]'''
|'''[[Bild:Ostern_3_3.jpg|100px]]'''
|}
</div>
| width="50%" |
<pre>
<div class="lueckentext-quiz">
[[Bild:Ostern_ganz_vorschau.jpg|100px|right]] <!-- Anzeige Gesamtbild -->
{| class="puzzle"
|'''[[Bild:Ostern_1_1.jpg|100px]]'''
|'''[[Bild:Ostern_1_2.jpg|100px]]'''
|'''[[Bild:Ostern_1_3.jpg|100px]]'''
|-
|'''[[Bild:Ostern_2_1.jpg|100px]]'''
|'''[[Bild:Ostern_2_2.jpg|100px]]'''
|'''[[Bild:Ostern_2_3.jpg|100px]]'''
|-
|'''[[Bild:Ostern_3_1.jpg|100px]]'''
|'''[[Bild:Ostern_3_2.jpg|100px]]'''
|'''[[Bild:Ostern_3_3.jpg|100px]]'''
|}
</div>
</pre>
|}

;Voraussetzungen

Als Anleitung ist lediglich vonnöten, dass alle Teilbilder eine Abmessung von 100x100 Pixeln haben.

== Suchsel ==

=== Suchsel mit dem Quiz-Script Framework ===

Im ZUM-Wiki und in den Wikis der [[Wiki-Family]] können Suchsel mit Hilfe des [[Quiz-Script Framework]]s leicht erstellt werden, wie das folgende Beispiel zeigt:

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="suchsel-quiz">
Finde drei Wörter zum Thema Schule (waagerecht und senkrecht)!
{|
|Lehrer
|-
|Schüler
|-
|lernen
|}
</div>
| width="50%" |
<pre>
<div class="suchsel-quiz">
Finde drei Wörter zum Thema Schule (waagerecht und senkrecht)!
{|
|Lehrer
|-
|Schüler
|-
|lernen
|}
</div>
</pre>
|}

{{Achtung|Bitte nur wenige (nicht mehr als ca. 6) Suchbegriffe verwenden! Denn sonst kommt es zu Darstellungsproblemen!}}

== Zuordnung ==

=== Zuordnung mit dem Quiz-Script Framework ===

==== Zuordnung - paarweise ====

===== Beispiel =====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="zuordnungs-quiz">
{| 
|-
| [[Bild:4706bee.web.jpg|60px]] || Biene
|-
| [[Bild:Rote_Birne.jpg|60px]] || Birne
|-
| [[Bild:Gluecks_schwein.jpg]] || Glücksschwein
|}
</div>
| width="50%" |
<pre>
<div class="zuordnungs-quiz">
{| 
|-
| [[Bild:4706bee.web.jpg|60px]] || Biene
|-
| [[Bild:Rote_Birne.jpg|60px]] || Birne
|-
| [[Bild:Gluecks_schwein.jpg]] || Glücksschwein
|}
</div>
</pre>
|}

===== Beispiel - mit vorangestellten Hinweisen =====

In einer "Kopfzeile" können eine Überschrift und / oder Arbeitsanweisungen bzw. Hinweise der Übung vorangestellt werden.

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="zuordnungs-quiz">
<big>'''Zuordnung'''</big><br>
Ordne Bilder und Begriffe richtig zu.
{| 
|-
| [[Bild:4706bee.web.jpg|60px]] || Biene
|-
| [[Bild:Rote_Birne.jpg|60px]] || Birne
|-
| [[Bild:Gluecks_schwein.jpg]] || Glücksschwein
|}
</div>
| width="50%" |
<pre>
<div class="zuordnungs-quiz">
<big>'''Zuordnung'''</big><br>
Ordne Bilder und Begriffe richtig zu.
{| 
|-
| [[Bild:4706bee.web.jpg|60px]] || Biene
|-
| [[Bild:Rote_Birne.jpg|60px]] || Birne
|-
| [[Bild:Gluecks_schwein.jpg]] || Glücksschwein
|}
</div>
</pre>
|}

==== Zuordnung - Gruppe ====

mit Drag & Drop (Ziehen und Fallenlassen)

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="zuordnungs-quiz">
<big>'''Zuordnung'''</big><br>
Ordne die Bilder und Begriffe unten den richtigen Oberbegriffen zu.
{| 
| Insekt || Käfer || [[Bild:4706bee.web.jpg|60px]] || Ameise || Motte
|-
| Obst || Pflaume || [[Bild:Rote_Birne.jpg|60px]] || Apfel || Kirsche || Banane
|-
| Nutztier || [[Bild:Gluecks_schwein.jpg]] || Schaf || Rind
|}
</div>
| width="50%" |
<pre>
<div class="zuordnungs-quiz">
<big>'''Zuordnung'''</big><br>
Ordne die Bilder und Begriffe unten den richtigen Oberbegriffen zu.
{| 
| Insekt || Käfer || [[Bild:4706bee.web.jpg|60px]] || Ameise || Motte
|-
| Obst || Pflaume || [[Bild:Rote_Birne.jpg|60px]] || Apfel || Kirsche || Banane
|-
| Nutztier || [[Bild:Gluecks_schwein.jpg]] || Schaf || Rind
|}
</div>
</pre>
|}

==== Richtige Reihenfolge finden ====

'''Hans tauscht auf seinem Weg nach Hause verschiedene Dinge. Suche die richtige Reihenfolge der getauschten Dinge.'''

''Aus: [[:dsd:Beispielaufgabe Glück/Aufgabe 4|DSD-Wiki:Glück/Aufgabe 4]]''

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<div class="lueckentext-quiz">

{| 
|- 
|  || Wort || Bild
|- 
| 1 || '''das Gold''' || '''[[Bild:Goldkey logo removed.jpg|100px]]'''
|- 
| 2 || '''das Pferd''' || '''[[Bild:Franz Marc 003.jpg|70px]]''' 
|- 
| 3 || '''die Kuh''' || '''[[Bild:Johann Friedrich Voltz Kuh.jpg|100px]]'''
|- 
| 4 || '''das Schwein''' || '''[[Bild:Picswiss GR-87-14 Zufriedenes Schwein in Le Prese.jpg|100px]]'''
|- 
| 5 || '''die Gans''' || '''[[Bild:Gans.jpg|100px]]''' 
|- 
| 6 || '''der Schleifstein''' || '''[[Bild:Noe schleifstein.jpg|70px]]''' 
|}

</div>
| width="50%" |
<pre>
<div class="lueckentext-quiz">

{| 
|- 
|  || Wort || Bild
|- 
| 1 || '''das Gold''' || '''[[Bild:Goldkey logo removed.jpg|100px]]'''
|- 
| 2 || '''das Pferd''' || '''[[Bild:Franz Marc 003.jpg|70px]]''' 
|- 
| 3 || '''die Kuh''' || '''[[Bild:Johann Friedrich Voltz Kuh.jpg|100px]]'''
|- 
| 4 || '''das Schwein''' || '''[[Bild:Picswiss GR-87-14 Zufriedenes Schwein in Le Prese.jpg|100px]]'''
|- 
| 5 || '''die Gans''' || '''[[Bild:Gans.jpg|100px]]''' 
|- 
| 6 || '''der Schleifstein''' || '''[[Bild:Noe schleifstein.jpg|70px]]''' 
|}

</div>
</pre>
|}

Die Übung eignet sich, um Satzteile in Sätze und Sätze zu Texten zu ordnen. Das oben stehende Beispiel bindet zusätzlich Bilder zum besseren Lexikverständnis mit ein. Leider funktioniert nicht immer die Zuordnung der Bilder, welche oft leicht "verrutschen".

=== Mehr ===

{{Siehe|Interaktive Übungen/Zuordnungen}}

== Exkurs: Verstecken und Anzeigen ==

=== Verstecken und Anzeigen mit PopUp ===

==== popup ====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<popup>eigener Text</popup>
| width="50%" |
<pre><popup>eigener Text</popup></pre>
|}

==== popup name ====

===== allgemein =====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<popup name="eigener Name">eigener Text</popup>
| width="50%" |
<pre><popup name="eigener Name">eigener Text</popup></pre>
|}

===== Beispiele =====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
<popup name="Bild">
Hier könnte ein Bild sein :-)
</popup>
| width="50%" |
<pre>
<popup name="Bild">
Hier könnte ein Bild sein :-)
</popup>
</pre>
|-
|
<popup name="Lösung">
eigener Text
</popup>
|
<pre>
<popup name="Lösung">
eigener Text
</popup>
</pre>
|-
|}

=== Verstecken und Anzeigen mit Vorlagen ===

==== Vorlage:Versteckt ====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
Manche Aufgaben kann man nur mit Hilfe lösen.

{{versteckt|
Ich bin eine Hilfe.}}
| width="50%" |
<pre>
Manche Aufgaben kann man nur mit Hilfe lösen.

{{versteckt|
Ich bin eine Hilfe.}}
</pre>
|}

==== Vorlage:Lösung versteckt ====

{| class="wikitable" width="100%"
|-
! Das sieht man !! Das schreibt man
|-
| width="50%" |
1 + 1 = ?

{{Lösung versteckt|
2
}}
| width="50%" |
<pre>1 + 1 = ?

{{Lösung versteckt|
2
}}
</pre>
|}

== Interaktive Übungen kopieren und überarbeiten ==

# Klick neben der Überschrift der jeweiligen Übung auf "Bearbeiten", dann siehst du, wie die Übung im Quellcode aussieht, wie sie also sozusagen programmiert ist.
# Kopiere das Ganze auf eine Wiki-Seite.
# Dann tausche den Text durch einen eigenen Text aus.
# Achte darauf, welche Wirkung die Markierungen im Quellcode haben. Teste dies, indem du Markierungen austauschst und klicke unten auf {{Taste|Vorschau zeigen}}.
# Speichere die fertige Übung mit {{Taste|Seite speichern}}.

== Siehe auch ==

* [[Hilfe:Interaktive Übungen]]

== LearningApps nutzen ==

{{Siehe|../LearningApps/}}

{{Fit für OER!}}