Wer Pro­gram­mie­ren unter ver­ein­fach­ten Be­din­gun­gen lernen möchte, erhält mit Scratch die passende Lösung. Worum es sich bei diesem Pro­gram­mier­pro­jekt, das sich in erster Linie an Kinder richtet, genau handelt und wie das Scratch-Pro­gram­mie­ren funk­tio­niert, erfahren Sie in diesem Scratch-Tutorial.

Was zeichnet das Pro­gram­mie­ren mit Scratch aus?

Scratch basiert auf einer gra­fi­schen Be­nut­zer­ober­flä­che, die eine kom­pli­zier­te Sprach­syn­tax bzw. das generelle Code-Eintippen über­flüs­sig macht. An erster Stelle steht dabei die Absicht, Neu­ein­stei­ge­rin­nen und Neu­ein­stei­gern zu ersten Pro­gram­mier­erfah­run­gen zu verhelfen. Daher hat der Aspekt der leichten Be­dien­bar­keit stets Vorrang vor der Funk­ti­ons­viel­falt. Trotz dieser Ein­schrän­kun­gen verfügt Scratch aber über einige wichtige Ei­gen­schaf­ten tra­di­tio­nel­ler Pro­gram­mier­pa­ra­dig­men, wie die folgende Auf­lis­tung zeigt. Es ist:

  • visuell: Sämtliche Elemente von Scratch werden durch eine ver­ständ­li­che, grafische Dar­stel­lung re­prä­sen­tiert – Pro­gram­mier­be­feh­le bei­spiels­wei­se durch Bau­stein­bil­der. Zudem lassen sie sich bequem per Drag-and-drop ein- und zu­sam­men­set­zen.
  • ob­jekt­ori­en­tiert: Bei der Scratch-Pro­gram­mie­rung stehen weder Klassen noch ein Ver­er­bungs­sys­tem zur Verfügung. Mit Punkten wie der Da­ten­kap­se­lung (kon­trol­lier­ter Zugriff auf Daten über de­fi­nier­te Schnitt­stel­len) oder der Po­ly­mor­phie (Objekte können un­ter­schied­li­che Da­ten­ty­pen annehmen) weist Scratch aber Merkmale des ob­jekt­ori­en­tier­ten Pro­gram­mie­rungs­kon­zepts auf.
  • imperativ: Einige der Skripte, die Ihnen beim Scratch-Pro­gram­mie­ren zur Verfügung gestellt werden, folgen dem im­pe­ra­ti­ven Pro­gram­mier­pa­ra­dig­ma. Be­fehls­fol­gen geben dabei vor, in welcher Rei­hen­fol­ge welche Aktionen aus­ge­führt werden sollen.
  • er­eig­nis­ori­en­tiert: Jedes Skript, das Sie in einem Scratch-Projekt verwenden, startet, sobald das in seinem Kopf-Baustein de­fi­nier­te Ereignis eintritt. Durch den Einsatz eines „Warte bis“-Bausteins lässt sich das Laden eines Projekts zudem bis zum Eintritt eines be­stimm­ten Er­eig­nis­ses hin­aus­zö­gern.
  • par­al­le­li­täts­un­ter­stüt­zend: Die Auf­tei­lung von Com­pu­ter­pro­gram­men in einzelne Teil­kom­po­nen­ten, die das Prinzip der par­al­le­len Pro­gram­mie­rung aus­zeich­net, wird in Scratch von Beginn an un­ter­stützt.

Scratch-Tutorial: So lernen Sie mit Scratch pro­gram­mie­ren

Auch beim Scratch-Pro­gram­mie­ren gilt: Übung macht den Meister bzw. die Meisterin! Das Pro­gram­mier­pro­jekt hat zwar deutlich nied­ri­ge­re Ein­stiegs­hür­den als klas­si­sche Pro­gram­mier­spra­chen, aber es bedarf dennoch einer gewissen Ein­ar­bei­tungs­zeit, um die Be­nut­zer­ober­flä­che und ver­füg­ba­ren Bausteine ken­nen­zu­ler­nen und zu ver­in­ner­li­chen. Im folgenden Tutorial zeigen wir Ihnen, wie das Pro­gram­mie­ren mit Scratch funk­tio­niert.

Hinweis

