Designing and building your own computer game requires programming and graphic design skills. Now don’t get intimidated by this tech speak. As we tell everyone at Coding Kids, game design is a skill that can be learned and acquired through exploration and practice.
Game design is a fun and creative activity that involves storytelling, vivid imagination, problem solving, tactile and cognitive tasks, and can be completely collaboratively or solo. Plus you get the benefit of sharing a game you made yourself with family and friends.
If you have never done any computer programming before, the Scratch website is a great place to start. Scratch was developed by Massachusetts Institute of Technology (MIT) specifically to teach children computer programming concepts in an easy and fun way.
Let’s use Scratch to build our first computer game. First let’s explore the Scratch interface so we can learn how to use it.
- The top left corner is called the game screen or the stage. This is where we view what our program or game looks like.
- The right half of the screen is the workspace. This is where we save our code blocks and give commands or instructions to the computer.
- The centre column is where you can find blocks. We use blocks to build our code and give commands to the computer. The blocks are stored under categories e.g. looks, sounds or motion.
- On top of the centre column of blocks we can see three tabs: “Scripts”, “Costumes” or “Sounds”
a. We save our code in the “Scripts” tab
b. We can see and make changes to the sprite’s costumes in the “Costumes” tab
c. We can add sounds from the sound library in the “Sounds” tab
- The bottom left corner is where we can see which sprites we are using for our program or game. A sprite is a character or an object in our program or game, e.g. a cat or a frog. We can draw our own sprites or pick one from the sprite library.
- Left of the sprites you can see a small rectangular backdrop icon. This is where we go to add or change backdrops.
We’re going to build a game called “Leap over the frog”. The aim of the game is to get your cat jumping over the frog so that you don’t touch the frog. When you touch the frog it is game over.
In the “Leap over the frog” game we need two sprites and two backdrops. The two sprites that we need are: the cat and the frog. The two backdrops that we need are: brick wall backdrop and game over backdrop.
The cat sprite is default. We find the frog sprite in the sprite library. The brick wall backdrop can be found in the backdrop library. We create the ‘game over’ backdrop by duplicating the brick wall backdrop and then adding a textbox to write “Game Over” onto this new backdrop. All the items in the sprite or backdrop library are stored in alphabetical order. This makes it easier to find what you are looking for.
We can break down writing the program into three parts: the cat, the frog and game over.
How to program the cat:
- When the green flag is clicked we want the cat to start at the start position (x: 0, y: -60) and the brick wall backdrop to appear.
- When the space key is pressed, we want the cat to glide upwards (glide to x: 0, y: 150) and then glide downwards (glide to x: 0, y: -60).
How to program the frog:
- When the green flag is clicked, we want the frog to start on the right side of the screen (go to x: 271, y: -84), glide to the left side of the screen (glide to x: -240, y: -84), then start again at the right side of the screen.
- We want the frog to do this forever, until game over. We use a “forever” block to get the program to repeat the commands for the frog forever.
How to program game over:
When the cat touches the frog we want the game to switch to the game over backdrop and stop the program. We do this by using the “if” block, “touching” block, “switch backdrop” block, “stop all” block and “forever” block.
There you have it. You have just built your first computer game! Now you can share your computer game by sending the link to your family and friends. Building computer games is a fun and creative way of learning valuable computer programming skills.
Check out our other game design instructions:
Animation greeting e-card
Kinda like Breakout game