Leer pro­gram­me­ren met Scratch – Een korte tutorial

Als je op zoek bent naar een een­vou­di­ge manier om te leren pro­gram­me­ren, hoef je niet verder te zoeken. Hoewel Scratch in de eerste plaats bedoeld is voor kinderen, kan iedereen het gebruiken om te leren pro­gram­me­ren. In deze tutorial leggen we uit wat Scratch is en hoe pro­gram­me­ren met Scratch werkt.

Wat is er zo uniek aan pro­gram­me­ren met Scratch?

Scratch is gebaseerd op een grafische ge­brui­kers­in­ter­fa­ce, waardoor het mogelijk is om te pro­gram­me­ren zonder in­ge­wik­kel­de taal­syn­taxis of het typen van regels code. Scratch is in de eerste plaats ontworpen om nieuw­ko­mers kennis te laten maken met pro­gram­me­ren. Daarom krijgt ge­bruiks­vrien­de­lijk­heid voorrang boven een breed scala aan functies. Ondanks deze be­per­kin­gen behoudt Scratch echter enkele be­lang­rij­ke ei­gen­schap­pen van tra­di­ti­o­ne­le pro­gram­meer­pa­ra­dig­ma’s. Scratch is:

• visueel: alle Scratch-elementen worden weer­ge­ge­ven door middel van een be­grij­pe­lij­ke, grafische weergave. Pro­gram­ma­com­man­do’s worden bij­voor­beeld weer­ge­ge­ven met blokken. Bovendien kunnen ze ge­mak­ke­lijk worden ingevoegd en sa­men­ge­voegd via slepen en neer­zet­ten.
• ob­ject­ge­o­ri­ën­teerd: Scratch-pro­gram­me­ren kent geen klassen of een over­er­vings­sys­teem. Wat betreft data-in­kap­se­ling (ge­con­tro­leer­de toegang tot data via ge­de­fi­ni­eer­de in­ter­fa­ces) en po­ly­mor­fis­me (objecten kunnen ver­schil­len­de datatypes aannemen) vertoont Scratch echter kenmerken van het ob­ject­ge­o­ri­ën­teer­de pro­gram­meer­pa­ra­dig­ma.
• im­pe­ra­tief: sommige scripts in Scratch volgen het im­pe­ra­tie­ve pro­gram­meer­pa­ra­dig­ma. In­struc­tie­reek­sen spe­ci­fi­ce­ren bij­voor­beeld de volgorde waarin acties moeten worden uit­ge­voerd.
• Ge­beur­te­nis­ge­richt: elk script dat je in een Scratch-project gebruikt, start zodra de ge­beur­te­nis die in het he­a­der­blok is ge­de­fi­ni­eerd, plaats­vindt. Met het blok ‘Wachten tot’ kun je het laden van een project uit­stel­len totdat een spe­ci­fie­ke ge­beur­te­nis plaats­vindt.
• Geschikt voor pa­ral­lel­lis­me: vanaf het begin biedt Scratch on­der­steu­ning voor het op­split­sen van com­pu­ter­pro­gram­ma’s in af­zon­der­lij­ke sub­com­po­nen­ten, wat een be­lang­rijk kenmerk is van parallel pro­gram­me­ren.

Scratch-pro­gram­meer­cur­sus

Het gezegde ‘oefening baart kunst’ geldt ook voor Scratch-codering. Hoewel de in­stap­drem­pel van deze taal duidelijk lager is dan die van klassieke pro­gram­meer­ta­len, kost het toch enige tijd om vertrouwd te raken met de Scratch-omgeving en het vaardig gebruik van de Scratch-co­de­blok­ken. In de volgende tutorial laten we je zien hoe je met Scratch kunt coderen.

Hoe navigeer je door de ge­brui­kers­in­ter­fa­ce?

Als u een ge­brui­kers­ac­count hebt aan­ge­maakt en bent ingelogd op uw profiel, kunt u kiezen uit een aantal ver­schil­len­de opties in de menubalk rechts­bo­ven in uw scherm.

Wanneer u op de knop Account klikt, kunt u uw per­soon­lij­ke profiel beheren, uw locatie-in­stel­lin­gen, wacht­woord en e-mailadres wijzigen of het overzicht van actieve projecten (Mijn spullen) openen. U kunt hier ook uitloggen:

Andere menu-items bieden de volgende functies:

