Maze

Name	Maze
Language	Scratch
Age Level	AGE LEVEL (coach)
Skill Level	SKILL LEVEL (coach)
Materials	Scratch.mit.edu or Scratch Desktop
Prerequisites	ACADEMIC PREREQUISITES (coach)
Topic	ACADEMIC TOPIC (coach)
Duration	DURATION (coach)
Authors	Lisa Nasu-Yu, Jumana Amr, Denis Koterev, Alex Koterev, Jayden Tsai
Last Updated	July 21, 2022

Summary

Create a maze game using scratch.
Navigate your sprite through the maze and reach the goal before time runs out!

Overview

1. Maze Outline Sprite
   Draw an outline for the maze using the Scratch art tools and create a sprite.
2. Motion
   Navigate the sprite with your mouse and stop its motion when it is touching the maze walls.
3. Timer & Goal
   Create a countdown variable and goal sprite to sense when the sprite has reached its destination.
4. Win/Lose
   Create win/lose backdrops that appear at the end of the game.

What you’ll learn

• Events
• Control flow
• If block
• Forever block
• Variables
• Boolean operators
• Cloning

Instructions

Step 1: Maze outline

Our first step is to make a maze layout for our player to run through.

1. Click on Stage in the bottom right to select the background of your game.
2. Click on the Backdrops tab/folder in the top left in between Code and Sounds to open a list of all background images
3. Click on the Line tool to create a straight lines.
4. You can press the SHIFT key to help you make perfectly horizontal and vertical lines
5. Make sure that all walls are the same color because the color of the walls is how we will implement collison to the walls.

   Finally rename the backdrop to Maze.

Sample Maze


Step 2: Sprite

The next step is to create a sprite.
A sprite is an image that can be coded individually to create content in your game.

Creating a Sprite

You can pick an existing sprite or create a new one. A new scratch project already comes with a sprite of the Scratch Cat.

1. To create a new sprite hover your mouse over the blue circle with a white cat’s face on the bottom right of the screen.
2. Click on the Brush to create an empty sprite or click on the Magnifying Glass to select a pre-drawn sprite

Editing the Sprite

By clicking on the sprite and pressing on the costumes tap in the top left corner, you will be able to edit how your sprite looks.

Everytime you add something to your drawing it will be seperate from the rest of the drawing.
This means that if you want to edit something like rotation or size it might be difficult.
Grouping fixes that issue by keeping everything in proportion within the same group.

Highlight everything you want to be in a group and press the Group button.

Grouping in Scratch


The sprite can be anything, just make sure it can fit through your maze.
Rename your sprite to Main.

Step 3: Motion

Once you are finished with making the sprite, you can now begin with the coding.

Coding in scratch reads from top to bottom. Blocks on top will run before the blocks under it.

Setting up

1. Make sure that you are in your Main sprite and that you are in the Code folder/tab.
2. Navigate to the Events section and drag when flag clicked block to the right. This block will begin the program
3. Next is to set a starting position and rotation for the sprite
4. Navigate to the Motion section and drag the go to x:(0) y:(0) block under the event block. X is the horizontal position of the sprite while Y is the vertical position.
5. Set X and Y to your desired starting position by clicking on the numbers
6. Next is to set the starting rotation of the sprite.
7. In the Motion section find the point in direction (90) block and drag it to the bottom of your code.
8. Make sure that the number is 90

   This will reset this sprite everytime the green flag is pressed.

Forever Block

1. The On green flag pressed will only run once at the very beginning. For something to run forever you will need the Forever block.
2. The Forever block is found in the Control section, find it and drag it to the bottom of the code.
3. Notice how you can have blocks inside the Forever block. Anything the inside the block will be repeated forever.
4. You might also notice how you can not have anything under the Forever block. This is because the code will never be able to go beyond the forever loop.

Motion

Now to make the sprite follow the mouse

