Scratch – Spiel mit Kamera-Erweiterung

In dieser Aufgabe aus dem Bereich der fortgeschrittenen Scratch-Programmierung entwickelst du ein Spiel, bei dem du ein zugeschneites Fenster wieder vom Schnee befreien musst. Du verwendest dafür die Kamera-Erweiterung, die Musik-Erweiterung, die Klon-Funktion und Nachrichten.

Ausprobieren

Bevor du mit der Programmierung des Scratch Spiels mit der Kamera-Erweiterung startest, kannst du es als erstes einmal selbst ausprobieren. Starte das Spiel über die grüne Flagge.

Achte darauf, dass du die Verwendung der Kamera erlauben musst. Schalte auch den Ton deines Rechners an, um das Spiel vollständig genießen zu können.

Zu Beginn des Spiels siehst du ein kleines Intro. Der bzw. die Spielerin wacht an einem winterlichen Morgen auf und schaut zum Fenster heraus. Da fängt es an zu Schneien und das Fenster friert zu. Ab diesem Zeitpunkt beginnt das Scratch Spiel mit der Kamera-Erweiterung für dich. Bewege deine Hände vor der deiner Kamera hin und her. So wird das Fenster wieder vom Schnee befreit. Die Idee für dieses Spiel habe ich von einer tollen anderen Scratcherin erhalten: CreateGamesWithJJ. Auf ihrer Seite findest du noch viele andere Scratch-Ideen. Da lohnt sich das vorbeischauen!

Kurzanleitung

Zur vollständigen Anleitung wechseln

Mit der Kurzanleitung stelle ich dir einen schnellen Einstieg zur Programmierung deines Scratch Spiels mit Kamera-Erweiterung zur Verfügung. Die Kurzanleitung ist besonders geeignet, wenn du dich bereits gut mit Scratch auskennst. In diesem Programm benötigst du Wissen zur Kamera-Erweiterung, zur Klon-Funktion und zum Nachrichtensystem. Falls du eine detaillierte Anleitung mit einer Schritt-für-Schritt-Beschreibung des Programmcodes lesen möchtest, kannst du die vollständige Anleitung weiter unten in diesem Blogbeitrag nutzen.

Öffne nun den Programmcode meines Beispielprogrammes. Nutze dafür den folgenden Link: https://scratch.mit.edu/projects/882271583/editor/.

Schau dir nun mein Beispielprogramm genau an. Es besteht aus einem Hintergrundbild und zwei Figuren. Im Hintergrundbild wird ein Fensterrahmen und eine Landschaft dargestellt. Die erste Figur ist die Schneeflocke, die im Spielverlauf das Fenster bedeckt. Die zweite Figur enthält mehrere Kostüme mit verschiedenen Textdialogen, die während des Spiels angezeigt werden. Den Hintergrund und die erste Figur habe ich mir über die Seite pixabay heruntergeladen. Die Textdialoge habe ich selbst gezeichnet. Außerdem spielt mein Programm eine Hintergrundmusik ab. Diese habe ich an der Textdialog-Figur hinterlegt und mir zuvor ebenfalls bei pixabay heruntergeladen.

Nun bist du dran: Erstelle einen eigenen Hintergrund, suche dir eine Schneeflocken-Figur und gestalte eine zweite Figur mit den benötigten Textdialogen.

Nun bist du so weit, dass du die Programmsequenzen der beiden Figuren in dein eigenes Programm übernehmen kannst. Alle Sequenzen sind in meinem Beispielprogramm mit Kommentaren versehen, die dir die jeweiligen Code-Abschnitte genauer erklären.

Nun ist es an der Zeit dein Programm auszutesten. Funktioniert alles so wie geplant? Wird zu Beginn des Spiels deine Animation korrekt eingeblendet? Wird während des Spiels die Hintergrundmusik abgespielt? Funktioniert die Kamera-Erweiterung korrekt? Und wird das Spiel beendet, wenn du alle Schneeflocken weggeputzt hast? Falls ein Teil deines Programmes noch nicht funktioniert wie gewünscht, dann schau doch mal, ob du mit Hilfe der vollständigen Anleitung in diesem Blogbeitrag dein Problem beheben kannst.

