Chase Game for Beginner Game Designers

Chase Game for Beginner Game Designers

Becky Wright

Becky Wright

About the author

Becky is an educator and the Lead Digital Skills teacher at the Lindsay Pinnguaq Makerspace. She is passionate about developing an intrinsic motivation for learning within every student she meets. Becky graduated from the University of the Pacific with a Bachelors of Arts in Liberal Studies with a Major in Human Development and Special Education, and a Masters of Arts Degree in Curriculum and Instruction. Prior to beginning her role as an educator for Pinnguaq, she taught grades sixth through eighth in a Montessori school structure. She also spent five years teaching a range of grades from preschool to eighth grade in Bangkok.


Introduction

Scratch is an amazing way to introduce children to coding and instill an intrinsic motivation to use code in different ways, such as creating animated stories, interactive games, exciting simulations, and beautiful artwork. In using Scratch, children are developing their computational thinking skills while creating their own ideas and bringing them to life. In this lesson, learners will be introduced to coding concepts and computational thinking by creating a simple computer game. 

This is a beginner level lesson introducing learners to game development in Scratch. They will design a simple ‘Chase’ game in Scratch where a monkey is chasing bananas around the jungle to score points. 

 Through creating this game, the learner will use: 

  • Events blocks
  • Keyboard inputs
  • Touch sensors
  • Conditional statements
  • Loops
  • Movement blocks
  • Sound blocks
  • Variables

Scratch makes it easy for learners who are just starting out on their coding journey by eliminating the need to write any code script. Instead it uses code blocks that are grouped by categories, such as Motion, Events, Controls, Sensing, and much more. These code blocks can be pieced together in the scripts area like clipping lego pieces together. Students can easily test their code and debug problems with their code by having the script area and the stage both visible at the same time. 

By learning to code, learners can turn their love of playing games into a passion for making their own games to play and to share.  Game design can help develop computational thinking skills and can encourage learners to learn how to program. 


Vocabulary

Control (Scratch Block Category)
these blocks are used to control scripts and provide various loops.
Event (Scratch Block Category)
these blocks are mainly hat-shaped and sense events that trigger a script to run.
Motion (Scratch Block Category)
these blocks are used to control the movement of a sprite.
Sensing (Scratch Block Category)
these blocks are used to detect different factors in your project.
Stage
the stage is the background of the project, which can have scripts, backdrops (costumes), and sounds. It is 480 pixels wide and 360 pixels tall. This is where you can play your code that you create.
Variables (Scratch Block Category)
used to hold and refer to (i.e. use later) values and is often a temporary piece of information that can change in a code.
X-Coordinate
A number on the x-axis that describes where something is in terms of left and right (or horizontally).
Y-Coordinate
A number on the y-axis that describes where something is in terms of up or down (or vertically).
Input
An action that tells a computer to do something.
Sound (Scratch Block Category)
these blocks are used to control sound in your project.

Materials

Scratch 3.0 Online or Desktop Version   


Computer Activity

The following steps will take you through the process of developing a chase game in Scratch where a monkey will chase around bananas in the jungle to score points. You will explore how to use keyboard inputs to move your ‘Monkey’ sprite around, how to code your ‘Bananas’ sprite to glide randomly around the screen for the monkey to chase, how to use conditional statements and how to add a variable to score points if the monkey catches the bananas. You will also learn how to add some fun sound effects to your game. 


Step By Step Instructions

Add Your Sprites and Background

  1. Delete your cat sprite by clicking the garbage can with the ‘x’ on it in the right corner of the sprite box. 
A red arrow pointing to the cat sprite.
  1. Add your jungle backdrop by clicking on the picture icon in the bottom right corner of the screen and selecting the magnifying glass to access the Scratch backdrop library. 
A red arrow pointing to the choose a backdrop option.

Click on the ‘Outdoors’ tab in the top menu and scroll down to find the jungle backdrop. 

The backdrop tab with outdoor highlighted and an arrow pointing towards the jungle backdrop.
  1. Add your ‘Monkey’ and ‘Bananas’ sprites by hovering over the ‘Choose a Sprite’ icon in the bottom right corner of the screen and selecting the magnifying glass to access the Scratch sprite’s library. 
A red arrow pointing towards the choose a sprite option.

Select the ‘Food’ tab and click on the ‘Bananas’ sprite. 

The choose a sprite option, and food tab is highlighted.

Select the ‘Animals’ tab and scroll down to find the ‘Monkey’ sprite. 

The animal tab is highlighted with an arrow pointed towards the monkey script.
  1. Let’s change the size of the ‘Monkey’ and the ‘Bananas’ sprites. Click on the ‘Monkey’ sprite and change the number in the size box from 100 to 50. 
The monkey sprite is selected in sprite area, with an arrow pointing towards the size options. It reads 50.

Follow the same steps to change the size of the ‘Bananas’ sprite down to 50% of its original size. You can always come back to this step and make the ‘Bananas’ sprite even smaller if you’d like to make it more difficult to catch them.

