We’re making Flappy Bird in Scratch
If you don’t know Flappy Bird, try it here: https://flappybird.io/
We’ll start a new Scratch project by going to https://scratch.mit.edu/ and clicking "Create"
We’re making a new project and start by deleting the cat.
Then we click the Paint/Draw button.
Now we’re in drawing mode for a new sprite, where we select the circle tool.
You can pick another color by clicking Fill and adjusting the sliders.
A flappy bird is really just made of a bunch of circles, so start by drawing its body with a long purple oval.
Then make a white circle for the wing and another white circle for the eye.
Use the brush tool to make a dot in the eye.
Make an orange circle for the beak.
Notice that we are in the costumes tab. You can make code by clicking the other tab.
By dragging blocks into the code area, we can make gravity. Drag in “when green flag clicked” to start a new sequence of code. This sequence will be responsible for our gravity behavior. In the sequence, we use a “forever” and a “change y by” block to make our sprite fall downwards.
To get real gravity, we need to accelerate toward the ground. We do this by having a variable that determines the speed toward the ground. Create a new variable by clicking “Make a Variable,” and call it upSpeed.
In our block sequence, drag a variable block into “forever,” so that upSpeed gets larger in each loop cycle. Then we change y by upSpeed.
Now our gravity works!
But to reset our character to the start, we need to make a new block sequence. Drag in another “when green flag clicked,” then drag in a “go to x, y” block and set it to 0,0. This resets our position.
Also reset our variable to 0.
Then we make a third block sequence, where pressing the space key starts the code. We set upSpeed to 10, which makes our character go upward.
Our code should now look like this:
Click on new sprite and then click on Draw/Paint.
Choose a green color and a black outline.
The obstacles in Flappy Bird are really just rectangles that look like pipes. Use the rectangle tool.
Draw a few more rectangles so you have an obstacle.
You can leave drawing mode/costume mode by clicking the Code tab.
First, we make a block sequence that places our obstacle at the right side (x position 250 or similar).
Then we make another block sequence that moves our obstacle to the left (the negative x-direction).
Finally, we make a block sequence that moves our obstacle back to the right side of the screen once it reaches the left side.
Our code should now look like this:
Make sure our sprites are named so it makes sense. You can change the name by typing in the “Sprite” field.
Start a new code sequence on the obstacle sprite! Use a “forever,” an “if,” and then use “touching” and select pipe. If true, then “stop all.”
The basic elements of Flappy Bird are now complete! We can play the game.
Our obstacle code on the pipe should now look like this:
Our Flappy Bird code should now look like this:
To make your game harder, we can add the beak swinging. It will tilt toward the ground when we don’t press the space key.
Go to Motion and find turn.
Then drag the turn block into the forever loop so it continuously turns counterclockwise. Check what happens in the game!
We also want it to tilt upward when we press space. Take a point in direction block, click the number, and choose a slightly upward direction.
We also need to reset the direction when the game starts.
Your code for the bird should now look like this:
Something else that can make the game harder is if the pipes aren’t always in the same place.
Here we won’t give you the full answer, but just a block:
You can find it under Operators.
You need to find a place to put it in.
Think about what determines the height of your pipes.
You’ll also need to make your pipes longer. Go into Costumes and drag the box.
Once you get it working, it should spawn like this:
Now we might think it’s time to have more pipes for the player to go through, so the distance between them is shorter.
We simply need more pipes, so let’s copy our pipe sprite.
Then we need to hide and “pause” one of our pipes for a short time, and then show it again. This way it appears slightly offset.
First, find hide in Looks.
Then use a wait seconds block.
And then show the sprite again.
You can combine the three blocks like this:
Now the challenge for you is to figure out where to place these three blocks.
Remember: we also need to stop this copy of the pipe from moving left during the wait.
We want to find out who is the best, so we better find a way to count the points.
You should create a new variable called “points”, and then add blocks so we increase it every second:
But as a challenge, maybe you could instead make, for example, an apple sprite that increases our points when we touch it?
Then reset the apple back to the right side, just like a pipe that moves left and resets if the player hits it.
Think of it as combining what you’ve done with the pipes with a points-giving object.