Learn how to pop balloons, splat flies or even catch hearts with our webcam video game guide, for ages 7+!

For this guide we’ll be using the FREE online software Scratch. With Scratch, you can program your own interactive stories, games, and animations — and share your creations with others in the online community! In this workshop we’ll be learning how you can use the webcam to bring your video games into the real world, and start to move around the room to play your games.

What you’ll need to get started

  • Computer with a modern browser and a built in webcam
  • An internet connection
  • A pair of headphones
Scratch is designed especially for ages 8 to 16, but is used by people of all ages. Millions of people are creating Scratch projects in a wide variety of settings, including homes, schools, museums, libraries, and community centers.

Help Support Signals

Get Started

Step 1. Visit Scratch Online

To begin we’ll visit www.scratch.mit.edu and then click on the CREATE button at the top of the screen.

Step 2. Add Video Sensing

For this video game we’ll be using “video sensing” meaning that Scratch will need to access your computers web cam. To do this you’ll need to add a special extension called Video Sensing.

First, click on the blue and white button in the bottom left.

Then, click “Video Sensing” from the options that appear on the screen.

Click add extension

 

Select the video sensing extension

Step 3. Controlling our Sprite with Motion

When you option Scratch, your default Sprite (the character you control) is their cartoon cat. In scratch all our code lives within the artwork its controlling.

In this game we’ll be making our sprite move as soon as we “touch” it with our hand. To do this first the computer needs to know if theres been any movement in the area of our sprite, for that we used the “when motion > ( )”.

> is another way of writing greater than, so if you change the number next to it it’ll make the game more or less sensitive.

 

First we need to check if theres anything motion in the area of our sprite.

Step 4. Adding a Score

Now we’ve got the game sensing motion, we can make things happen as a result! For example, we can add a score by creating a variable called score. To do this, simply select ‘make a variable’ in the menu on the left.

Step 4. Make it Challenging

Add a challenge element to your game by making the sprite move randomly around the screen after its been touched! To do this, add the “go to random position” after your score block.

Scratch also has some fun visual effects – in the example I’ve made it change colour too!

Your code should look something like this

Step 5. Add a Timer

Lets make the game even more challenging, adding a timer! For this we’ll need to add a second variable (called timer), and we do it the same way we added score.

You’ll need to SET the timer to 30 when the game begins and then CHANGE this timer by -1 every second.

Add a timer to your game

Step 6. Change your Sprite

Currently your game is still using the cat artwork, so lets customise this to something more exciting! First off, click costumes in the top left of your screen, then click on the BLUE CAT in the bottom left.

Now, select a new piece of artwork from the library – I’ve gone for a balloon for mine.

With your new artwork selected, now we can delete the unwanted ones. Hover of the cat sprites to see the TRASH CAN and click this to delete them.

Click costumes to open the sprite library

Select a balloon (or something else) sprite

Click on the trash can over the cat to delete the old artwork, leaving just the new one

Leaving just your new artwork on display

Step 7. Change your sounds

So now we’ve got some new artwork, but we’re still using the same cat sound! So lets get that changed. To do this its a lot like changing your artwork.

Begin by click SOUNDS at the top, then click on the SPEAKER icon in the bottom left to to open the sound library.

Next, select a sound that matches your sprite. I’ve picked a POP sound so it’ll be like i’m popping the balloon each time I touch it. Make sure you delete the sounds you’re no longer using, in the same way you deleted the artwork.

Lastly, don’t forget change the sound in your code so its playing the right sound each time that bit of code is triggered.

Click the SOUNDS tab and SPEAKER icon at the bottom

Pick your sound from the library

Don’t forget to delete the sound you’re no longer using.

Update your code so it plays the new sound

Step 8. Play your game!

Congratulations, you’ve finished a balloon popping video game! How could you improve on this design? Perhaps add a second sprite to pop? Or something you have to AVOID which takes points away if you pop it?

If you think you’ve missed something – then click here to see the finished code which you can compare against yours.

Make sure you share your creations with us on our social media channels, we love to see what you’ve made. Simply get in touch on facebook, twitter or instagram.

Looking for more creative project ideas?