The banana sprite is highlighted in the sprite area with a red arrow pointing to the size. The size reads 50.

Code Your ‘Monkey’ Sprite to Move Using Arrow Keys

  1. Now you will code your ‘Monkey’ sprite to move when the arrow keys are pressed on your keyboard. Click on the ‘Monkey’ sprite in the sprite’s pane and check to make sure you are coding the correct sprite by looking at the faded picture in the top right corner of the ‘Scripts Area’. 
The monkey sprite is highlighted with script area wrote in red letters.
  1. We want our program to move the ‘Monkey’ sprite around whenever the player presses the arrow keys. To do this we will use keyboard inputs. An input is an action that tells a computer to do something. For your inputs you will go to the yellow Events block category in the code blocks menu and choose a “when key pressed” block. This means that when we press the space key, the code you add underneath will run. 
Events block When Space Clicked is dragged into the scripting area.
  1. Click the drop-down menu  in the middle of the Events block and change it to the ‘up arrow’. This now means that when you press the up arrow, the code you add underneath will run. 
Events block, the drop down is displaying up arrow selected.

Follow this same step to add a keyboard input for the ‘down arrow’, ‘right arrow’, and the ‘left arrow’. 

Blocks displaying up arrow, down arrow, right arrow, and left arrow.
  1. Next, we need to add code to each keyboard input to tell the ‘Monkey’ to move in the same direction as each arrow when the arrow keys are pressed. To do this we are going to code our up and down arrows on the keyboard to move our ‘Monkey’ sprite along the y-coordinate. We will code our left and right arrows on the keyboard to move our ‘Monkey’ sprite across the x- coordinate. 

First, let’s talk a little bit more about x and y coordinates. Every sprite that is added to the Stage has a set x,y coordinate. The Scratch stage is an xy-plane, which means that it uses two numbers, the x-coordinate and the y-coordinate (x,y), to describe the location of the sprites on a grid. 

The y-axis is shown on the following grid as a blue vertical line and it determines where something is in terms of up or down. The number of the y-coordinate gets bigger as you move upwards along the y-axis, and smaller as you move downwards.

The x-axis is shown on the grid as an orange horizontal line, which determines where something is in terms of right and left. The number of the x-coordinate gets bigger as you move to the right along the x-axis, and smaller as you move left. 

The X Y grid with nothing displayed on it.

Click and drag the ‘change y by 10’ block from the Motion common group and add it underneath the ‘when up arrow key pressed’ block. This will move your sprite 10 steps upwards along the y-axis when you press the up arrow key because you are changing the coordinate to a bigger number. 

Motion block that reads "Change Y by 10" with a  "when up arrow clicked" block above it.

Add another ‘change y by 10’ block underneath the ‘when down arrow key pressed’ block, but this time you will change the number in the white bubble to -10. This will move your sprite down when you press the down arrow key because you are changing the coordinate to a smaller number.

Motion block that reads "Change Y by 10" with a "when down arrow clicked" block above it.

Click and drag the ‘change x by 10’ block from the Motion common group and add it underneath the ‘when right arrow key pressed’ block. This will move your sprite 10 steps to the right along the x-axis when you press the right arrow key because you are changing the coordinate to a bigger number.

Motion block that reads "Change X by 10" with a "when right arrow clicked" block above it.

Add another ‘change x by 10’ block underneath the ‘when left arrow key pressed’ block, but this time you will change the number in the white bubble to -10. This will move your sprite left along the x-axis when you press the left arrow key because you are changing the coordinate to a smaller number. 

Motion block that reads "Change X by 10" with a "when left arrow clicked" block above it.
  1. Test your code! You should be able to now move the ‘Monkey’ up and down and left and right with the arrow keys. If your ‘Monkey’ sprite is not moving in the right direction, you may have to debug your code. Check to see if you have the correct negative and positive numbers underneath each arrow input. 

If you’d like to experiment with different ways to code your ‘Monkey’ sprite to move, check out this tutorial from Jonathan Weber at Pinnguaq called Player Control In Scratch Movement Techniques.

Code the ‘Bananas’ Sprite to Glide Randomly Around the Jungle

  1. We are going to add code to the ‘Bananas’ sprite so that it moves randomly around the jungle for our ‘Monkey’ sprite to chase! Click on the ‘Bananas’ sprite in the sprites pane and add a ‘when green flag clicked’ block from the Event block category into the scripts area. 
Events block brought into the script area.
  1.  We want our ‘Bananas’ sprite to glide around the stage forever during our game. Add a ‘forever loop’ control block underneath the ‘when green flag clicked’ events block. This means that whatever code we put inside the ‘forever loop’ will keep running over and over again. 
Control block if and then is brought into the script area.
  1. Next we are going to add a ‘glide to random position’ block from the Motion block category and drag it inside the ‘forever loop’. 
