← Alle oefeningen
scratch

Image

Scratch opdracht #101 Niveau: beginner

Image

Nodig:

Image

Computer met internet

Coderdojo Sint-Niklaas

STARTEN MET SCRATCH

Je avontuur begint hier!

Image

Versie 17/10/2025 1 Auteur: Jimmy DD .

WELKOM!

Welkom bij CoderDojo. Als je geen of weinig ervaring hebt met programmeren, is dit het juiste startpunt!

Scratch is een grafische programmeertaal die gemakkelijk te leren is. We leggen je stap voor stap uit hoe je er aan begint.

Je hoeft niks te installeren en nergens in te loggen om met Scratch te beginnen. Ga in Chrome naar scratch.mit.edu om te beginnen.

Klik nu op Aan de slag . In het midden van het scherm verschijnt nu een video onder een groene balk, deze mag je sluiten. (klik op X)

Het scherm ziet er nu zo uit (we verwijzen later regelmatig naar de nummers ):

Image

  • 1 : categorieën
  • 4 : speelveld

7 , 8 , 9

  • : tabbladen
  • 2 : beschikbare blokken
  • 5 : sprites
  • 10 : start/stop programma
  • 3 : code vak
  • 6 : achtergronden
  • 11 : menu

Image

SPRITES

Het belangrijkste onderdeel van een Scratch programma is een Sprite . Dit is geen limonade, maar een Engelse benaming voor een bewegend voorwerp of figuurtje. In een voetbalspel is de bal een sprite (die beweegt), en het veld een achtergrond (deze beweegt niet)

In een nieuw Scratch programma staat er reeds 1 sprite: de oranje kat , het logo van Scratch. Alle sprites vind je in vak 5

BLOKKEN

Sprites zijn enkel afbeeldingen die nog niks doen. Als we de Scratch-kat iets willen laten doen, dan moeten we dat programmeren met code.

Programmeren doen we met blokken . Links op het scherm (in vak 2 ) zie je alle blokken die je kan gebruiken.

EERSTE PROGRAMMA

We willen de kat laten miauwen! Klik eerst op de kat rechtsonder het scherm (in vak 5 ) om aan te geven dat ons programma iets met de kat gaat doen.

In het midden van het scherm (in vak 3 ) maken we onze programmacode met blokken. We kunnen verschillende blokken van boven naar onder samenvoegen. Het eerste blok moet altijd een Gebeurtenis blok zijn.

Image

Klik helemaal links op het scherm op . Zet vervolgens het muispijltje op

Image

het blok . Houd nu de linker muisknop ingedrukt en beweeg de muis naar het witte vak ( 3 ) in het midden van het scherm. Laat nu pas de muisknop los. Het blok is nu toegevoegd aan je programma.

Deze manier om een blok te verplaatsen, noemen we voortaan Slepen (muisknop indrukken, muis verplaatsen, muisknop loslaten)

Image

Image

Image

Image

Vervolgens willen we de kat Miauw laten zeggen. Klik links op het scherm op en sleep nu het blok naar een vrije plaats op het middelste vlak, waar ons eerdere blok reeds staat.

We moeten nu de blokken samenvoegen: sleep (verplaats) het blok dat je zonet hebt neergezet tot net onder het eerste blok dat je had neergezet. Als je de muisknop loslaat, zal je zien dat beide blokken aan elkaar vastklikken.

Image

Een Scratch programma starten we door op de groene vlag staat rechtsboven het scherm. Klik er op en kijk wat er gebeurd in vak 4

Image

Verschijnt er geen tekstballon bij de kat? Kijk dan of je geen fouten gemaakt en of de blokken wel goed staan.

De kat zegt nu Hallo! maar we willen natuurlijk dat de kat Miauw! zegt. Klik zeg Hallo! blok op de tekst Hallo! en verander de tekst in Miauw!

Druk nu opnieuw op de groene vlag.

GELUID

We gaan nu een geluidje toevoegen. Hiervoor moeten we een derde blok toevoegen. Klik links op het scherm op . Probeer zelf om het juiste blok te vinden en toe te voegen om de kat Miauw te horen zeggen. Klik op de groene vlag om te testen. Lukt er iets niet? Steek gerust je hand