1. In Motion drag the Move (10) steps block inside the forever block. This block moves the sprite a number of steps into the direction the sprite is looking at.
2. Clicking the green flag will make the sprite move to the right
3. The sprite might be moving a little to fast, so try changing the sprites speed by changing the amount of steps it takes. 2 steps looks like a good speed.
4. To make the sprite follow the mouse you need the Point towards (mouse-pointer) block found in Motion.
5. Drag this block inside the forever block but also above the Move block since you want the sprite to look at the mouse before moving.

Solution


At this moment you might have definitely noticed that the sprite can move through walls.

Making the walls solid

Now that the sprite can move, it is time to make the walls solid

IF block

1. You are ganna need the if block found in Controls to check if the player has collided with the wall.
2. You may have noticed a hexagonal slot right after the if. Any block that has a hexagonal shape can fit inside that slot.
3. Any hexagonal block returns something called boolean
4. Boolean is a variable that can either be true or false.
5. if will only activate once the boolean block is true.

Coding

1. Drag if under the move block inside the forever block
2. Go to the Sensing section and drag touching color ()? block into the slot. This block returns a boolean.
3. Click on the color to bring up color menu.
4. Use the eye drop option at the bottom of the menu to select the color of the walls. This is also why it was important to make sure that the walls were the same color.
5. Inside the if block place move (10) steps and change the amount of steps into -10. The sprite will take 10 steps backwards.
6. Inside the if block you can also drag say (Hello!) for (2) seconds. Change “Hello!” to “Ow!” and reduce the duration to 1 second.
7. The sprite will now say “Ow!” every time it touches the wall.
   
   Solution

Step 4: Time and Goal

Variables

Variables are numbers that can change.
They are useful because they allow things to move and change mid game.
It would be hard to make a fun game where nothing can move or change.
The sprites positions are variables and so are booleans.

Create a Timer

After you have finished adding movement to the player, the next objective is to add a timer and goal.

1. Navigate to the Variable section on the left, and create a new variable by selecting Make a Variable.
2. Name the variable as Timer and select the option available for all sprites.
3. Then, within your Main sprite, create an when green flag clicked event.
4. Navigate back to the variable section and drag the set my Variable to 0 block underneath this event.
5. Change the variable to the Timer variable, and set its value to 25, representing a 25 second time limit.
6. Underneath the block which set the Timer variable to 25, add a forever block. In this block, we will make the value of the Timer variable decrease by 1 every 1 second.
7. Navigate to the Control section, and drag the control block wait 1 second into the forever loop.
8. Afterwards, drag the variable block change My Variable by 1 underneath the wait 1 second block. Make sure to replace the My Variable variable with the Timer variable, such that it currently changes the Timer variable by 1.
9. To make the timer to count down, change the value within the newly added change My Variable by 1 block from 1 to -1.

Solution


Ending the game

Try running the project for 30 seconds by pressing the green flag.

Notice that after 25 seconds, the Timer variable has a negative value. This is because the timer variable within the forever loop will indefinitely decrease every second until it is stopped. The next step is to stop the game once the timer reaches zero.

1. Underneath the block which decreases the Timer variable by 1, add an if block.
2. From the operators section, set the comparison block = as the if block’s condition by dragging it into the hexagonal space beside the if block.
3. The = block compares two number to see if they are equal. This block returns a boolean.
4. In the = block, add the Timer variable on the left of the equals and 0 on the right. This will allow the if block to check if the Timer variable’s value is equal to zero.
5. From the Control section, drag the stop: all block into the if block. This way, if the value of the Timer variable is equal to zero, the if block will stop everything.
   
   Solution

Create a Goal

Great job on getting this far!
The next objective is to add a goal at the end of the maze. To do this, we need to create a new sprite that will allow us to check whether the player has reached the end of the maze.

1. Create a new sprite for the goal.
2. Change the sprite’s name to Goal
3. Set the sprite’s x and y coordinates to where you would like to place the goal. This can be done by dragging the sprite in the screen or manually inputting its x and y coordinates in the panel above the sprite selection sheet.
4. Within the Main sprite’s forever loop, which was previously established to monitor the Timer variable, add another if block underneath the previous if block.
5. Navigate to the Sensing section, and drag the touching block into the new, empty if block.
6. Change the sprite within the touching block to the newly created Goal sprite.
7. From the Control section, drag the stop: all block into the if statement. This way, if the player’s sprite touches the Goal sprite, the if statement will stop everything.