• Ont­wik­ke­ling: het centrale onderdeel van Scratch is de visuele ont­wik­kelom­ge­ving, die je kunt starten via het tabblad Ont­wik­ke­ling. Met behulp van deze web-editor kun je al je Scratch-toe­pas­sin­gen recht­streeks in de browser pro­gram­me­ren.
• Verkennen: in deze categorie heb je toegang tot projecten van andere ge­brui­kers. Je kunt deze niet alleen bekijken of, in sommige gevallen, spelen, maar ook zien hoe ze zijn ge­pro­gram­meerd. Ver­ge­lijk­ba­re projecten worden ge­groe­peerd in een Studio.
• Ideeën: in het gedeelte Ideeën krijg je toegang tot ver­schil­len­de tutorials en hand­lei­din­gen die je helpen bij het ont­wik­ke­len van je eigen projecten, met name als het gaat om brain­stor­men. Hier vind je ook een door­ver­wijs­link voor het down­lo­a­den van de Scratch-app (Windows, macOS, ChromeOS, Android), waarmee je zonder actieve in­ter­net­ver­bin­ding kunt pro­gram­me­ren.
• Over Scratch: als je op Over Scratch klikt, word je door­ge­stuurd naar een pagina met algemene in­for­ma­tie over het platform. Je vindt er onder andere links naar aan­vul­lend materiaal voor ouders en leer­krach­ten, tips en een FAQ-sectie.

Hoe coderen met Scratch werkt

De ont­wik­kelom­ge­ving van Scratch doet denken aan een web­si­te­bou­wer, wat gezien het bouw­steen­ach­ti­ge karakter van de scripts niet zo ver­won­der­lijk is. Naast deze scripts, die het grootste deel van de bruikbare com­po­nen­ten uitmaken, kun je ook kostuums en geluiden aan een project toevoegen. Je kunt deze ver­vol­gens beheren of im­ple­men­te­ren via een script. Door op ‘Extensie toevoegen’ te klikken, kan de selectie van scripts worden uit­ge­breid, bij­voor­beeld met een kleur­pot­lood, code voor video-opname of een tekst-naar-spraak­func­tie.

Breng figuren en objecten tot leven met kostuums

Of je nu een game, video, animatie of gewoon een simpele strip wilt pro­gram­me­ren, sprites (figuren en andere objecten) vormen de centrale bouw­ste­nen voor je verhaal. Onder het tabblad Kostuums kun je een wil­le­keu­rig aantal af­beel­din­gen se­lec­te­ren en in je project in­te­gre­ren. Je kunt kiezen uit de be­schik­ba­re af­beel­dings­op­ties, objecten met de hand tekenen of lokaal op­ge­sla­gen af­beel­din­gen im­por­te­ren. Als je apparaat een camera heeft, kun je ook een foto maken.

Nadat u een kostuum hebt ge­se­lec­teerd, kunt u het aanpassen. Selecteer hiervoor het object dat u wilt aanpassen in het menu aan de lin­ker­kant van het scherm (waar u het op elk moment kunt ver­wij­de­ren door op het prul­len­bak­pic­to­gram te klikken). Gebruik ver­vol­gens de be­schik­ba­re be­wer­kingstools om bij­voor­beeld kleuren te wijzigen, spe­ci­fie­ke details te ver­wij­de­ren met een gum, tekst toe te voegen of het object te vervormen. Het is ook mogelijk om de af­beel­ding om te zetten in een raster- of vec­to­r­af­beel­ding. In het veld Kostuum kunt u ook een naam voor het kostuum kiezen, die scripts later als re­fe­ren­tie­waar­de kunnen gebruiken.

Rechts­on­der in het venster vind je de knop ’Kies een ach­ter­grond ’. Met deze optie kun je de ach­ter­grond­af­beel­ding voor je projecten kiezen. Scratch biedt een selectie van stock­af­beel­din­gen, maar je kunt ook je eigen af­beel­din­gen im­por­te­ren of zelfs je eigen ach­ter­grond schil­de­ren.

Geluiden en ach­ter­grond­mu­ziek

Voor veel creatieve projecten is de juiste sound­track net zo be­lang­rijk als de ver­schil­len­de per­so­na­ges. Bij het pro­gram­me­ren met Scratch im­ple­men­teer en beheer je alle geluiden via het menu Geluiden. Net als bij de grafische elementen heb je via Geluid kiezen de keuze uit een reeks vooraf gemaakte Scratch-geluiden. Je hebt ook de mo­ge­lijk­heid om geluiden te im­por­te­ren of op te nemen, mits je over een microfoon beschikt.

Geluiden die je hebt ingevoegd, kun je se­lec­te­ren in het menu aan de lin­ker­kant door op de bij­be­ho­ren­de miniatuur te klikken. Je kunt de geluiden ver­vol­gens op ver­schil­len­de manieren bewerken. Je kunt bij­voor­beeld ge­se­lec­teer­de se­quen­ties knippen, het volume aanpassen of de af­speel­snel­heid verhogen of verlagen. Omdat geluiden met behulp van scripts in het Scratch-project worden ge­ïn­te­greerd, heeft elk geluid ook een unieke naam nodig, die je kunt toewijzen in het veld Geluid.