Image

omhoog en een coach zal je verder helpen!

BEWEGING

Een spelletje kan moeilijk zonder beweging. We gaan de kat naar een willekeurige positie laten bewegen. Klik op en sleep dan het blok

Image

te klikken. Deze hebt in het het niet aan de andere 2 blokken!

Image

Image

Omdat dit blok nu los staat , zal het nog niks doen. Maar we kunnen wel al testen wat het blok zou doen: klik nu kort op het schuif in 1 sec… blok, en je zal zien dat de kat beweegt. (klik op het blok zelf, en niet op de witte of donkere zone)

Klik ook eens op het zeg Miauw! blok, en je zal zien dat ook dit blok wordt uitgevoerd.

VANG DE KAT!

We gaan een eerste spelletje maken. De kat beweegt en we moeten ze proberen te vangen. We moeten dus het schuif in 1 sec.. blok constant herhalen zodat

Image

de kat blijft bewegen . Klik op , en sleep het blok tot onder het start geluid blok, zodat het eraan kleeft. Sleep nu het schuif in 1 sec… blok dat er reeds stond binnen in het herhaal blok. Je programma ziet er nu zo uit:

Image

Klik nu op de groene vlag . Samengevat doet het programma het volgende:

  • Toon een tekstballon Miauw! voor 2 seconden
  • Speel het geluid Miauw af
  • Herhaal het beweeg blok zodat de kat constant beweegt

Blokken worden altijd van boven naar onder uitgevoerd als een reeks opdrachten die je aan de computer geeft!

Image

Klik nu op om het programma te stoppen. Door het herhaal blok blijft het programma anders eindeloos doorgaan.

Image

op een vrije plaats in het code vak ( 3 ). Plak

Image

BLOKKEN VERVANGEN

Je zal merken dat het een tijdje duurt voordat de kat begint met bewegen. Dat komt omdat het blok 2 seconden wacht voordat het verder gaat. We gaan dit blok vervangen:

  1. Sleep het start geluid blok een beetje naar onder zodat het los komt van het Zeg Miauw! blok.
  2. Sleep nu het Zeg Miauw! blok helemaal naar de linkerrand van het scherm (in vak 1 of 2 ). Dit verwijdert het blok.
  3. Klik nu op

het en sleep het blok.

Image

  1. Plak het start geluid Miauw blok opnieuw onder het zeg hallo blok.

Tijdens het programmeren zal je regelmatig op deze manier blokken moeten verwijderen of vervangen!

TURBO KAT

Klik op de groene vlag . De kat zal meteen beginnen bewegen, maar de beweging is veel te traag voor een kat die niet gevangen wil worden! Verander daarom 1 seconde naar 0.5 seconde . Dat is 2x sneller! Kommagetallen in Scratch gebruiken een . (punt) in plaats van een , (komma)

VANG DE KAT, DEEL 2

Image

Ons spelletje is nog maar half klaar. We moeten nog code maken om de kat te vangen met een muisklik. Een gevangen kat zit in een kooi, deze gaan we zelf tekenen. Klik op We zien 2 tekeningen van een kat: uiterlijk1 en uiterlijk2. Klik op uiterlijk 2 en klik dan op het penseel . Teken nu tralies over de kat door de muisknop

ingedrukt te houden. Als je mis bent, kan je teruggaan met .

Image

blok (

zonder

2 sec) tot onder Ben je tevreden met het resultaat, klik dan op verander de naam naar gevangen zodat je dit ziet:

Image

Image

Image

Ga terug naar de code door op te klikken.

Image

Gebruik nu deze blokken zodat de tralies verschijnen en de kat stopt met bewegen zodra we er op geklikt hebben. Zet ze in de goede volgorde .

Image

Tip: aan de kleur van een blok zie je in welke categorie je het kan terugvinden,

bijvoorbeeld een paars blok zit in

Image

Klik op de groene vlag om te testen . Stopt de kat als je erop klikt?

Druk nogmaals op de groene vlag. Zie je wat er mis loopt ?

