Simple Catch Game in Scratch using Teachable Machines
Let’s create a catch game in Scratch using Teachable Machine. Scratch is a coding platform for everyone and was created at MIT Media Labs. You can make cool games, animations, art, and a lot of cool stuff + it’s super easy!
Teachable Machines by Google is an amazing tool that gives people the power to create and play with machine learning (ML) models. Currently, it provides three types of ML models — image classification, audio classification, and pose classification (Posenet).
We will use Posenet to control our character to catch falling fruits for our game. We will call our game Paetoo! (In Hindi, it means the one who likes to eat).
Our final game will look something like this:
The game can be broken into the following steps:
- Select a character and create its walking animation
- Controlling the Character movement
- Randomly dropping the fruit from top
- Catching the fruit and score
- Adding character control using Teachable Machine Posenet (for our final output)
Before controlling our character with the pose, let’s create a basic keyboard-controlled game, as follows:
Step 1: Selecting a character and its walking animation
Select any sprite of your liking that is animated. You can give it a name as well. I selected Pico Walker and named the sprite “Paetoo.” Place it at y = -109 position.
This sprite has four costumes for walking animation
Select the Pico walker sprite and create a walking animation for the character using the following code:
Next, we can create a block for walking that will be called whenever the character moves using the arrow keys on the keyboard.
Step 2: Controlling the character movement
Here’s the code for character movement in a magnified format. Make sure to use this with the character sprite selected (in my case Pico Walker):
I tried using a “move__” block to control the character's movement, but it led to a diagonal movement. Hence I used the “change x by__” block.
Step 3: Randomly dropping fruit from the top
Select another sprite, say a food item, that will fall from the top and will be caught by the character. I selected a strawberry. This strawberry will fall from random locations, and the character has to move to catch it.
We can use a random function to make the strawberry appear in random locations and set the y-axis to 180. According to the Scratch coordinate system, the range of the Y position is from -180 to 180. We want the fruit to fall, disappear when it reaches the bottom, and reappear when from a random top location. It can be achieved from the following code. Select the food sprite for this code (I'm using Strawberry sprite here).
Next, we want the to sense went the strawberry touches the character. We will use the sense block for this.
Next, we will create a variable called Score. And select the tick mark next to it to display it on the main output.
It will be initialized to zero every time the code starts and is incremented by one whenever the strawberry touches the character. Hence the above code block becomes:
Step 5: Controlling the character using Pose
In the teachable machine, select the Pose project option:
Train the model. I created three classes (Middle, Left, Right). The steps are simple. Create a class, and train the model. The output from training looks like this:
Next, we’ll export this model and copy the url.
In scratch, add Teachable Machine extension.
Drag the use model block to the main program and replace “key pressed” in if conditions with “prediction is___” block
Paste the URL from Teachable Machine and wait for the exclamation mark to turn green after clicking the flag event.
Download the final code here: https://drive.google.com/file/d/1VC65WmJ3gGcdvHu9lkuZYlPfT0dVVass/view?usp=sharing