Scripts vormen de essentie van Scratch-codering.

Om succesvol te kunnen pro­gram­me­ren met Scratch, is het nood­za­ke­lijk om te oefenen met het gebruik van de Scratch-scripts. De daad­wer­ke­lij­ke code achter deze scripts wordt au­to­ma­tisch ge­ge­ne­reerd wanneer je een blok naar je project sleept, ongeacht of het een ge­beur­te­nis, functie, operator of variabele betreft. Als gebruiker kun je je con­cen­tre­ren op het vullen van de scripts met in­di­vi­du­e­le waarden en deze toewijzen aan af­beel­din­gen en geluiden.

Alle vooraf gemaakte scripts hebben be­schrij­vin­gen die precies aangeven welke functies ze hebben. Als u een script in uw project wilt im­ple­men­te­ren, sleept u het blok gewoon naar het middelste edi­tor­ven­ster. Op het blok vindt u alle waarden of opties die moeten worden ge­de­fi­ni­eerd, die u ver­vol­gens kunt se­lec­te­ren of recht­streeks in het vak kunt typen. Als u een nieuw script hebt dat verwijst naar een script dat al in uw programma staat, voegt u gewoon het bij­be­ho­ren­de blok toe alsof u een puzzel in elkaar zet.

Hoe maak je een korte ani­ma­tie­se­quen­tie in Scratch?

Nu we de be­lang­rijk­ste on­der­de­len van het pro­gram­meer­plat­form hebben behandeld, gaan we eens kijken wat Scratch kan doen aan de hand van een voor­beeld­pro­ject.

In de eerste stap gaan we op zoek naar een ach­ter­grond door de muis over het ach­ter­grond­pic­to­gram aan de onderkant van het scherm te bewegen en op Kies een ach­ter­grond te klikken. We hebben het thema Blauwe lucht gekozen, dat we hebben ge­se­lec­teerd zonder er iets aan te ver­an­de­ren:

Ver­vol­gens gaan we een figuur in het pro­ject­voor­beeld invoegen. Omdat het tabblad Backdrops zich momenteel bevindt waar normaal gesproken het tabblad Costumes staat, klikken we op de knop Choose a Sprite rechts­on­der in het scherm. In de Scratch-selectie staan ver­schil­len­de figuren met meerdere kostuums die kunnen worden gebruikt om be­we­gings­se­quen­ties te simuleren. De sprite Cat is bij­voor­beeld be­schik­baar in twee versies: ‘Cat’ en ‘Cat2’. Wanneer de af­beel­din­gen achter elkaar worden af­ge­speeld, lijkt het alsof de kat loopt.

In de laatste stap van dit korte voorbeeld laten we je zien hoe je de figuur en de code kunt besturen met Scratch. Om bij­voor­beeld de kat van links naar rechts te laten lopen door de pijl-rechts ingedrukt te houden, voeg je de volgende scripts in:

• Ge­beur­te­nis­sen: wanneer [ ] toets wordt ingedrukt
• Besturing: wacht [ ] seconden
• Uiterlijk: volgende kostuum
• Beweging: [ ] stappen zetten

Wijs met het ge­beur­te­nis­script de gewenste toets toe – in het geval van onze Scratch-tutorial ‘pijl naar rechts’. Ver­vol­gens komt het con­tro­le­script, waarin je een buffer instelt voor de kos­tuum­wis­se­ling. Als je ‘2’ invoert, duurt het twee seconden voordat de sprite van uiterlijk verandert, waardoor de be­we­gings­se­quen­tie na­tuur­lij­ker lijkt. Het uiterlijk-script zorgt ervoor dat de af­beel­ding wisselt tussen ‘kat’ en ‘kat2’ zolang de pijl­tjes­toets ingedrukt wordt gehouden. Met behulp van het vierde script uit de sectie Beweging beweegt de figuur ook naar rechts wanneer het kostuum wordt gewisseld. Voor dit voorbeeld hebben we 10 stappen gebruikt:

Hoe publiceer je je Scratch-co­deer­pro­ject?

Nadat je je eigen ge­brui­kers­ac­count hebt aan­ge­maakt en officieel een Scratcher bent geworden, kun je je pro­gram­meer­pro­jec­ten pu­bli­ce­ren op het Scratch-platform. Klik hiervoor op de knop Pu­bli­ce­ren in de menubalk bovenaan het scherm.

In het venster dat wordt geopend, kunt u nu de pro­ject­ti­tel wijzigen en in­struc­ties, op­mer­kin­gen of dank­be­tui­gin­gen toevoegen. Als u de scha­ke­laar naast Com­men­taar geven naar links zet, kunt u ook de op­mer­kin­gen­func­tie voor uw project uit­scha­ke­len.