Glide block is circled with a red circle and and area pointing towards the script area.
  1. Test your code by clicking on the green flag! Try changing the number of seconds in the white bubble of the ‘glide to random position’ Motion block to change the gliding speed of your ‘Bananas’ sprite.

Add a Cool Sound Effect to Your Chase Game! 

  1. Now you will add code to your game so that each time the ‘Monkey’ sprite catches the ‘Bananas’ sprite, it will make a chomping noise. First click on the ‘Monkey’ sprite in the Sprites pane, then drag a ‘when green flag clicked’ from the Events block category onto the Scripts Area. 
Events block when green flag clicked is dragged into the script area.
  1. We want the chomping sound to happen every time the ‘Monkey’ sprite touches the ‘Bananas’ sprite. Add a ‘forever loop’ control block underneath the ‘when green flag clicked’ Events block. 
The control block, forever loop, is brought over into the script area.
  1. Next, grab the ‘if…then’ block from the Control block category. This is a conditional statement that means if one certain thing happens, then something else will happen. Put the ‘if…then’ conditional statement block right inside the forever block.
if then block is brought in between the forever loop.
  1. You want the chomping noise to happen ONLY if the ‘Monkey’ sprite touches the ‘Bananas’ sprite. To do this we will add a ‘touching mouse pointer’ block from the Sensing block category to check whether the ‘Monkey’ sprite is touching the ‘Bananas’ sprite. Drag this block into the hexagonal shape between the if and the then of your conditional statement. Then click the drop-down on the Sensing block menu and change the mouse-pointer to Bananas.
The sensing block called touching mouse pointer is brought into between the if and then block.
Mouse pointer drop down.
  1. Now your conditional ‘if…then’ statement says that if the ‘Monkey’ sprite touches the ‘Bananas’ sprite, then something else will happen. You want the “something else” to be the chomping noise. Add the ‘play chomp sound until done’ from the Sound block category into the ‘if…then’ block. 
The play sound block is circled and has an arrow pointed towards the script area.
  1. Test your code by clicking on the green flag and moving the ‘Monkey’ with the arrow keys to touch the Bananas! You should hear a chomping sound every time the ‘Monkey’ catches the Bananas! 

Add a Variable to Score Points When the ‘Monkey’ Catches the Bananas

  1.  Now we will be adding a Variable to keep track of the score for how many times the ‘Monkey’ Sprite catches the Bananas.  By tracking the score, the chase game becomes competitive and gives a target for the user to try and achieve, then beat. Think of a Variable like a box that stores values. Our Variable will hold the value of the score, which will start at a value of zero and change by 1 every time the ‘Monkey’ sprite catches the ‘Banana’ sprite. 
  2. First select the ‘Monkey’ sprite and then go to the Variables control group. Then click on the ‘make a variable’ tab. 
The variables section is circled in the right hand corner, and at the top the Make a Variable option is circled.
  1.  A window will open that will allow you to name your Variable. I named mine ‘score’. Make sure that you set the New Variable to ‘For all sprites’. 
The make a new variable option opened, with score wrote in.
  1. Once you hit ‘OK’ you will see the Variable appear in the top left corner of your Stage. 
The new score variable is displayed in the top right hand corner, the background is set to the jungle and the monkey is displayed in the centre.
  1. Drag the command ‘Set my variable to 0’ from the Variables control group under your Green Flag. This will clear the score back to 0 every time you start a new game.
The set variable block is circled and has an arrow going towards the script area.
  1. Click the drop-down menu on ‘Set my variable to 0’ and change it to “score”. 
The my variable drop down, score is selected.
  1. Now add a ‘change my variable by’ block from the Variables block category inside the ‘if…then’ conditional statement. 
Change my variable is circled.
  1.  Make sure you Click the drop-down menu on ‘change variable by 1’ and change it to “score”. Now the score will go up by 1 every time the ‘Monkey’ sprite touches the ‘Bananas’ sprite.
The change variable drop down is present, score is selected.

Congratulations! You’ve completed coding your ‘Chaser’ game! Now it is time to play! 

Here is what your final program should look like for your ‘Chase’ game: 

‘Monkey’ sprite:

The complete code on the right hand side and the jungle and monkey are on the right hand side.

‘Bananas’ sprite:

The banana sprite is able to be seen on the screen now.

Conclusion

Try making your own version of this chase game with a different background and different sprites. You can challenge yourself by trying to add in a new Variable for a timer and check out the Scratch Mix and Match Challenge Bonus: Levels tutorial by Mary McDonald from Pinnguaq to see how to add levels to your Chase game!

We want to see the awesome things you’re creating! Take a photo or video and share your work with us by emailing media@pinnguaq.com or tagging @pinnguaq on Facebook, Twitter, or Instagram. Don’t forget to include the hashtag #LearnWithPinnguaq! You can also upload your project to the Pinnguaq Studio.


You might also like