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.

Wie funktioniert das?

Das Ganze besteht nur aus drei Dateien, ohne Server, Datenbank oder Installation:

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

  1. Für jeden Arbeitsschritt ein Foto machen (Handy, Tablet oder Dokumentenkamera) und die Bilder in einem Ordner sammeln.
  2. Den Editor öffnen, eine Überschrift eintragen und die Fotos in den Bilderpool ziehen. Sie werden dabei automatisch verkleinert.
  3. Bilder anklicken und mit „+ Neuer Schritt aus Markierten“ zu Schritten zusammenfassen, dann zu jedem Schritt den Text schreiben (**fett** und Links sind möglich).
  4. Bei Bedarf Bilder mit ✎ zuschneiden oder drehen bzw. mit „Alle Bilder verkleinern“ die Datei kleiner machen.
  5. Einen Dateinamen wie anleitung_meinthema.js vergeben 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