Digiscreen ist ein digitaler Klassenraum von La Digitale, der Lehrkräften viele Tools zur Verfügung stellt, um den Unterricht interaktiv zu gestalten. Es beinhaltet über 30 verschiedene Tools, wie zum Beispiel eine Uhr oder einen Timer, einen Zufallsgenerator und Gruppeneinteiler, Würfel und ein Spielbrett, Umfrage- und Feedbackmöglichkeiten, einen Lautstärkemesser, einen Kalender und sogar ein Whiteboard auf dem Tafelanschriften angefertigt werden können.

Das Besondere an Digiscreen ist, dass der Code quelloffen ist, also von jedem an seine eigenen Wünsche angepasst und auf einer eigenen Webseite zur Verfügung gestellt werden kann.

Ich habe zum Beispiel den Original Digiscreen (https://ladigitale.dev/digiscreen/) verändert und ein Umfrage-Tool hinzugefügt. Die neue Version habe ich dann auf unsere-schule.org veröffentlicht (https://digiscreen.unsere-schule.org/), diese kannst du auch über das Menü „Tools“ finden:

Digiscreen in der Schule

Im Folgenden werde ich dir ein paar der Tools vorstellen und einen möglichen Einsatz im Unterricht beschreiben.

1) Timer

Mit dem Timer kannst du den Schülern anzeigen, wie lange sie für eine Aufgabe Zeit haben. Der Digiscreen wird mit dem Timer auf der Tafel angezeigt und jeder weiß, wie viel Zeit noch übrig ist.

2) Gruppenwahl

Die Gruppenwahl hilft dir Schüler in zufällige Gruppen einzuteilen. Das kann für Gruppenarbeiten oder für den Sportunterricht gut sein, um die Schüler besser zu durchmischen. Zuerst gibst du die Schüler in ein Textfeld ein, gibst die Größe der Gruppen an und dann werden die Schüler in zufällige Gruppen eingeteilt.

3) Externe Inhalte einbetten (iFrame)

Du kannst verschiedene externe Inhalte auf den Digiscreen einbinden. Hier siehst du zum Beispiel eine Aufgabe von LearningApps und daneben einen Timer, der anzeigt wie viel Zeit die Schüler noch haben.

4) Umfrage

Mit dem Umfragetool kannst du verschiedene Abstimmungen in deiner Klasse durchführen. Die Schüler können zur Tafel kommen und auf eine Option drücken, um die Stimme abzugeben.

5) Tafelanschrift erstellen

Neben den über 30 Tools kannst du auch Annotationen vornehmen, um den Digiscreen als Tafel zu verwenden. Auch wenn meine Schrift hier nicht besonders schön ist, kann man Anschriften recht leicht erstellen.

6) Ein Spiel spielen

Willst du mit deinen Schülern ein Spiel spielen? Sogar das ist mit Digiscreen möglich. Dazu kannst du das Tool Spiel öffnen und einfach ein Bild eines Spielbretts als Hintergrund wählen und einen Würfel hinzufügen. Jetzt können deine Schüler würfeln und dann ihre Spielfigur auf dem Spielbrett bewegen.

7) Mehrere Seiten

Du kannst weitere Seiten über die Einstellungen hinzufügen und diese mit verschiedenen Tools oder der Annotation nutzen. Hast du mehr als eine Seite, werden links weiße Punkte angezeigt, mit denen du die Seiten wechseln kannst.

8) Digiscreen speichern

Alle Daten die du mit Digiscreen nutzt, werden nur in deinem Browser zwischengespeichert. Die Nutzung ist also datenschutzunbedenklich. Willst du deinen Digiscreen speichern, gehst du zu Einstellungen und dann auf „Digiscreen exportieren„. Jetzt wird eine Digiscreen-Datei zum Herunterladen erstellt. Diese .DGS-Datei kannst du dann wieder unter Einstellungen importieren.

Digiscreen anpassen

Wie anfangs erwähnt ist die Besonderheit von Digiscreen, dass der Quellcode eingesehen und angepasst werden kann.

Folgende Anpassungen habe ich für den Digiscreen von unserer-schule.org vorgenommen:

• Übersetzungsfehler korrigiert, z.B.: Groupe 1 -> Gruppe 1
• Standardhintergrund auf ein kariertes Papier geändert.
• Hauptfarbton auf blau geändert.
• Seitennavigation angepasst, damit diese besser sichtbar ist.
• Größe des Timer-Tools verändert.
• Würfelanimation hinzugefügt.
• Neues Modul: „Umfrage“ erstellt.

Damit du eigene Anpassungen vornehmen kannst, musst du zuerst den Quellcode von Digiscreen herunterladen, um diesen in einer Entwicklungsumgebung ausführen zu können. Hier kannst du den Quellcode der beiden Versionen herunterladen:

1. Originalquellcode von Digiscreen
2. Quellcode der angepassten unsere-schule.org Version von Digiscreen

Um den Quellcode bearbeiten und die Entwicklungsumgebung ausführen zu können musst du dir noch Node.js und Visual Studio Code herunterladen.

Nachdem du beides installiert hast, öffnest du im Visual Studio Code Editor den heruntergeladenen Ordner von Digiscreen.

Nun kannst du die komplette Projektstruktur sehen. Da Digiscreen verschiedene Javascriptmodule benötigt, musst du diese erst installieren, indem du folgenden Befehl in einem Terminal eingibst. Ein Terminal öffnest du in Visual Studio Code über „Terminal > new Terminal„.

npm install

Nach der Installation der benötigten Module kannst du den Entwicklungsserver starten. Den Server zum Ausführen von Digiscreen startest du mit folgendem Befehl im Terminal:

npm run serve

Ist der Server gestartet, kannst du über einen Browser unter folgender Adresse: http://localhost:8080 den Digiscreen aufrufen. Wenn du nun eine Datei im Visual Studio Code Editor änderst und speicherst, werden die Änderungen sofort übernommen und du kannst das Ergebnis im Browser sehen.

Hast du deine Anpassungen vorgenommen und willst deinen Digiscreen auf deinen Webserver, z.B. von der Schule, hochladen, musst du in Visual Studio Code im vorher geöffneten Terminal folgenden Befehl eingeben:

npm run build

Daraufhin werden die zur Veröffentlichung benötigten Dateien im Ordner „/Digiscreen/dist/“ erstellt und du kannst diese direkt auf deinen Webserver hochladen.

Die von mir gebauten Dateien vom Digiscreen von unserer-schule.org kannst du hier finden: https://github.com/Sulkar/Digiscreen-unsere-schule.org/releases

Jetzt hast du deine eigene Version von Digiscreen erstellt!

Solltest du Hilfe benötigen, kannst du dich gerne per Mail: r.scheglmann@gmail.com an mich wenden.

Links:

• Webseite von La Digitale
• Repository von Digiscreen für unsere-schule.org
• Repository vom original Digiscreen