In this project I will explain to you step by step how to make a Flappy Bird game in Scratch.

About Flappy Bird:

The inspiration for this project comes from the game Flappy Bird. The game was released in 2013 for the mobile phone.

The game is about a bird that is constantly falling, you can let it fly by tapping on the screen. You have to guide the bird through the obstacles by tapping. It is not allowed to touch the obstacles. In the meantime, the score is kept. The goal of the game is to get the highest score possible.

This game became a huge craze. Since the game was removed from the Playstore, many replicas have been made. This is one of them!

What is Scratch?

Scratch is a programming program on your Raspberry Pi . In this program you work with function blocks. This means that you do not write the programming text yourself. The blocks with the functions have already been made for you. You put these blocks in a diagram yourself. If you have downloaded the Raspbian software on your Raspberry Pi Scratch should be automatically on your Pi. If not, you must download it.

I program in Scratch on the Raspberry Pi 4 with 4GB. You can also program on the Raspberry Pi 3B+. You can also use the 1 GB or 2 GB with the Pi 4.

Are you programming in Scratch 2.0? Then you can still follow this tutorial. Keep in mind that certain functions may be in a different place. The images may also look different than on your screen. You can follow this tutorial because the code is the same.

Because this is a long instruction I have divided the explanation in subheadings. This makes it easier to find where you left off.

Change language.

Your program is probably in English. To follow the steps properly, it is wise to change the language in your program. You can change the language by clicking on the “globe” at the top left of your screen. This icon can be found next to the Scratch logo. Select Dutch.

On the side of the Raspberry Pi 4B are two Micro HDMI ports. Insert the Micro HDMI cable into the left port, and the HDMI end into a monitor or display.
Connect a keyboard & mouse to the USB ports and finally insert the power cable into the USB-C port.

Your setup is now ready to be booted.
When the Raspberry Pi starts up now you will see a desktop on your monitor. When you first start it up you still have to set it up, but that is explained step by step.

If you have used a different name for your Sprites, you should take that over.

1. Now we have made the code so that the top and bottom of your obstacle are visible on your screen at the same time (Figure 5). The position of the obstacles does not matter for now. The important thing is that they are both visible on your screen at the same time.
2. Your code will look something like this (Figure 6).

3. Position the obstacles

The aim of the game is for the obstacles to move from right to left across the game. Therefore it is wise to start the buildings as far to the right as possible. You can adjust this yourself if you want to make the game a bit more difficult.

1. Go to movement and place “go to X:– Y: — after” under the “change appearance to Above building.”
2. When you move the mouse over the screen you will see the X and Y values in the corner of your white box. These change when you move the mouse.
3. Play around with the values of X. If you fill in the value and press start you will see where it appears. Fill in the values that you are happy with. Don't see the obstacle? Click on your Sprite and go to the heading Appearances and click on Appear. If you click on this, you will see the obstacle. To determine which one you show, you have to click on appearance number 1 or 2 (which one you want to see).
4. You want the obstacles to be on top of each other. Also place a “go to X: — Y:– after” function for the bottom. When you are happy with the position of the top you can fill in the X and Y values for the bottom. Now they are on top of each other. For clarification, see the picture (Figure 7). As you can see I have placed the buildings on the side of the screen. These are on top of each other.

4. Move the obstacles

Now let's move the obstacles on the screen

1. Go to control and put the “repeat until” block after the if – then else block. This block checks if the condition is true or not. If the action is not true the program continues to the next block. If the action is true it plays the code in the repeat block.
2. We also make the buildings disappear when they pass the sprite. Take a “less than” block from functions. And place it in the empty box after “repeat until”.
3. Go to movement and grab the “X-position block”. Place it in front of the <50.
4. To indicate when you want the building to disappear, place the mouse on the left side of the screen. Choose the position when you want it to disappear. Read the X value from this. Go to movement and place the “X-position” before <50. Place the X value after <50 when you want it to disappear. You can also move the obstacle to the side of your screen to make it easier for you (Figure 8).
5. Go to controls and place the “remove clone” block after the “repeat until” function.
6. Now let's move the buildings to the left. Go to movement and place a "change X by 10" block and place it in the "repeat until" block. Change the value from 10 to -5. This value determines the speed at which the buildings move to the left. You can adjust this yourself to make the game harder.

What you have written so far: the bottom and top buildings appear. The Position of these buildings are indicated. If the X value is less than (in my case) -230 the clone is deleted.

Your code will look something like this (Figure 9):

1. Test for yourself whether the code works.
2. You can adjust the waiting time yourself. This determines how many seconds a new building is placed.

Now we will change the height of the buildings by adjusting the Y position.

1. We create a new variable. I'll call it for convenience: randomness Y height. This value is again only for this Sprite.

Then we create a random y position where the buildings are placed.

1. In variables, place the create “random Y height” in the ^1st programming block above in the repeat function.
2. Go to functions and put “random number between 1 and 10” in the empty variable box.
3. It is helpful if the buildings are well centered to each other. Go to looks and copy a building and place it with the others as in the picture (Figure 10).