Herausforderungen

Wenn du jetzt noch mehr Lust hast, mit der Kamera-Erweiterung zu programmieren und dein Spiel noch ausbauen möchtest, dann versuche dich doch noch an den nachfolgenden Herausforderungen:

• Baue einen Highscore ein, der die Zeit misst, die du benötigst, um dein Fenster vom Schnee zu befreien. Kannst du deinen Highscore mit mehreren Putzversuchen verbessern?
• Programmiere weitere Level: Lass dir andere Dinge einfallen, die du mit den Händen und der Kamera-Erweiterung freiputzen kannst.
• Baue noch eine zusätzliche Animation zum Spielende ein.
• Binde mehrere unterschiedliche Schneeflocken ein.

Vollständige Anleitung

Schritt 1: Hintergrundbild und Schneeflocken-Figur auswählen

Um mit der Programmierung deines Scratch Spiels mit Kamera-Erweiterung zu starten, solltest du als erstes Scratch öffnen und ein neues Programmierprojekt starten. Du kannst dafür ganz einfach den nachfolgenden Link anklicken:

Als erstes benötigst du ein Hintergrundbild. Ich habe mir für mein Beispielprogramm ein eigenes Hintergrundbild zusammengebastelt. Dafür habe ich mir auf der Seite pixabay ein Bild eines Fensters und das Bild einer Landschaft herausgesucht.

Als zweites solltest du eine neue Figur für die Schneeflocke auswählen. Ich habe mir dafür ebenfalls auf pixabay eine passende Figur ausgesucht und in mein Scratch-Programm hochgeladen.

Schritt 2: Figur mit Textdialogen zeichnen

Als drittes benötigen wir noch eine Figur, die verschiedene Textdialoge anzeigen kann. Diese Figure habe ich selbst gezeichnet. Außerdem habe ich der Figur noch zwei Klänge spendiert. Einen Klang für die anfängliche Animation und einen weiteren Klang der später als Hintergrundmusik im Spiel abgespielt wird.

Insgesamt habe ich für die Figur 5 Kostüme erstellt.

Kostüm 1 – ein dunkler Hintergrund

Das erste Kostüm ist lediglich eine dunkle Fläche. Diese wird zu Beginn des Spieles angezeigt.

Kostüm 2 – Denkblase: es sieht schön aus

Zu Beginn meines Spiels wacht der bzw. die Spielerin an einem winterlichen Morgen auf. Das zweite Kostüm enthält eine Denkblase mit Text. Eine Denkblase stellt Text dar, den eine Person denkt. Man erkennt sie daran, dass sie eine runde, etwas beulige Umrandung hat und ein wenig aussieht wie eine Wolke.

Kostüm 3 – Denkblase: es fängt an mit Schneien

Das dritte Kostüm ist ebenfalls eine Denkblase, die während der Startanimation eingeblendet wird. Diesmal stellt der oder die Spielerin fest, dass es außerhalb des Fensters anfängt mit Schneien.

Kostüm 4 – Denkblase: Spielaufforderung

Das vierte Kostüm wird eingeblendet, sobald die Fensterfläche mit Schneeflocken bedeckt wurde. Die Denkblase enthält dieses Mal eine Aufforderung zum Spielen, indem der Schnee mit den Händen weggeputzt wird.

Kostüm 5 – Denkblase: Spielende

Das fünfte und gleichzeitig letzte Kostüm enthält eine Denkblase, die als Abschluss des Spieles angezeigt wird, wenn alle Schneeflocken erfolgreich weggeputzt wurden.

Klänge für die Animation und als Hintergrundmusik

Die benötigten Klänge habe ich mir aus der Musikbibliothek von pixabay ausgewählt und heruntergeladen. Für die Animation habe ich mir einen Klang ausgesucht, in dem eine gähnende Person, die gerade aufwacht, zu hören ist. Als Hintergrundmusik habe ich ein winterliches Musikstück gewählt. Die heruntergeladenen MP3-Dateien habe ich dann als Klänge Figur hochgeladen.