Solution


Step 5: Win/Lose

Next, to indicate to the player whether the game has been won or lost, win and lose screens will be used.

Creating Win/Lose backdrops

1. Pick and customize existing Scratch backdrops or draw new backdrops for the Win and Lose screens
2. Rename the backdrops Win and Lose

Switching Backdrops

1. Go to the Main sprite code.
2. Place the control block switch backdrop to above stop all in the if touching Goal block. Change the backdrop to Win
3. Repeat for the Lose backdrop in the if Timer = 0 block
4. Try the game out for yourself. Notice that after you complete the game, the player sprite and goal sprite remain after the backdrop is switched to both the win and lose screen.
5. In the Main sprite, navigate to the Looks section and drag the hide block right before switching the backdrop to the win screen and the lose screen.
6. In the Goal sprite, navigate to the Events section, and select the event when backdrop swithces to.
7. Create Three of this event.
8. Set the first event to trigger when the backdrop switches to Win and the second to trigger when the backdrop switches to Lose.
9. Underneath both events, add the hide block from the Looks section.

Now, you have the player and goal sprites disappear when the backdrop switches.

1. Now, try running the game.
2. Notice the backdrop does not return to the maze backdrop after winning/losing and the Main and Goal sprites are nowhere to be seen.
3. In the player’s sprite, Add a switch backdrop block and show block just below the sprite’s when green flag clicked block. Change the backdrop to Maze.
4. Go to the Goal sprite, and create a third when backdrop swithces to event. Set the condition to when the backdrop switches to Maze.
5. Add a show block from the Looks section underneath this event.

Solution


BONUS!

Using the skills you learned you can add a collectable that the player has to pick up before being able to complete the game!

Creating a clone

1. Create a new sprite called Collectable and make it anything you like.
2. Create a new Variable called Items for all sprites.
3. Create an when green flaged clicked event and add hide block underneath.
4. Add create clone of myself from the Control section. This will create a clone that will need its own code.

Coding the clone

1. To add code for the clone we will need when I start as clone block from the Control section.
2. Set its position using the go to x: y: block. Have the collectable somewhere away from the Main and Goal sprites starting positions.
3. Also add the show block because we want to see the clone.
4. Add a forever block with an if block inside.
5. Have the if condition to be if touching Main sprite
6. inside the if block have change variable by 1 block from the Variables section.
7. Make sure that the variable is set to Items and make it change by -1.
8. Finally add a delete this clone from Control beneath the change variable by 1 block.

At the start of the game the Collectable sprite will create a clone that will disapear when touched. It will reduce the number of Items to zero, indication that there is no more collectables to collect.

Solution


Implementing

We are not done just yet! The Main sprite only checks if you have touched the Goal. We need to make it so that it also checks if you have collected the Collectable

1. Go to the Main sprite and remove the touching Goal block from the if.
2. In the Operations add the and block into the empty slot. This block will only return true if both conditions are true.
3. Return the touching Goal block onto the left slot of the and block.
4. Add an = block onto the right slot.
5. Inside the = block make it so that it compares Items to zero.

Your Done! The game will only show the win screen if the player is touching Goal and Items is equal to zero!

Solution


Conclusion

Full Solution

Main sprite Code | Collectable sprite Code
:– | :–
 | 
Goal sprite Code | Game
|

Completed game at https://scratch.mit.edu/projects/410818157/editor

Quiz

Test your skills with a quick quiz!
Maze Quiz

1. What is a Variable
2. What is a Boolean
3. What will 3 = 2 block return
4. How does a if block activate

Quiz Solutions

1. A **variable** is number that can change
2. A **boolean** is a variable that can only be **true** or **false**
3. It will return **false**
4. `if` block will only activate if a **boolean** condition is **true**