De tralies moeten natuurlijk terug verdwijnen als het spel opnieuw gestart wordt. Kan je zelf bedenken hoe je dit kan oplossen? (tip: er moet ergens een verander uiterlijk blok bijgeplaatst worden)

Als een spel klaar is, is het leuker om dit op het volledige scherm te spelen. Klik op (rechts boven) en dan op de groene vlag. Als je klaar bent met spelen, klik dan op om terug te gaan naar de ontwikkel-modus.

Proficiat! Je hebt een eerste spel gemaakt.

en

PONG

Image

Image

We gaan nog een spelletje maken genaamd Pong . Dit is één van de eerste computer games ooit gemaakt! In pong heb je een bal en een plank die moeten kunnen bewegen. Dat zijn dus 2 sprites . We gaan de bestaande kat sprite vervangen door een bal . Klik linksboven op . Klik dan linksonder op en kies een bal (bijvoorbeeld ball-a ) Nu de bal is toegevoegd aan de sprite, kunnen we de katten verwijderen. Klik op uiterlijk1 en dan op . Doe hetzelfde voor het uiterlijk gevangen zodat enkel de bal overblijft. . Als je op de groene vlag zou klikken, is het spel nu

Image

Ga nu terug naar de Code "Vang de bal" in plaats van 'vang de kat' geworden.

BEWEEG DE BAL

Voor pong moet de bal in rechte lijn bewegen en niet willekeurig zoals de onvoorspelbare kat. We moeten dus het programma aanpassen.

Verwijder eerst alle blokken behalve

schuif in..

blok binnen in het

herhaal

Image

blok mag

wel en

. Het

Image

verwijderd worden.

(weet je nog: blokken verwijderen doe je door ze naar de linker rand te slepen)

Om de bal te laten bewegen, zet je de blokken binnen het herhaal blok.

Image

  • het blok neem 10 stappen zal de bal een kleine afstand voortbewegen in de ingestelde richting
  • het blok keer om aan rand zal de richting van de bal veranderen als deze de rand raakt.

Image

Image

Image

Deze 2 acties moeten voortdurend herhaald worden, anders zal de bal niet blijven bewegen . Daarom staat dit in het herhaal blok.

Een herhaal blok zal steeds opnieuw alle blokken van boven naar onder uitvoeren, tot het programma gestopt wordt.

Zorg dat het herhaal blok vast kleeft aan het startblok, anders wordt dit niet uitgevoerd. Druk nu op de groene vlag .

Als alles goed is, zal de bal nu bewegen en terugkaatsen aan de rand. Vind je de snelheid van de bal niet goed? Verander dan het getal 10 in het neem 10 stappen blok in een grotere of kleinere waarde.

WILLEKEURIGE START

Het spel is een beetje saai omdat de bal altijd in dezelfde richting beweegt.

Image

Daarom gaan we vlak boven het herhaal blok een blok invoegen. Verander nu de 90 in een ander getal tussen 0 en 360 dat je zelf kiest. Druk op de groene vlag en terug op stop . Probeer dit een paar keer met andere getallen. Zie je wat er gebeurt?

We willen eigenlijk het liefst starten in een willekeurige richting . Daarom laten we de computer zelf een getal kiezen tussen 0 en 360.

Image

Klik op en sleep in het witte vlakje van het richt naar… blok. Verander nu de getallen 1 en 10 in ……..

Image

(kan je zelf bedenken welke getallen dit moeten zijn, om de computer te laten doen wat je net zelf hebt moeten doen?)

Image

Image

Druk nu terug enkele keren op en . Als alles goed is, start de bal steeds in een andere richting. Is dat niet het geval? Zoek dan eerst de fout voordat je verder gaat.

DE PLANK

Het begint al een beetje op pong te lijken. Maar we hebben ook nog een plank nodig! Daarom moeten we een tweede sprite maken:

  • ●
  • Ga met de muis op staan (in vak

Image

Image

5 ), en klik dan op

  • Klik op de rechthoek . Teken nu een rechthoek door in het teken veld met de muis van A naar B te slepen zoals hier:

Image

(Teken).

Image