Schritt 3: Aktivieren der benötigten Erweiterungen

Wenn du dein Hintergrundbild und deine Figuren fertig vorbereitet hast, musst du nun noch die für unser Spiel benötigten Erweiterungen aktivieren. Öffne dafür die Erweiterungsübersicht über die entsprechende Schaltfläche links unten in der Blockauswahl.

Wähle nun aus der Liste der verfügbaren Erweiterungen die Video-Erfassung aus:

Wiederhole den Vorgang und wähle diesmal die Musik-Erweiterung aus:

Beide Erweiterungen müssen nun in deiner Blockauswahl unterhalb des „Meine Blöcke“-Abschnittes sichtbar sein:

Schritt 4: Variablen anlegen

Für die Programmierung der Figuren benötigen wir einige Variablen. Diese legen wir nun zunächst an. Wechsle in der Blockübersicht in den Abschnitt Variablen und lege folgende neue Variablen mit den entsprechenden Einstellungen an:

Variable Schneeflocken

Diese Variable wird vom Programm genutzt, um sich die Anzahl der verbleibenden, noch nicht weggeputzten, Schneeflocken zu merken. Aktivere die Einstellung „Für alle Figuren“, damit die Variable im ganzen Programm genutzt werden kann.

Variable Video-Bewegung

Diese Variable enthält den Schwellenwert für die Video-Bewegung. Je niedriger dieser Wert ist, um so schneller erkennt die Kamera auch kleine Bewegungen deiner Hände. Zu Beginn des Programmes während die Startanimation abgespielt wird, werden wir diesen Wert auf 100 setzen. Mit einem Schwellenwert von 100, erkennt die Kamera-Erweiterung keine Bewegung. Später im Programm verringern wir diesen Schwellenwert, sodass während des eigentlichen Spieles deine Bewegungen erkannt werden. Setze auch hier die Einstellung für die Variable auf „Für alle Figuren“.

Variable sichtbar

Die dritte und letzte Variable ist nur für die Figur der Schneeflocke gültig. Achte deshalb darauf, dass du in der Figurenauswahl die Schneeflocke ausgewählt hast, bevor du die Variable anlegst.

Die Variable wird später im Spiel genutzt, um festzustellen, ob die Schneeflocke bereits weggeputzt wurde oder noch sichtbar ist. Achte darauf, dass du diesmal die Option „Nur für diese Figur“ ausgewählt hast.

Schritt 5: Startanimation programmieren

Als erstes werden wir die Animation zu Beginn unseres Scratch Spieles programmieren. Wechsle dafür zunächst in der Figurenauswahl in die Dialoge-Figur.

Mit dem nachfolgendem Code wird die Startanimation im Programm eingebaut:

Zu Beginn der Animation wird ein schwarzer Bildschirm angezeigt: wechsle zu Kostüm (Nacht). Außerdem wird die Durchsichtigkeit der Figur auf 0 gesetzt: setze Effekt [Durchsichtigkeit] auf (0). Ein Wert von 0 für die Durchsichtigkeit bedeutet, dass die Figur vollständig zu sehen ist. Je größer der Wert wird, umso durchsichtiger wird die Figur. Der Wert 100 ist der Maximalwert. Bei einer Durchsichtigkeit von 100 ist die Figur gar nicht mehr zu sehen. Je durchsichtiger die Figur wird, umso deutlicher wird das Hintergrundbild unter der Figur sichtbar.

Als nächstes wird der Klang abgespielt, bei dem eine gähnende Person zu hören ist. Der Spieler bzw. die Spielerin wacht nun also langsam auf. Es wird also Zeit, die Nacht zu beenden und den Tag einzuläuten. Dafür wird in 100 einzelnen Schritten die Durchsichtigkeit der Figur (also des schwarzen Kostüms) verändert, bis schließlich die Figur gar nicht mehr zu sehen ist. Stattdessen ist nun das Hintergrundbild sichtbar.

