Teach your kids to code with Scratch

Developed more than a decade ago at MIT, Scratch allows you to create games, interactive stories or animations without having to enter a single line of code.

Instead, Scratch provides virtual, Lego-like building blocks of commands that can be snapped together to create reasonably sophisticated programs.

How sophisticated? Well, one user has utilised Scratch to code a near-identical version of the recent hit app, Flappy Bird, which you can play here.

Scratch’s great strength is that it familiarises children with programming concepts – such as loops, variables and strings – without their even knowing it. They simply learn the concepts through trial-and-error testing with the various commands available when building their own games.

There’s an enormous wealth of online resources to help teachers, parents and children get started with Scratch, many of which can be found on the project’s website. Here, you’ll be able to access written tutorials, video guides and – perhaps most usefully – a vast gallery of Scratch projects.

Open these and examine the scripts to see how they’ve been programmed.
Scratch’s open-source ethos means anyone is free to make a copy of someone else’s project and modify it, even if the modifications are as minor as changing a few colours. The only condition attached is that the original creator should be credited in the so-called “remix”.

Scratch was originally a standalone executable, but now it can be run within the browser from the Scratch website, with all projects saved in the cloud. There’s still a downloadable, offline version available for PC, Mac and Linux with which projects can be saved locally, or uploaded to the Scratch website (once registered). We prefer the offline version because it’s more responsive – particularly on slow broadband connections.

Teach kids to code by making a game in Scratch

Below, we’ve created an eight-step walkthrough, showing how to create a basic, Space Invaders-like game called Seagull Splat. We have only enough room to show you how to program the basic mechanics of the game and get to grips with how Scratch operates.

But with the skills and techniques you’ll develop in these eight steps alone – or with a little additional help from the in-app or online tutorials – you should be able to develop further features yourself, such as making the cat disappear, and ending the game if the birds strike the cat or reach the bottom of the screen. Why not add sound effects and a scoreboard, too?

By tweaking the variables, you should also be able to make the game harder, by making the birds move more quickly or slowing down the cat. You could also shrink the birds and increase the number of them.

Step one: Set the scene

Using the online version of Scratch, click File | New from the menu. First we need a beach scene. Under New Backdrop in the bottom-left corner, click Choose Backdrop From Library and select “Beach Malibu”.

Or, as we’ve done, choose your own digital photo by clicking on the Upload button. The cat character is too big, so resize him by clicking on the Shrink button in the top panel and clicking on the cat
a few times.

Step two: Make the cat move

Click the Scripts tab, then the Cat sprite, then click Events. Drag the “when space key pressed” block into the right-hand window, then click Motion and drag a “point in direction” block directly underneath it. Select “left arrow” and “-90 (left)” from the relevant dropdown menus. Now drag a “move 10 steps” block beneath the other two. Repeat as shown to make the cat move right.

Step three: Stop the cat flipping

Click on the cat in the top-left window and drag him to the foot of the scene. Now click on the green flag to run your program, and press the arrow keys to move the cat. You may find he flips on his head as you change direction.

To correct this, click on the blue “I” in the top-left corner of the cat’s Sprite window, and change his rotation style to “left-right” by clicking on the opposing arrows icon.

Step four: Bring on the birds

Click on the “New sprite from library” icon (it looks like a boy with big hair), and select Dove1. Shrink the dove and drag it to the top of the screen.

To make it move automatically, click Scripts, Events and then drag a “when green flag clicked” block into place. Under Control, snap a “forever” block beneath it to make sure the action is repeated, then insert “move 10 steps” and “if on edge, bounce” blocks as shown.

Step five: Make the bird drop

If you click the green flag, you’ll see the bird bounces from side to side, but doesn’t drop, in Space Invaders style, when it hits the edge.

To do this, we need to amend our dove script with a “broadcast” to move down, so that when a dove touches the edge of the screen, he and all other doves drop down the screen. We do that by amending the dove’s script as shown in the screengrab.

Step six: Duplicate and reset the birds

Create three birds that use the same script as our original by right-clicking on the dove and selecting Duplicate. If you click the green flag and stop the game, the birds’ position doesn’t reset.

To do that, drag each bird to where you want it to start, note its x and y co-ordinates, and insert a “go to” block beneath “when green flag clicked”. You’ll need to change each bird’s script individually.

Step seven: Create the laser gun

Now to create the bullets to fire at the birds. Click the “Paint new sprite” icon in the Sprites window, and design your ammo. We’ve chosen a thin red line for a Star Wars-style laser, but you might choose a different design.

If it comes out too big, shrink it. Once done, click Scripts and enter the blocks shown, which tell the bullet to appear, go to the cat, and move up the screen when the spacebar’s pressed.

Step eight: Make the shot birds vanish

If you click Go now, the bullets fire, but go straight through the birds. To rectify that, click on Dove1, and enter the code shown to tell the dove to hide if touched by Sprite2 (the bullet).

Right-click the top of the new stack of blocks, click Duplicate, and drag to each of the other two doves’ sprites, then left-click to copy to their scripts. Now try to devise a script for Sprite2 to hide the bullet when it hits the birds.