What They Will Be Learning

Variables in coding are values that can change. They are used highly in games to vary

how computer controlled opponents behave. It can control factors like where they appear

and how fast they move.

We are going to create a simple code using variables that creates an unpredictable car

racing game.

Scratch – Starter Lesson – Car Race

Step 2 – On your marks!

Scratch does have a built in graphics program for creating your

own sprites, but to be honest it is not the easiest to use and

you are better off using graphic programs such as Gimp &

Inkscape to create them.

Secondly, children spend more time mucking about drawing

squiggly lines that look like rampant tap worms than anything

meaningful and no time on the coding.

So I have included the 3 graphics that you will need for this

game.

Step 1 – Map reading.

If you are new to Scratch

then here is a handy

map to show you the

areas that will be

mentioned in the

following instructions.

Step 4 – Laying the road.

To import the graphic of the road you need to click on the

Upload backdrop from file icon in the stage list area.

Beware that there are 2 identical icons in that area. DO NOT

use the one located at the top of the sprites list area.

Click on the icon and then browse to the location you saved

the road graphic and select it. I have found there is a little

glitch that means the road does not appear the first time.

Just repeat and it appears the second time.

Step 5 – Green car, blue car.

We do the same to import the two images of

the cars. But this time use Upload sprite

from file icon. This is located along the top

of the sprite list window.

Click on the icon and then select the blue or

the green car first. Then repeat to import the

other car.

If the road disappears then it means they have

used the Upload backdrop from file icon

instead from step 3.

Step 3 – Bye bye cat.

The first step is to remove the

default sprite of the cat.

In the sprite list area in the

bottom left of the screen right click

on the cat and then select delete.

The cat should disappear from the

sprite list area and from the

stage area.

Step 7 – Ready, steady!

The very first bit of code we need to drag from

the blocks palette area is under the Events

tab.

It is the when the green flagged clicked

block. Simply drag it onto the script area.

This block is nearly always the first one you will

need. It means that when the green flag at the

top of the stage area is clicked the script will

start running.

Step 6 – Pre race checks.

It does not matter if the cars are not in the

right places. We are going to correct that

using coding.

The coding is nearly the same for both cars so

we are going to write the code for the blue

car and then copy it to the green car and

make a few changes.

But to start with we need to make sure we

are writing the script for the blue car. So click

on the blue car in the sprites list area so it

is highlighted blue.

Step 8 – Racers to the grid.

To make things easier we are going to get the

coding to put the cars in the right starting

position when we click the green flag.

If you click on Motion in the blocks palette

area you will see a block that says go to x:00

y:00. Drag this so it locks onto the first block.

Then on the new block click in the white box

after x: and change it to -175, then in the

white box after y: change it to 93.

Step 9 – Understand X & Y.

Ry

Imagine a grid on the stage area with 0 in

the middle. The X axis runs left and right and

the Y axis runs up and down.

Anything up and right is a positive number

and anything down and left is a negative

number.

Using these co-ordinates in the code we can

position objects or sprites exactly where we

want them.

Step 10 – And their off!

Ry

We need to now make the car move

forward. There is an option in Motion to

move 10 steps, but if we put that in on its

own the car will only move 10 steps forward

then stop.

So in Control there is a block that says

repeat until with a hexagon groove. Put

this block in first and then from Motion put

the move 10 steps in the middle of it.

Now the code will keep repeating the 10

steps until the instructions we place in the

hexagon groove take place.

Step 11 – Finish line in sight.

We need to tell the repeat until

block when to stop repeating.

In Sensing the top block says

touching with a drop down box.

Drag this into the hexagon

groove in the repeat until block

and then click on the little black

arrow to show a drop down list

and then click on edge.

This now means that when the car touches the edge of the screen it will stop

repeating the move 10 steps.

Step 12 – Put your foot down.

At the moment the car will move 10

steps every time the code is run. This

means if both cars have the same code

then they will both go at the same

speed.

What we need to do is get the code to

create a random number that takes the

place of the number 10 in the move 10

steps. This is where we use a variable.

Click on Data in the blocks palette

and then click on Make a Variable.

In the new window that appears click on For this sprite only and then give the

variable a name. I suggest keeping the name simple such as blue or blue speed.

Step 13 – Why name it?

Why do we give the variable a name?

In this code we are going to be using two variables. Some codes can use hundreds or

thousands of variables. We do not need to know what random number the variable

has chosen and tell the coding that value, we just need to tell the coding the name of

the variable we want it to use and it can find the value itself.

Step 14 – Time for speed.

Once you create the variable you will see

some new blocks appear in the Data tab.

The top one is a rounded rectangle with the

name of the variable you just made.

Under that is block that says set (your

variable name) to 0. Drag this block

between the first and second block in the

scripts area.

This block tells the coding what value we

want the variable of that name to be.

Step 15 – Pick a number.

At the moment the coding say that

our variable is set at 0. We need to

allow the coding to be able to

change this number every time we

start the code.

If we go to Operators there is a

block that says pick random 1 to

10. Drag this into the white slot in

the set (variable name) to block.

This now means that each time we