Nun können wir die Textdialoge anzeigen. Dazu wechseln wir zum ersten Text-Kostüm: wechsle zu Kostüm (Text-1). Wichtig ist jedoch, dass zuvor die Durchsichtigkeit der Figur wieder auf 0 gesetzt wird. Würden wir das nicht tun, wäre der Textdialog nicht zu sehen. Der Text-1 wird nun 3 Sekunden lang angezeigt. Anschließend wird Text-2 eingeblendet und ebenfalls für 3 Sekunden angezeigt. Damit ist die Startanimation beendet. Unser Textdialog wird deshalb ausgeblendet: verstecke dich. Abschließend wird die Nachricht „Schnee“ an alle Figuren verschickt, um die Figuren darüber zu informieren, dass die Startanimation beendet wurde und nun der Schnee im Programm eingebunden werden kann.

Schritt 6: Musik im Hintergrund abspielen

Sobald die Startanimation beendet wurde, spielen wir eine leise Hintergrundmusik ein. Wir bleiben dafür im Programmcode der Dialoge-Figur und ergänzen nun folgende Codesequenz:

Schritt 7: Schneeflocke vorbereiten

Bevor wir nun im nächsten Schritt das Fenster mit Schneeflocken bedecken werden, programmieren wir zunächst ein paar vorbereitende Schritte für die Schneeflocke, die bei jeden Start des Spieles ausgeführt werden. Wechsle dafür zunächst über die Figurenauswahl in den Programmcode der Schneeflocke.

Ergänze den nachfolgenden Code, der ein paar grundlegende Starteinstellungen für das Spiel konfiguriert.

• schalte Video (aus): Zu Beginn des Programmes wird die Video-Erweiterung deaktiviert. Wir benötigen diese erst später im Programm.
• setze [Video-Bewegung] auf 100: Wir geben unserer Variablen Video-Bewegung den Wert 100. Das bedeutet, das später die Kamera keinerlei Bewegung erkennen wird. Wir machen das, damit beim späteren Einschalten der Kamera, nicht sofort das Spiel beginnt. Erst, wenn wir diese Variable später anpassen, wird die Kamera deine Spielbewegungen erkennen.
• setze [Schneeflocken] auf (100): Bei Beginn des Spieles werden wir 100 Schneeflocken erscheinen lassen, die wir dann nach und nach wegputzen. Diese Zahl hinterlegen wir hier in unserer Variablen.
• setze Instrument auf (19 Marimba): Später beim Wegputzen der Schneeflocken wollen wir lustige Geräusche abspielen. Dafür nutzen wir die Musik-Erweiterung. An dieser Stelle legen wir fest, welches Instrument der Erweiterung wir später hören werden. Du kannst hier auch ein beliebiges anderes Instrument auswählen.
• verstecke dich: Erstmal blenden wir unsere Schneeflocke aus. Später werden wir sie aber wieder anzeigen.
• gehe zu [vorderster] Ebene: Mit diesem Programmblock stellen wir sicher, dass die Schneeflocken in unserem Spiel oberhalb der Dialoge-Figur liegen.

Schritt 8: Fenster zuschneien

Jetzt sind wir soweit, dass wir unser Fenster mit Schneeflocken zuschneien lassen können. Dafür nutzen wir die Klon-Funktion unserer Figur. Wir erzeugen genau 100 Klone – also Kopien – unserer Schneeflocke: erzeuge Klon von (mir selbst). Den Wert 100 hatten wir ja bereits im Schritt 7 in unserer Variablen „Schneeflocke“ festgelegt.

Sobald ein Klon der Schneeflocke erzeugt wird, führen wir die folgenden Schritte mit diesem Klon aus:

