1. Scratch for Interactivity
Dr. Ben Schafer
Department of Computer Science
University of Northern Iowa

2. A game
We will make a game where the player controls a baby using the arrow keys to catch a falling ball. If the baby misses the ball the game is over.

3. Activity #2 - Goals Learn about practice event handling
practice conditionals
practice loops
more with parallel execution (yesterday)
more with message passing (yesterday)

4. Delete the Cat
Click on the scissors and your cursor turns to scissors and then click on the cat to delete it
Or right click on the cat and pick delete

5. Add the Baby
Click on the button with the picture of folder with a star in it
if you hover over it, it says "Choose new sprite from file"

6. Select the People Folder

7. Scroll to the Baby
Click on the baby and then OK

8. Resize Your Sprite!
You can make your sprite larger or smaller by using the “grow sprite” or “shrink sprite” icons.
You click on one of these icons, then click on your sprite until it is the size you’d like.
shrink
grow 8

9. Move the Sprite
Select (click on the arrow and then on the sprite) and click and drag the sprite to the bottom of the window

10. Add a Background Click on the Stage Click on the Backgrounds tab
In the bottom right area
Click on the Backgrounds tab
In the center
Click on the import button
Pick a background
Like bedroom1 in indoors

11. Event Handling We want to control the baby using the arrow keys
When we click the left arrow the baby should move left
When we click the right arrow the baby should move right
This is a form of event handling
Responding to user actions like mouse clicks and key presses

12. The Scratch Stage
The Scratch stage is 480 pixels wide and 360 pixels high.
180
Moving left decreases the x value
Moving right increases the x value
-240
0,0
240
at the center of the stage
-180 12

13. Respond to Arrow Keys
Click on Control and then drag out "when space key pressed"

14. Respond to Right Arrow
Click on down arrow next to space and select right arrow

15. Respond to Right Arrow
Click on Motion and drag out "move 10 steps"

16. Change the move amount Click on the 10 Type 5 and press enter
it will highlight in blue
Type 5 and press enter

17. Respond to Arrow Keys Drag out "when space key pressed"
Change "space" to "left arrow"
Drag out "move 10 steps"
Change it to -5 (to move left)
Click on the stage and try out the left and right arrow keys
Does the sprite leave the window?
You can also use the stamp (top right) to make a copy of the first two blocks and then modify them to be left arrow and -5.

18. Paint a Ball Click on the paint brush and star
It will say "Paint new sprite" if you hover over it

19. Draw the Ball Click the circle tool
Circle tool and eyedropper
Click the circle tool
and then use the eyedropper to pick a color
and then click in the drawing area and drag to create the ball
Drawing area
Click ok when done

20. Size the ball as desired and move it to the top
Click and drag the ball to the top of the window

21. Make the Ball Fall
When the green flag is clicked we want the ball to always start at the top and fall down
Click on Control
Drag out "When green flag clicked"

22. Start the Ball Click on Motion Drag out “go to x # y # “
this will always start the ball at its current position (Scratch doesn’t automatically put it back for you).

23. Sequential Execution One block is executed after the other
In order from top to bottom
When the green flag is clicked
the ball will go to the specified x and y location

24. Loops
We want the ball to continue to move down unless the baby catches it
How do we make this happen?
We could use lots of blocks one after the other
But, that would be slow and repetitive
We need a way to repeat a block or set of blocks
This is called a loop or iteration

25. Make the ball fall Click on Control Click on Motion Try it out!
drag out "forever"
Click on Motion
drag out “change y by 10”
Change it to -1
Try it out!

26. Catch the ball!
If the ball touches the baby then it is caught

27. Conditionals
We want to print a certain message if the baby caught the ball
So this action will only occur only if some condition is true
This is called a conditional or an “if”

28. Conditional Statements
This code means that if the user presses the Space key on the keyboard, the sprite will move 10 steps.
Notice the “angle edged” block. These blocks are used to answer Boolean (true/false) questions. 28

29. Conditional Statements
Notice the “angle edged” block. These blocks are used to answer Boolean (true/false) questions.
Conditional blocks are obtained from either the Operators or the Sensing menu.

30. Sensing
The sensing menu contains a number of blocks which detect whether certain situations are true (or false).
In our current program we are interested in the “touching” block.

31. Did we catch the ball? From Control drag out an “if”
Check if the ball is touching the baby
Get this in Sensing
If this is true “make arrangements” to end the game

32. Adding Losing
If the baby doesn't catch the ball it just gets stuck at the bottom of the screen
Let's tell the player that he or she lost

33. Add a text sprite Click on the Paint new sprite button
Click on the T for text
Pick the color
Modify the font size
Move the square to where you want the text
Type You Lost!

34. Hide the sprite
We don’t want to tell the player that she lost when the game starts
So hide the message when the game starts
Click on Control
drag out "when green flag clicked"
Click on Looks
drag out “hide”

35. Check if Lost If the y position gets near the bottom (near -180)
Drag out an if
from Control
Drag out a blank < blank
From Numbers
Add a y position
From Motion
Type in -175

36. Broadcast a message Sprites communicate by passing messages
One sprite broadcasts the message
Other sprites can listen for it and react to it when they receive it
Click on Control
drag out "broadcast blank"
click on the drop down arrow
next to new – name it lost
Add “stop script”
to stop the forever loop
Sprites communicate by passing messages
One sprite broadcasts the message
Other sprites can listen for it and react to it when they receive it
Click on Control
drag out "broadcast blank"
click on the drop down arrow
next to new – name it lost
Add “stop script”
to stop the forever loop

37. Receive Lost Click on the text sprite Click on Control Click on Looks
drag out "when I receive blank"
click on the down arrow and select lost
Click on Looks
drag out “show”
drag out “stop all”
to stop all scripts 37

38. Parallel Execution We have several things happening at the same time
when the green flag is clicked
This is called parallel execution
More than one thing happening at a time

39. Create Instructions
Click on the Show Project Notes icon in the upper right corner
Add the instructions
Press OK

40. Test your game Click the green flag
If you want, adjust the speed of the ball
Increase the amount it changes in y
Modify the sprites using the “Costume” tab
Save your game with the “Save” button

41. Other Ideas Add a sound when you lose Add more sprites to catch
Add a sprite to avoid (like a big brother)
killer sprite

42. Concept Summary The Sensing menu Forever loops Conditionals – ifs
Can be used to see if certain conditions exist
Forever loops
repeat all the commands inside of them one at a time until the script is stopped or all scripts are stopped
Conditionals – ifs
only execute the body of the if when the condition is true
Sometimes used with sensing blocks

43. Concept Summary Sprites can pass messages Sprites can react to events
and receive them
Sprites can react to events
like clicking the green flag and pressing the left or right arrow keys
Sprites can have several scripts, costumes, and sounds
Things can happen one after the other – sequential execution or at the same time – parallel execution