Leporello – bebilderte Schritt-für-Schritt-Anleitungen
Ein Leporello ist hier eine kleine Webseite, die eine Anleitung Schritt für Schritt zeigt: zu jedem Schritt ein kurzer Text und ein oder mehrere Fotos. Man blättert mit großen Knöpfen, den Pfeiltasten oder per Wischen auf dem Tablet. Gedacht ist das z. B. für Versuchsaufbauten, Konstruktionen im Matheunterricht oder die Bedienung von Geräten – überall dort, wo Schülerinnen und Schüler in ihrem eigenen Tempo nachschauen sollen, wie es weitergeht.
- Beispiel ansehen: Licht im Regentropfen
- Kurzes Beispiel mit Platzhalterbildern
- Editor öffnen
- Ausführliche Hilfe (README)
Wie funktioniert das?
Das Ganze besteht nur aus drei Dateien, ohne Server, Datenbank oder Installation:
index.html– der Viewer, in dem die Anleitung angezeigt wird,anleitung.js– Texte und Bilder einer Anleitung (die Bilder stecken direkt mit in der Datei),editor.html– zum Erstellen und Bearbeiten solcher Anleitungsdateien.
Der Viewer bleibt immer gleich, es wird nur die Anleitungsdatei ausgetauscht. Welche er lädt,
steht in der Adresse: index.html?a=regenbogen öffnet z. B. die Datei
anleitung_regenbogen.js. Mit #3 am Ende springt man direkt zu Schritt 3.
In fünf Minuten zum eigenen Leporello
- Für jeden Arbeitsschritt ein Foto machen (Handy, Tablet oder Dokumentenkamera) und die Bilder in einem Ordner sammeln.
- Den Editor öffnen, eine Überschrift eintragen und die Fotos in den Bilderpool ziehen. Sie werden dabei automatisch verkleinert.
- Bilder anklicken und mit „+ Neuer Schritt aus Markierten“ zu Schritten
zusammenfassen, dann zu jedem Schritt den Text schreiben (
**fett**und Links sind möglich). - Bei Bedarf Bilder mit ✎ zuschneiden oder drehen bzw. mit „Alle Bilder verkleinern“ die Datei kleiner machen.
- Einen Dateinamen wie
anleitung_meinthema.jsvergeben und „Speichern“ klicken – die Datei landet im Download-Ordner.
Alles passiert nur im eigenen Browser, es wird dabei nichts hochgeladen. Zum Weiterarbeiten die gespeicherte Datei im Editor über „Öffnen …“ wieder laden.
Die eigene Anleitung nutzen
Direkt hier auf der Seite
Im Viewer unten auf „Eigene Anleitung öffnen …“
klicken oder die .js-Datei einfach auf die Seite ziehen. Die Datei wird nur im
eigenen Browser gelesen und nicht hochgeladen. So lässt sich eine Anleitung z. B. per
Mail, Moodle-Kurs oder USB-Stick weitergeben: Die Schülerinnen und Schüler öffnen diese Seite
und laden die Datei hinein.
Auf einem eigenen Webspace
index.html herunterladen (im Browser „Seite speichern unter …“) und zusammen mit
den eigenen anleitung_….js-Dateien in einen Ordner auf dem Webspace legen. Ein Link
wie …/index.html?a=meinthema führt dann direkt zur gewünschten Anleitung. Das
funktioniert auch offline: Beide Dateien in denselben Ordner legen und index.html
per Doppelklick öffnen.
Gut zu wissen
- Weil die Bilder in der Anleitungsdatei stecken, wird sie schnell einige Megabyte groß. 1280 oder 1600 px Kantenlänge reichen für den Bildschirm völlig aus.
- Auf Fotos möglichst keine Gesichter oder Namen von Schülerinnen und Schülern zeigen, wenn die Anleitung öffentlich verlinkt wird.
- Details zu allen Funktionen stehen in der README.
unterrichtsportal.org