• setze [sichtbar] auf (ja): Wir sagen unserem Programm, dass diese Schneeflocke jetzt sichtbar ist. Solange sie sichtbar ist, kann die Schneeflocke auch weggeputzt werden.
• setze Größe auf (Zufallszahl von (20) bis (40)): Wir variieren die Größe unserer Schneeflocke etwas. So entstehen Schneeflocken mit einer zufälligen Größe zwischen 20 und 40.
• zeige dich: Nun blenden wir unsere Schneeflocke auch wirklich ein.
• gehe zu (Zufallsposition): Zum Schluss platzieren wir die Schneeflocke noch auf einer zufälligen Position auf unserem Spielfeld.

Sobald alle Klone erstellt wurden, senden wir nun noch die Nachricht „Spielstart“ und signalisieren dem Programm, dass nun das eigentliche Spiel beginnen kann.

Schritt 9: Aufforderung zum Spielstart

Alle anfänglichen Animationen sowie der Aufbau des Spielfeldes sind nun abgeschlossen. Wir nutzen nun unsere Textdialoge, um dem oder der Spielerin mitzuteilen, dass losgespielt werden kann. Wechsle dafür zunächst wieder in den Programmcode der Dialoge-Figur.

Ergänze nun die folgenden Programmblöcke, die die Spielaufforderung für 3 Sekunden einblenden.

Schritt 10: Schneeflocken wegputzen

Nun ergänzen wir den Programmcode für das eigentliche Spiel – das Wegputzen der Schneeflocken. Wechsle als erstes wieder in den Programmcode der Schneeflocke.

Ergänze nun den nachfolgenden Code für das Spiel, der sich in zwei Sequenzen unterteilt. Die linke Sequenz startet die Video-Erfassung und setzt den Schwellenwert für die Video-Bewegung (Variable) auf den Wert 90 herunter. Dadurch ist die Kamera-Erweiterung nun in der Lage auf die Bewegung deiner Hände vor der Kamera zu reagieren. Außerdem prüft die linke Sequenz, ob es noch Schneeflocken gibt, die weggeputzt werden müssen. Sobald das nicht mehr der Fall ist (<(Schneeflocken) = (0)>), wird die Nachricht „Spielende“ verschickt, die alle anderen Programmteile über das Ende des Spiels informiert.

Die Sequenz rechts im Bild nutzt die Kamera-Erweiterung, um auf die Bewegung der Hände des oder der Spielerin zu reagieren. Sobald die Bewegung der Hände erkannt wird und die Hände die Schneeflocke berühren, wird die Anzahl der verbleibenden Schneeflocken um 1 verringert und es wird mit der Musik-Erweiterung ein zufälliger Ton abgespielt. Danach wird der Klon – also diese Kopie der Schneeflocke – gelöscht. Zusätzlich enthält der Programmcode die Prüfung falls <(sichtbar) = (ja)>, dann. Ohne diese Prüfung würde die komplette Programmsequenz mehrfach ausgeführt werden, bevor der Klon gelöscht werden kann. Dadurch würde die Anzahl der verbleibenden Schneeflocken zu häufig verringert werden und am Ende würde unser Spiel beendet werden, obwohl noch nicht alle Schneeflocken weggeputzt wurden.

Schritt 11: Spielende

Mit dem Ende der Spielphase wird die Kamera-Erweiterung wieder ausgeschalten. Ergänze dafür den folgenden Programmcode für die Schneeflockenfigur:

Wechsle anschließend noch einmal in den Programmcode der Dialoge-Figur.

Zum Abschluss des Scratch Spieles mit der Kamera-Erweiterung blendest du nun noch einmal einen Text ein: wechsle zu Kostüm (Text-4). Außerdem blendest du die Hintergrundmusik langsam aus, indem du in 100 kleinen Schritten die Lautstärke um 1 verringerst: ändere Lautstärke um (-1) und die Musik am Ende ganz ausschaltest: stoppe alle Klänge.

Geschafft!

Du hast es nun geschafft und ein eigenes Scratch Spiel mit der Kamera-Erweiterung programmiert. Nun ist es an der Zeit dein Spiel auszutesten! Wenn du dein Programm noch etwas erweitern und ausgestalten möchtest, dann schau‘ dir doch noch die Herausforderungen dieser Aufgabe am Ende der Kurzanleitung an.