Image

  • Klik nu op het pijltje . Klik vervolgens midden in je net getekende rechthoek . Je zal zien dat er blauwe bolletjes rond de rechthoek verschijnen.
  • Wil je de vorm nog aanpassen: sleep dan één van de blauwe bolletjes om de plank groter of kleiner te maken De plank moet iets dunner zijn dan de bal (kijk rechts op het scherm naar het speelveld).
  • Sleep nu de rechthoek (door in het midden te klikken) naar het midden van het vak, zodat deze vastkleeft aan de middenmarkering

Kies een kleur voor de plank door

Image

te verschuiven.

Kies ook een kleur voor de rand van de plank door op te klikken. Wil je geen rand? Zet de randdikte (het getal naast omtrek) dan op 0.

Ga nu terug naar de blokken door op het Code tabblad te klikken.

Oeps!!! onze blokken zijn verdwenen ! Maar geen paniek, ze zijn er nog steeds.

Elke sprite heeft z'n eigen code , en voor de plank is er nog geen code gemaakt. Klik even rechtsonder (in vak 5 ) terug op de bal (Sprite1) en daar verschijnt jouw code terug.

Image

te klikken, en de kleurenbalk Geef Sprite 1 nu de naam Bal door in het witte tekstvak te klikken waar nu Sprite1 staat, en verander de tekst naar Bal . Klik nu terug op de plank (Sprite2). Het codeveld wordt nu terug leeg. Verander ook de naam van Sprite2 naar Plank . De sprites zien er nu zo uit:

Image

Image

X EN Y POSITIE

Sleep nu In het speelveld (in vak 4 ), de plank tot bijna tegen de rechterrand van het scherm. Dit wordt de beginpositie van de plank.

Image

Een positie wordt bepaald door 2 getallen : x en y .

Image

x is de horizontale positie en y is de verticale positie. 0 is het midden van het scherm.

Image

Image

Zorg dat de sprite Plank nog steeds is geselecteerd. Kijk welk getal er naast x staat en onthou dit. Vul nu 0 in, en je zal zien dat de plank terug naar het midden is verplaatst. Vul nu -100 in (vergeet het minteken -niet!). De plank is nu nog verder naar links verplaatst. Vul nu terug het oorspronkelijke getal in dat je onthouden hebt, en de plank zal terugkeren naar de rechterkant.

POSITIE VERANDEREN IN CODE

We hebben nu zelf de x waarde 'met de hand' veranderd. Maar als we dat willen besturen, moeten we dat in code veranderen.

Voor Pong hoeft de plank enkel op en neer te bewegen. We moeten dus in de code enkel de y positie aanpassen. We willen de plank besturen met de muis , dus we moeten voortdurend (Een herhaal blok!) de y positie van de plank gelijk maken aan de Y positie van de muis .

Maak nu de code voor de Plank sprite met deze blokken:

Image

Klik nu op de groene vlag om te testen. De plank moet nu te besturen zijn met de muis . Is dan niet zo? kijk dan eerst na wat er mis is gegaan!

BAL LATEN BOTSEN TEGEN DE PLANK

Het spel lijkt nu al erg op pong. Maar de bal botst nog niet op de plank maar rolt er gewoon door, en je kan nog niet verliezen.

De bal moet omkeren bij raken van de plank . We moeten dus code toevoegen voor de bal sprite. Daarvoor klik je eerst op de Bal sprite (in vak 5 ). De code voor de bal, die je eerder hebt gemaakt, komt nu terug tevoorschijn. Probeer nu dit blok samen te stellen:

Image

Image

En plaats dit blok als laatste blok binnen het reeds bestaande herhaal blok.

Dit moet binnen het herhaal blok staan omdat we voortdurend moeten testen of de bal de plank raakt.

We zijn er nog niet…. we hebben enkel nog maar getest of de bal de plank raakt, maar we moeten de richting van de bal nog veranderen als de test waar is. In dat geval wordt de code binnen het als…dan blok uitgevoerd.

Stel nu onderstaand blok samen om de richting van de bal te keren.

Image

Weet je waar dit blok terecht moet komen? Zet het op de juiste plaats !