1. To determine the center of the buildings, select both buildings with a square. Once you have done that, you will see a circle in the middle. Move this as close to the center of the box as possible. Move the buildings away from each other to determine the gap that your Sprite has to go through. If you are not completely satisfied with the distance between the buildings, you can adjust this later.
2. Now duplicate what you just created. Right click on the image on the left side of your screen. Then click duplicate. See (Figure 11).
3. Now that you have the same file twice, remove the bottom obstacle from one image. And from the other, the top. Now you have a top and bottom obstacle again, just like before. But now they are positioned next to each other.
4. Adjust the names again.
5. Now you should have a picture left that you can delete. Click the right mouse button and then delete.
6. Test your code as you can see my buildings are too short (Figure 12). If this is the case for you we will adjust this. Go back to suits and select your obstacle and all you have to do is stretch it a bit (Figure 13). This will make your obstacle longer and fit the entire screen.
7. Back to the code: position the maximum/minimum height you want the obstacles to start at. Place it at the bottom/top of the screen and measure Y values. Fill these values in at “random number between”. The top is 160 for me and the bottom is -160.
8. Still unclear where to place the obstacle? Take a look at this picture (Figure 14).

1. Go to Data. Place the “random Y height” on the Y in the “go to X… Y… block. Place this for the top and bottom of the building. Your codes will look something like this (Figure 15).
2. Test for yourself if the code works. You can still adjust the distance by changing the values in your code, play around with this a bit.
3. You can also adjust the size of your Sprite: Click on your Sprite, so that the code is displayed. Go to costumes and choose make size 100% put it under your “go to x: y:” and above the repeat function. You can adjust it to your own wishes (Figure 16).

Do you find that your Sprite is too still while playing? Then we can add some kind of animation just like with the real flappy bird.

1. Go to Controls and grab an “if then” block and place it at the bottom of the repeat block.
2. Go to motion and choose the “point to 90 degrees”. You can adjust this however you want. I choose 75 degrees. Place this under the “make gravity 10 function”.
3. Go to functions and grab a “less than” block and place it between the if – then
4. Then we go to movement and choose the “direction” function, which we set for the <50.
5. After the <50 we fill in 90. This stands for 90 degrees. 90 degrees was the starting position of the Sprite.
6. So if the direction is less than 90 degrees we want the sprite to move clockwise. For this we go to motion and grab the turn (clockwise) 15 degrees. I adjust the 15 to 3 degrees. See for yourself what you like as a movement. Place this in the “if then” block.
7. Your code will look something like this (Figure 17).

5. Loss of function

Then of course we need to add a loss function. Go to the code of your character.

1. Go to controls and place an if then block at the bottom of the repeat block.
2. Go to observe and choose the "do I touch (variables)?" check your obstacle here. Because I chose buildings from Scratch I choose buildings. Place this block between if-then.

Go to control and grab the stop all block and put it in the “if then” block. What you have written now means that the entire code stops when the sprite touches the (in my case) buildings.

1. Also, you lose the game if you fall too far down. Go to functions and grab an Or” block. Place the heading “do I touch —?” in the first opening of the or block. Then place the or block between if—then.
2. For functions, take the less than block and place it after the or function.
3. Go to movement and grab the Y position and put it in front of the <.
4. Place the Sprite to the bottom of the screen and measure the Y value. I measure Y value – 170.
5. Your code will look something like this (Figure 18).
6. Test for yourself whether the code works.
7. You will probably see the created variables on your screen. You can remove these by going to the variables header. Check the boxes next to the variable. Do this for your Sprite and obstacle.

1. Test if your code works, you will probably see that the score goes up by 2. This is because both obstacles are counted.
2. We are going to indicate that only one obstacle (above or below) is counted for the score. We now make sure that only the top obstacle is counted.
3. Go to functions and choose the "and" and equal block. Put the equal block in the last open spot of the "and" function.
4. Place for =Bottom of the Top/Bottom building variable.
5. Write to the = Above
6. Drag the long code between “if then” into the open space of the “and” function.
7. After the =, change to Bottom.
8. Drag the now long code next to the if function and place it before the and function. Then put it back in the same place.
9. Your code will look something like this (Figure 21).
10. The code you wrote checks if the Sprite has passed the obstacle. It also checks if it has scored yet. And it checks if the Top/Bottom is equal to Top. This means that it only counts the top. If all of this is true, the score goes up by 1.
11. You will see that the score does not reset when you start again. We change this by adding a variable before the start function (the flag). Make “score” 0 (picture 22).
12. Now remove the Variable “already scored” from your screen by checking the box.

Now you have created your own Flappy Bird game! Did you enjoy creating it? You can still expand the game. For example, you can add music and sound effects, or create multiple characters. You have already created the basis of the game and now you can completely customize the game to your own wishes. Have fun!