run the code it picks a random

number between 1 and 10.

Step 16 – How fast?

So the coding is now picking a random

number for the speed, but we have not

told the coding what to do with it.

Go back to the Data tab in the block

palette and drag the rounded rectangle

with the variable name into the white

space with 10 in it on the block that says

move 10 steps.

What we have now done is told the coding

to pick a random number between 1 & 10

and then use that number as the amount

of steps to move the car each time.

Step 17 – Going the extra mile.

We could just copy that code over to the green can and make the changes and it

would work. The race will be random with both cars in with a chance of winning. But

what if the race is really close or we take our eyes off it. Who really won?

So we are going to add some extra touches to make our game even better.

Step 18 – I won!

What better way to find out who

won than by letting the sprites tell

you?

Go to the Looks tab in the blocks

palette and drag the block that

says say Hello! onto the bottom of

our code.

Now click in the white box that says

“Hello!” and change it to “I win!”

Now if the car touches the edge

that message will appear on the

screen.

Step 19 – Tell everybody.

If copied the code to both cars they

would race, but the losing car would

carry on until it reached the end and

would also display the message “I

win!”

So we need the coding to tell the

other car to stop.

To do this the blue code is going to

broadcast a message that the green

car will hear and then know to stop.

Go to Events in the block palette

and choose the block labelled

broadcast message 1 and drag it

to the end of our script.

Then click on the little back triangle

and click on new message in the

drop down menu.

Type in the Message Name “blue

wins” and click OK.

Step 20 – What if I lose?

There is always a chance the blue car

might lose, so we need to make sure the

code is listening for the message from the

green car to say it won.

In the Events block palette drag the block

labelled when I receive message 1

under the main script so it starts a new

one.

We can’t change the message yet as we

have not created the script for the green

car, but do not worry, we can come back

and do that later.

Step 21 – Race over!

Once the coding knows the other car has won

we want it to stop this car.

In the Control tab there is a block that says stop

all. Drag this under the new block in our script

area that says when I receive message 1.

Click on the drop down box in the new block and

change it to other scripts in sprite.

Now when the code receives the message it will

stop the main script running, which means the car

will stop moving any further.

Step 23 – Everybody equal.

Now we have all the coding in place we can copy

the code we have written into the green car.

Firstly, drag the smaller code that starts with

when I receive message 1 by dragging the top

block down onto the green car in the sprite list

area. Then click on the green car and the copied

code should be there. Drag it about halfway down

out of the way.

Now click on the blue car and do the same with the main script. Drag it by the top

block on to the green car again and then click on the green car to make sure it is there.

Step 22 – Surprise!

Now this a small thing, but makes the game more fun.

You will notice that since we created our first variable a little window has appeared at

the top of the stage area. It shows what the number is for our variable.

When we create the code for the green car another one will appear for the green car.

The problem is that at the start the race the one with the larger number will win and

we can see that as soon as the green flag is clicked!

Luckily we can do something about this. Click on the Data tab in the block palette

and drag the bottom block called hide variable (variable name) and place it under

the first block in our script. Now when we start the code the window will be hidden.

Step 25 – It’s me, green!

At the bottom of the script click on

the drop down box on the

broadcast blue wins block.

Select new message and type in

the Message Name window green

wins and press OK.

Then under that change When I

receive message 1 to blue wins

by clicking on the drop down box.

Step 24 – A few tweaks.

We now have to just create a variable for

the green car and change a few bits in the

script to make it work correctly.

Just like we did for the blue car go to the

Data tab and click on make a variable.

Again click For this sprite only, but this

time call it “green.”

Then on the main script drag the variable

block called Blue in the move steps to the

block palette and let go to remove it.

Then drag the new variable for green to

replace it.

Then in the block hide variable blue click on the drop down section and you can now

choose green. Do the same with the block under it for set blue to pick random 1 to

10.

Step 27 – Blue ready!

One more last bit to change. Now that we have created the code for the green car we

can finish the last bit of the code for the blue car.

Click on the blue car in the sprite area and then on the block When I receive

message 1 use the drop down box to change it to green wins.

Step 26 – Green ready!

Last bit to change for the green car is the starting location.

The x co-ordinates will stay the same at -175 because we

want the cars to be level at the start, but we need to change

the y co-ordinates so that the green car is on the other track.

Change it to -77.

Step 28 – Lets race!

We are now ready to race!

Clicking on the green flag in the stage

area will start the race. When a car

reaches the end it should announce “I

win!” and the other car should stop.

If both cars say “I win!” then it means it is

a tie.

Simply click the green flag to start the

race again.

Taking It Further

The children can now play with the script to see how any changes they make affect

how the program works.

But remind them, they break it, they have to fix it! That’s what programmers do.

The most obvious changes they can make is to the two numbers that the variable

uses. Ask the children what happens is they make the second number bigger? Ask

them what happens if the make the difference between the two numbers larger or

smaller?

For those more adventurous children maybe they could make a third sprite for a

finish line and then see if they can change the code so the cars stop when they touch

the finish line.

Or maybe they could change the sprites for maybe a hare and a rabbit?