Het is nog niet belangrijk hoe we aan '360 - richting' komen. Dit is een wiskundige formule om de nieuwe richting te bepalen.

Klik nu op de groene vlag om te testen. De bal moet nu terug botsen op de plank, of tot de schermrand als de plank niet bij de bal is.

GAME OVER

Als laatste stap hebben we nog een game over nodig als we de bal missen. Dit kunnen we ook met een als...dan blok doen.

Hoe kunnen we weten dat de bal de plank gemist heeft? Dat kunnen we doen door de x positie te testen. Als deze voorbij de plank ligt, is het game over.

Bouw nu dit blok:

Image

Image

Zet dit blok ook binnen het bestaande herhaal blok, zodat er voortdurend getest wordt op game over.

Maar…. hoe kunnen we weten bij welke x positie de bal voorbij de plank is? 50 is alvast niet het goede antwoord!

Daar is gelukkig een trucje voor! Sleep de bal in het speelveld (in vak 4 ) naar rechts tot de bal gelijk staat met de plank:

Image

Dit is de positie die we als 'plank gemist' gaan gebruiken. Kijk nu onderaan welk getal er naast x staat.

Vul nu dit getal in, in het juiste blok in de code.

Test met de groene vlag .

Bij het missen van de plank moet het spel nu stoppen . Is dat niet het geval, kijk dan eerst wat er mis is of vraag eventueel hulp aan je buur of een coach!

Image

ACHTERGROND

Tot nu toe hebben we enkel met sprites gewerkt. Maar voor figuren die niet moeten bewegen, zoals het game-over scherm, zijn achtergronden ideaal.

De standaard achtergrond is gewoon wit. Dat gaan we nu veranderen. Klik op de witte kader rechtsonder het scherm, in vak 6

Je ziet opnieuw de code verdwijnen , omdat de achtergrond code kan bevatten. Alle code die niet bij een sprite hoort kan je hier zetten. Bijvoorbeeld het starten van muziek.

We maken 2 achtergronden: 1 voor het spel en 1 voor het Game Over scherm:

  • Klik nu links boven op (vak 8 ).
  • Klik linksonder op en kies de achtergrond Neon Tunnel
  • Verander de naam van deze achtergrond naar Speelveld . Dit doe je door op de huidige naam te klikken.
  • Klik nu links boven op de witte achtergrond ( achtergrond 1 ). Geef deze de naam Game Over .
  • Klik nu op en klik dan in het tekenveld. Typ nu Game Over en klik ergens naast de tekst.
  • Verplaats en vergroot nu de tekst Game Over door de blauwe bollen te slepen, zodat de tekst over het hele scherm staat:
  • Verander ook de kleur (op dezelfde manier zoals bij de plank)

Image

Image

Image

Maak er een grote rode tekst van die te midden van het scherm staat.

KLAAR!

Bewaar nu je werk met en zodat je er later aan kan verder werken.

Image

ACHTERGROND WIJZIGEN IN CODE

Image

Klik terug op om naar de achtergrond code te gaan. Deze is nog leeg. Het spel moet starten in de normale achtergrond, doe dat met deze blokken :

Image

Klik nu terug op de sprite Bal , zodat je de code van de bal terug ziet Zet dit blok op de juiste plaats, zodat het uitgevoerd wordt bij Game Over (je

moet dit ergens tussen plaatsen)

Image

Test met de groene vlag. Je zal misschien merken dat er nog een klein probleempje is…. Na een game over, blijft de bal aan de rechter kant, in de game-over zone. Zo kan het spel niet opnieuw starten.

Los dit op door de bal terug in het midden te plaatsen bij de start van het spel. Je hebt hiervoor dit blok nodig. Kan je het op de goede plaats zetten?

Image

Image

Image

Proficiat! Je hebt Pong geprogrammeerd en de basis van Scratch geleerd. Er zijn nog meer mogelijkheden zoals Beeldeffecten, Variabelen, Klonen, Signalen,...

Maak gerust deze oefening nog eens opnieuw , want dit was heel wat belangrijke informatie op korte tijd. Gaat het vlot? Probeer dan één van onze andere opdrachten met één of twee sterren moeilijkheidsgraad. Veel plezier!