Wollen Sie Kindern Scratch nä­her­brin­gen, sollten Sie sich zuvor selbst mit der Open-Source-Plattform aus­ein­an­der­set­zen. Je besser Sie die Sprache und ihre Nut­zer­ober­flä­che verstehen, desto besser können Sie diese bei den ersten Schritten un­ter­stüt­zen. Wie Kinder am besten Pro­gram­mie­ren lernen und Spaß daran haben, erfahren Sie in unserem Artikel Pro­gram­mie­ren für Kinder.

Die Be­nut­zer­ober­flä­che im Check

Haben Sie sich ein Be­nut­zer­kon­to erstellt und sich In Ihrem Profil an­ge­mel­det, stehen Ihnen ver­schie­de­ne Optionen zur Verfügung, die sich über die obere Me­nü­leis­te auswählen lassen.

Klicken Sie bei­spiels­wei­se auf den Account-Button (Mi­nia­tur­bild und Kon­ten­na­me), können Sie Ihr per­sön­li­ches Profil verwalten, Ein­stel­lun­gen zum Standort, Kennwort und zur Mail-Adresse vornehmen oder die Übersicht aktiver Projekte („Meine Sachen“) aufrufen. Zudem können Sie sich an dieser Stelle abmelden:

Bild: Scratch lernen: Schnellmenü für Profil, Account und Projekte
Neben dem Account-Button finden Sie zwei weitere Schalt­flä­chen für den Schnell­auf­ruf Ihrer Projekte (Ordner-Icon

Hinter den weiteren ver­füg­ba­ren Me­nü­punk­ten verbergen sich folgende Features:

  • Ent­wi­ckeln: Die zentrale Kom­po­nen­te des Scratch-Web­pro­jekts ist die grafische Ent­wick­lungs­um­ge­bung, die Sie über den Reiter „Ent­wi­ckeln“ starten. Mithilfe dieses Web-Editors pro­gram­mie­ren Sie alle Ihre Scratch-An­wen­dun­gen direkt im Browser.
  • Entdecken: In dieser Rubrik können Sie die Projekte anderer Nutzer aufrufen. Dabei können Sie diese nicht nur abspielen bzw. spielen, sondern auch die komplette Scratch-Pro­gram­mie­rung einsehen. In einem „Studio“ sind Projekte ähnlichen Typs zu­sam­men­ge­fasst.
  • Ideen: Der „Ideen“-Bereich gewährt Ihnen Zugriff auf ver­schie­de­ne Tutorials und Guides, die Ihnen bei der Aus­ar­bei­tung eigener Projekte – ins­be­son­de­re bei der Ideen­fin­dung – unter die Arme greifen können. Zudem finden Sie an dieser Stelle die Wei­ter­lei­tung zum Download der Scratch-App (Windows, macOS, ChromeOS, Android), die das Pro­gram­mie­ren mit Scratch ohne aktive In­ter­net­ver­bin­dung er­mög­licht.
  • Über Scratch: Rufen Sie den Menüpunkt „Über Scratch“ auf, werden Sie auf eine all­ge­mei­ne In­for­ma­ti­ons­sei­te zum Projekt Scratch wei­ter­ge­lei­tet. Unter anderem finden Sie dort Links zu wei­ter­füh­ren­dem Info-Material für Eltern und Lehrer sowie zu Tipps und einem FAQ-Bereich.

Den Scratch-Editor verstehen: So funk­tio­niert die Scratch-Pro­gram­mie­rung

Die Ent­wick­lungs­um­ge­bung von Scratch erinnert in vielerlei Hinsicht an einen Homepage-Baukasten, was an­ge­sichts des Baustein-Cha­rak­ters der ver­füg­ba­ren Skripte nur wenig ver­wun­der­lich ist. Zu­sätz­lich zu diesen Skripten, die den Großteil der ein­setz­ba­ren Kom­po­nen­ten ausmachen, lassen sich einem Projekt außerdem Kostüme und Klänge hin­zu­fü­gen, die Sie dann ebenfalls per Skript steuern bzw. einsetzen können. Mit einem Klick auf „Er­wei­te­rung hin­zu­fü­gen“ lässt sich das Sortiment an Skripten erweitern – bei­spiels­wei­se um einen Malstift, Code zur Video-Erfassung oder um eine Text-zu-Sprache-Funktion.

Tipp

Scratch stellt Ihnen eine Vielzahl von Kostümen, Klängen und Skripten zur Verfügung, die Sie sofort in Ihre Projekte einbinden können. Al­ter­na­tiv können Sie auch eigene Bilder und Sounds im­por­tie­ren oder aufnehmen, falls Sie in dem vor­han­de­nen Material nicht das passende Element finden. Auch eigene Skripte lassen sich ge­ne­rie­ren.

Kostüme: Figuren und Objekte zum Leben erwecken

Was auch immer Sie mit Scratch pro­gram­mie­ren möchten – ein Spiel, ein Video bzw. eine Animation oder viel­leicht auch einen einfachen Comic: Figuren und andere Objekte sind die zentralen Bausteine für Ihre Ge­schich­te(n). Unter dem Reiter „Kostüme“ können Sie eine beliebige Anzahl an Grafiken für Ihr Projekt auswählen und einbinden, wobei Sie entweder aus dem vor­han­de­nen Bild­ma­te­ri­al wählen, Objekte per Hand malen oder lokal ge­spei­cher­te Grafiken im­por­tie­ren können. Zudem haben Sie auch die Mög­lich­keit, ein Foto zu machen, sofern Ihr Gerät über eine Kamera verfügt.

Bild: Scratch: Menü zur Kostümauswahl
Objekte bzw. Figuren in ver­schie­de­nen Posen geben Ihnen später die Mög­lich­keit, Be­we­gungs­ab­läu­fe zu erzeugen.

Haben Sie Kostüme aus­ge­wählt, können Sie diese an­schlie­ßend anpassen. Hierfür wählen Sie das ge­wünsch­te Objekt im linken Sei­ten­me­nü aus (wo Sie es per Klick auf das Pa­pier­korb-Icon auch jederzeit wieder löschen können) und nutzen an­schlie­ßend die ver­füg­ba­ren Editor-Werkzeuge, um bei­spiels­wei­se Farben zu verändern, bestimmte Details per Radierer zu entfernen, Text hin­zu­zu­fü­gen oder das Objekt zu verformen. Auch eine Um­wand­lung der Grafik in eine Raster- bzw. Vek­tor­gra­fik ist möglich. In dem Feld „Kostüm“ de­fi­nie­ren Sie zudem den Namen des Kostüms, den die je­wei­li­gen Skripte später als Be­zugs­grö­ße benötigen.

Bild: Scratch: Kostüme-Editor
Per Füllfarbe haben wir in diesem Scratch-Tutorial-Beispiel das Aussehen der Figur angepasst.

Am rechten unteren Rand des Fensters finden Sie den Button „Hin­ter­grund wählen“. Mit dieser Option legen Sie das Hin­ter­grund­bild für Ihr Projekt fest. Auch hierbei können Sie aus einem von Scratch be­reit­ge­stell­ten Fundus wählen, eigene Bilder im­por­tie­ren oder den Pinsel schwingen und eine eigene Hin­ter­grund­gra­fik malen.

Bild: Scratch-Tutorial: Figur inklusive Hintergrundbild
Ebenso wie Objekte und Figuren können Sie bei der Scratch-Pro­gram­mie­rung via Skript auch den Hin­ter­grund bewegen oder wechseln.

Klänge: Sounds und Hin­ter­grund­mu­sik

Ebenso es­sen­zi­ell wie Figuren und Objekte ist für viele kreative Projekte die passende Sound­ku­lis­se. Beim Pro­gram­mie­ren mit Scratch im­ple­men­tie­ren und managen Sie sämtliche Sounds über das Menü „Klänge“. Wie bei den gra­fi­schen Elementen steht Ihnen zu diesem Zweck ei­ner­seits eine vor­ge­fer­tig­te Auswahl von Scratch-Sounds zur Verfügung, die Sie über „Klang wählen“ aufrufen können. An­de­rer­seits besteht die Option, Sounds zu im­por­tie­ren oder auch auf­zu­neh­men, sofern Sie ein Mikrofon an­ge­schlos­sen haben.

Bild: Menü zum Klang-Aufnehmen mit Scratch
Die Aufnahme eines neuen Scratch-Klangs startet, sobald Sie auf den Aufnehmen-Button drücken.

Ein­ge­füg­te Sounds lassen sich im linken Sei­ten­me­nü per Klick auf das ent­spre­chen­de Mi­nia­tur­bild auswählen und im Anschluss auf viel­fäl­ti­ge Art und Weise be­ar­bei­ten. Unter anderem können Sie zum Beispiel gewählte Sequenzen her­aus­schnei­den, die Laut­stär­ke anpassen oder die Ab­spiel­ge­schwin­dig­keit erhöhen bzw. ver­rin­gern. Da auch Klänge mithilfe von Skripten in das Scratch-Projekt ein­ge­bun­den werden, benötigt jeder Sound außerdem einen ein­zig­ar­ti­gen Namen, den Sie im Feld „Klang“ vergeben:

Bild: Scratch programmieren: Fenster zur Bearbeitung eines Sound-Beispiels
Wollen Sie bestimmte Sequenzen aus­schnei­den bzw. nur aus­ge­wähl­te Stellen be­ar­bei­ten, markieren Sie diese, indem Sie die linke Maustaste ab dem ge­wünsch­ten Start­punkt gedrückt halten und die Aus­wahl­mas­ke bis zum ge­wünsch­ten Endpunkt ziehen.

Skripte: Die Essenz der Scratch-Pro­gram­mie­rung

Um er­folg­reich mit Scratch pro­gram­mie­ren zu können, gilt es ins­be­son­de­re, den Umgang mit den Scratch-Skripten zu üben. Der tat­säch­li­che Code, der hinter diesen Skripten steckt, wird au­to­ma­tisch generiert, sobald Sie einen der ver­füg­ba­ren Blöcke in Ihr Projekt ziehen – egal, ob es sich dabei um ein Ereignis, eine Funktion, einen Operator oder eine Variable handelt. Als Nutzer können Sie sich gänzlich darauf kon­zen­trie­ren, die je­wei­li­gen Skripte mit in­di­vi­du­el­len Werten zu bestücken und den je­wei­li­gen Grafik- und Sound­kom­po­nen­ten zu­zu­ord­nen.

Zu allen vor­ge­fer­tig­ten Skripten exis­tie­ren präzise Be­schrei­bun­gen, aus denen her­vor­geht, welche Funktion sie haben. Wollen Sie ein Skript in Ihrem Projekt einsetzen, ziehen Sie den je­wei­li­gen Block – wie die Skript-Bausteine bei Scratch be­zeich­net werden – einfach in das mittlere Editor-Fenster. Zu de­fi­nie­ren­de Werte oder Optionen sind direkt an dem Block einsehbar und dort auch direkt eintipp- bzw. aus­wähl­bar. Soll sich ein neues Skript direkt auf ein bereits ein­ge­füg­tes Skript beziehen, hängen Sie den ent­spre­chen­den Block einfach wie bei einem Puzzle an.

Bild: Scratch programmieren lernen: Skripte einbinden und testen
Im Vor­schau­fens­ter können Sie die aktuelle Version Ihres Scratch-Projekts jederzeit in­spi­zie­ren und im­ple­men­tier­te Abläufe testweise abspielen.
Tipp

Die Schwie­rig­keit beim Scratch-Lernen liegt nicht darin, syn­tak­ti­sche Regeln oder ein Aus­zeich­nungs­for­mat ver­in­ner­li­chen zu müssen, sondern darin, die Funktion der einzelnen Skripte zu verstehen, um diese optimal einsetzen und mit­ein­an­der kom­bi­nie­ren zu können.

Mit Scratch pro­gram­mie­ren: Ein einfaches Beispiel-Projekt

Nachdem der vor­an­ge­gan­ge­ne Teil dieses Scratch-Tutorials die wich­tigs­ten Kom­po­nen­ten dieser Pro­gram­mier­platt­form vor­ge­stellt hat, sollen die Mög­lich­kei­ten von Scratch ab­schlie­ßend anhand eines konkreten Beispiels de­mons­triert werden.

Im ersten Schritt suchen wir nach einem Hin­ter­grund­bild für unser Projekt, indem wir mit der Maus über das Büh­nen­bild-Icon am rechten unteren Bild­schirm­rand fahren und auf „Hin­ter­grund wählen“ klicken. Wir haben uns für das Motiv „Blue Sky“ ent­schie­den, das wir un­ver­än­dert über­neh­men:

Bild: Scratch-Hintergrundbild „Blue Sky“
Für unser Beispiel wählen wir das Scratch-Büh­nen­bild „Blue Sky“.

Als nächstes fügen wir dem Beispiel-Projekt eine Figur hinzu. Da aktuell der Reiter „Hin­ter­grund­bil­der“ anstelle des „Kostüme“-Reiters zu sehen ist, klicken wir zu diesem Zweck auf den Button „Figur wählen“ (unten rechts). Im Scratch-Sortiment gibt es diverse Figuren mit mehreren Kostümen, mit denen sich später Be­we­gungs­ab­läu­fe si­mu­lie­ren lassen. Die Figur „Cat“ ist bei­spiels­wei­se in den Varianten „cat-a“ und „cat-b“ verfügbar, die nach­ein­an­der ab­ge­spielt den Eindruck erwecken, dass die Katze läuft.

Hinweis

Je mehr Kos­tüm­va­ri­an­ten für eine Figur vorhanden sind, desto besser lässt sich der Be­we­gungs­ab­lauf mit Scratch pro­gram­mie­ren!

Bild: Scratch-Tutorial: Figur „Cat“
Durch ver­schie­de­ne Kostüme bzw. Posen einer Figur erwecken Sie diese per Scratch-Pro­gram­mie­rung zum Leben.

Im letzten Schritt dieses kleinen Beispiels wollen wir zum zentralen Punkt kommen und mit Scratch pro­gram­mie­ren, um die Figur steuerbar machen. Damit die Katze bei­spiels­wei­se von links nach rechts läuft, solange Sie die „Pfeil nach rechts“-Taste gedrückt halten, fügen Sie folgende Skripte ein:

  • Ereignis: Wenn Taste [ ] gedrückt wird
  • Steuerung: warte [ ] Sekunden
  • Aussehen: wechsle zum nächsten Kostüm
  • Bewegung: gehe [ ] er Schritt

Beim Ereignis-Skript vergeben Sie die ge­wünsch­te Taste – im Falle unseres Scratch-Tutorials „Pfeil nach rechts“. Durch das nach­fol­gen­de „Steuerung“-Skript bestimmen Sie den Puffer zwischen dem Kos­tüm­wech­sel. Fügen Sie den Wert „0.2“ ein, vergehen also jeweils 0,2 Sekunden, bevor die Figur ihr Aussehen ändert, was den Be­we­gungs­ab­lauf na­tür­li­cher er­schei­nen lässt. Das „Aussehen“-Skript sorgt dafür, dass zwischen „cat-a“ und „cat-b“ ge­wech­selt wird, solange Sie die Pfeil­tas­te gedrückt halten. Durch das vierte Skript aus der Sparte „Bewegung“ bewegen Sie die Figur beim Kos­tüm­wech­sel zu­sätz­lich nach rechts. Wir haben uns für re­gel­mä­ßi­ge 10er-Schritte ent­schie­den:

Bild: Scratch programmieren: Skript-Übersicht im Beispiel-Projekt
Die in diesem Scratch-Tutorial ver­wen­de­ten Werte sind bei­spiel­haft gewählt worden – schnel­le­re oder lang­sa­me­re Kos­tüm­wech­sel sind ebenso möglich wie kleinere oder größere Schritte der Figur.
Tipp

Das Resultat dieses kleinen Code-Beispiels können Sie direkt auf der Scratch-Pro­jekt­sei­te testen!

Das eigene Projekt ver­öf­fent­li­chen

Sobald Sie Scratcher geworden sind und einen eigenen Be­nut­zer­ac­count erstellt haben, können Sie Ihre Pro­gram­mier­pro­jek­te jederzeit auf der Scratch-Plattform ver­öf­fent­li­chen. Hierfür drücken Sie in der oberen Me­nü­leis­te auf den Button „Ver­öf­fent­li­chen“.

Im daraufhin ge­öff­ne­ten Fenster haben Sie nun noch die Mög­lich­keit, den Projekt-Titel zu ändern, eine Anleitung zu for­mu­lie­ren und An­mer­kun­gen bzw. Dank­sa­gun­gen an­zu­hän­gen. Schieben Sie den Regler bei „Com­men­ting on“ nach links, schalten Sie außerdem optional die Kom­men­tar­funk­ti­on für Ihr Projekt aus.

Bild: Scratch: Veröffentlichung des Beispiel-Projekts
Klicken Sie im Menü Ihres Projekts auf „Link kopieren“, um den Link zu Ihrem Projekt un­kom­pli­ziert mit Freun­din­nen, Freunden und Bekannten zu teilen.
Zum Hauptmenü