Racing Car

ScratchEasy

In this lesson we will program the arrow keys on your keyboard to control a car to drive it around racing tracks that we create using the backdrop editor.

1

Create a new Scratch project

Create a new Scratch project and delete the cat sprite.

2

Add the car sprite

Included with this lesson is a car picture that we're going to upload into our Scratch project. To first download the picture file onto your computer and then upload it into your project follow these steps:

  1. Right click on the red car image and then click 'Save image as...'
  2. Choose a location on your computer such as your desktop and save the file.
  3. In your Scratch project click on the 'Upload sprite from file' button (by clicking the sprite library button highlighted in yellow in the figure on the right) .
  4. Go to the folder you saved your car picture file.
  5. Select the file and click 'Open'

The car sprite will upload into your project and appear in the stage area.


3

Shrink the car

As the car sprite is very large, we'll need to shrink it so that it has room to move around. We're going to shrink it to 10% of it's original size.

when green flag clicked set size to (10) %

4

Draw a racing track

We're going to use the backdrop editor to draw a racing track. To open the backdrop editor do the following:

  1. Click on the stage backdrop in the bottom right. A blue box should appear around it.
  2. Click on the 'Backdrops' tab at the top left. You should now see the backdrop editor.

Next we're going to draw a race track. First we will colour the background green and then we will draw a black track. Follow these steps:

  1. Click on the 'Convert to Vector' button
  2. Click on the Fill colour selector and choose a green.
  3. Click on the paint bucket tool.
  4. Click on the backdrop to change it's colour to green.
  5. Click on the Fill colour selector and choose a black (use the brightness slider).
  6. Click on the paint brush tool and set the thickness to 90.
  7. Draw a simple loop track by holding down the left button, moving your mouse and then releasing the left button.

5

Place your car on the track

Drag your car in the stage area and place it on your track.

We want the car to always start in this position when we click the green flag so add the following code:

when green flag clicked set size to (10) % // add the new blocks under here go to x (0) y (0) // these values will be prefilled with the current position of your car point in direction (90)


6

Create a speed variable

We're going to program the car to go at different speeds depending on whether it's on the track or the green grass. Create a variable called 'speed' in the Variables toolbox.

7

Detect where the car is

To detect where the car is, we're going to sense what colour it's touching. If it's touching green then we will set the speed variable to 2, otherwise the car must be on the track so we'll set the speed variable to 6. Add the follow code to the car:

when green flag clicked set size to (10) % go to x (0) y (0) point in direction (90) // add the new blocks under here forever if < touching color [#6b953c] > then set [speed v] to (2) else set [speed v] to (6) end end

Note: you need to select the green of your grass.

8

Program the arrow keys

We're going to program the arrow keys on your keyboard to move and control the car.

  • Up arrow = move forwards
  • Down arrow = move backwards
  • Left arrow = turn left
  • Right arrow = turn right

And the following code to the car (inside the 'forever' block):

when green flag clicked set size to (10) % go to x (0) y (0) point in direction (90) forever if < touching color [#6b953c] > then set [speed v] to (2) else set [speed v] to (6) end // add the new blocks under here if < key (up arrow v) pressed? > then move (speed) steps end if < key (down arrow v) pressed? > then move (-2) steps end if < key (left arrow v) pressed? > then turn ccw (5) degrees end if < key (right arrow v) pressed? > then turn cw (5) degrees end end

9

Drive your car!

To test drive your car, click on the green flag at the top of the stage area and then use the arrow keys on your keyboard to drive it around the track. Notice how the car goes slower when you go onto the grass!

If any of the arrow keys are controlling your car properly, go to the code for the arrow key and double check it is correct.


10

Add another track

Add another track to your game and switch to it by pressing the space bar.

Repeat the steps in 'Draw a racing track' above to draw another track.

To switch the tracks (backdrops) add the following code to your backdrop:

when [space v] key pressed next backdrop


11

Improve your game!

Have you any ideas on how you could improve your racing car game?

How about adding speed up lines to the track that would make your car go even faster? Think about how you would need to edit your track using the backdrop editor and what extra code you would need to add.

End of lesson
Copyright Notice
This lesson is copyright of Coding Ireland. Unauthorised use, copying or distribution is not allowed.

Scratch is developed by the Lifelong Kindergarten Group at the MIT Media Lab. It is available for free at https://scratch.mit.edu