Group Details Private

Global Moderators

Forum wide moderators

  • Game AI for Flappy Bird (Difficulty: 2)

    Introduction


    Flappy Bird is a simple and fun game, where the player controls the bird to fly through a few obstacles to reach its nest. There is only one control: press the SPACE key to make the bird flap.

    In this tutorial, you will learn to build a simple AI program to control the bird instead of manually.

    Note that this AI will be based on programming logic, rather than large language models (LLMs). That is due to 3 reasons:

    • LLMs are too slow for such tasks: it usually takes a few seconds for LLMs to respond to each request, but we need to make the bird react and flap with a precision of milliseconds.
    • LLMs are too unpredictable: LLMs are inherently random, and it is often hard to control them to generate precisely the same output every single time. In contrast, programming logic is much more predictable and reliable.
    • LLMs are too expensive: It takes a lot of computation, and hence energy, to generate even a very simple output. To avoid such waste, when we can use programming logic to make a decision, we should do so.

    The same argument also applies in many other situations, and that’s why a significant portion of AI systems will continue to be implemented using programming logic.

    Now let’s get started with this simple AI program.


    Step 1 - Remix the Starter Project


    Open this link and remix the project:

    play.creaticode.com/projects/684dbd401c49cae4509533bd


    Step 2 - Read the Existing Code for “AI”


    In the “AI” sprite, there are 2 stacks of code.

    First, when the green flag is clicked, 3 parameters are set:

    • How many columns (green pipes) are placed before the nest.
    • The gravity for the bird’s falling speed;
    • How much the bird rises up on each flap.

    AI parameters

    Below that, when the “start” message is received, this AI program will simply send out the “flap” message every 0.3 seconds. Each “flap” message will make the bird flap once. This is the most basic AI program, which we will improve in the next few steps.

    Flap loop


    Step 3 - Adjust the Game Settings


    When you click the green flag, you will find that the bird will fall to the ground. The falling speed will depend on your computer, but it will look similar to this:

    Bird falls


    This is because the “gravity” and “flap strength” are not fine-tuned yet. As an exercise, please adjust these 2 values. In general, “gravity” should be a number between 0 and -2 (such as -0.5), and “flap strength” should be a number between 4 and 20. Your goal should be to make the bird fly horizontally with a nice waveform trail like this:

    Wave flight


     

     

    Step 4 - A Shorter Wait Interval

     

    Currently, in the forever loop, we send out the “flap” message every 0.3 seconds, and the bird will stay at the same height. Suppose we want the bird to fly higher, then we need to use a shorter interval.

    Instead of 0.3 seconds, let’s use an interval of 0.03 seconds. This may be necessary if the bird needs to rise up very quickly.

    Change delay

    As a result, when you run again, the bird should reach the ceiling very quickly and stay there:

    Bird at top

     
     

    Step 5 - Skip some flaps

     

    Obviously, the current AI always makes the bird fly too high. A simple solution is to skip some flaps, so the bird will do a free fall to reach nests that are below its level.

    In general, to make smart decisions, an AI needs relevant sensing data. In this case, to determine whether the bird needs to fall a bit, we can compare these 2 variables:

    • The bird’s Y position
    • The Y position of the nest

    Your AI can access these 2 values using these 2 reporter blocks:

    Y sensing
     

    Now, can you change the forever loop so that the bird would not flap if it is already above the nest?

     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     

    Here is one way to do it: we put the broadcast block inside an “if-then” block, so only when the nest is above the bird would the bird make a flap:

    If nest is above

    Try to run the program a few times. The nest is placed at random heights, but the bird will almost always rise or fall to its level quickly:

    Bird matches nest

     
     

    Step 6 - Add a few columns

     

    Now let’s move on to the next challenge: make the bird fly through the columns (pipes). Change the “columns” variable to 4, which will add 4 columns:

    Set to 4 columns

    Obviously the bird will crash with the columns and fail. What can we do?

     
     

    Step 7 - Fly through all columns

     

    Similar to above, we need to provide data to the AI. Specifically, here are information about the columns:

    1. Each column has an opening at its center, and the Y positions of these openings are stored in the list named “columnYs”.
    2. The number of columns is given in the variable “columns”.
    3. The upcoming column has an index of “nextColumnIndex” in the list. For example, when the bird is facing the first column, nextColumnIndex is equal 1. After the bird flies through it, nextColumnIndex will automatically increase to 2.

    With these information, can you try to make the bird fly through all the columns? Don’t worry about the nest for now.

     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     

    In fact, all that we need to do is to replace “nestY” with the Y position of the upcoming column:

    Use columnY

     

    The bird should have no problem flying through all columns:

    Success with pipes

     

     

    Step 8 - Fly to the nest after all the columns

     

    For our last step, we need to combine our solution for columns and the nest. When the bird has passed the last column, the nextColumnIndex will be more than the columns variable, and that’s when we should target the nest instead. Can you implement this change?

     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     

    Here is an example solution:

    Switch to nest after pipes

    Here is the final demo:

    Final full run

     
     

    Extra Practices

     

    To practice what you have learned, here is an additional challenge for you.

    Currently, the bird would only start flapping if it is below the target height (of the nest or the center of the opening), so it might fall too much below the target. If the target is very low, then the bird might touch the ground before flying back up.

    Bird too low

    To ensure the bird is always safe, it should start to flap if it is too close to the ground (Y of -240).

    posted in Tutorials
  • RE: Scroll wheel should be use as zoom instead of scroll in Creaticode Create

    @tyller_

    Currently, the playground already supports both:

    • Ctrl + Wheel: zoom in or out
    • Shift + Wheel: scroll left or right

    And these are the same for MIT Scratch.

    posted in Feedback
  • Introducing the Newly Enhanced Cloud Variables

    Hi all,

    We have made some exciting new enhancements to cloud variables. The description is on this page: https://www.forum.creaticode.com/topic/1997/newly-enhanced-cloud-variables

    We will post new tutorials on multiplayer games using this new feature as well. Please feel free to give us your feedback on this.

    Thank you
    CreatiCode

    posted in Feedback
  • RE: left click should be drag in sprite creating area

    @the_true_odst

    Got it. We’ll check why it happens on chromebooks.

    posted in Feedback
  • Newly Enhanced Cloud Variables

    Introduction

     

    Cloud variables are a powerful tool in MIT Scratch for creating multiplayer programs. CreatiCode has enhanced them further, making them even more capable. In this tutorial, you’ll learn how cloud variables work in the CreatiCode playground.

     
     

    Basics of Cloud Variables

     

    When creating a new variable, you can check the “cloud variable” box:

    f702479b-a596-4ae5-b146-caf71bb4fce8-image.png

    If the project is shared and opened by other users, the value of that cloud variable will be synchronized across all their computers automatically.

    For example, imagine 10 users are running the same project at the same time. If one user changes the value of a cloud variable, the other 9 users will instantly see the updated value.

    Here’s what happens behind the scenes:

    1. User A changes a cloud variable using a “set variable to” or “change variable by” block.
    2. User A’s computer sends the new value to the CreatiCode server.
    3. The server broadcasts the update to the other 9 users running the same project.
    4. Each of those users receives the message and updates the cloud variable on their own computer.

     
     

    A Simple Example

     

    Here is an example project: play.creaticode.com/projects/68473cea3d952dd83a76d160

    It has one dog sprite with this code:

    3306fac4-3758-4577-8c80-213ef1781d5b-image.png

    When the program starts, the sprite keeps saying the value of the cloud variable “counter.”

    Whenever any user clicks the sprite, the value of “counter” increases by 1— and all other users running the same program will instantly see the new value.

    You can try this by opening the project in two browser windows (one normal and one incognito). Make sure you’re logged in, as cloud variables only work when you’re signed in. Of course, you can also try this with a friend on 2 computers.

    Here’s what it looks like across two sessions:

    cloudcounter.gif

     
     
     
     

    The “When Variable Changes” Block

     

    To make working with variables easier — especially cloud variables — CreatiCode has added a new event block:

    005ee1af-8126-487d-ba3c-e0ef2949e773-image.png

     

    This block runs whenever the selected variable changes (i.e., when its value becomes different). Note that if you set a variable to its current value, then this block won’t be triggered.

    It works with both regular and cloud variables. This means you no longer need a forever loop to constantly check the variable — you can run code only when the value actually changes.

    Here’s how we can rewrite the earlier example using this block:

    468d02fa-7699-44ef-9cbe-d9faa9608c38-image.png

    1. When the green flag is clicked, start a long wait so the program stays running. Cloud variable updates won’t work if the project isn’t running.
    2. When the sprite is clicked, increase the counter as before.
    3. When the counter changes, the sprite says the new value.

    You can try it here: play.creaticode.com/projects/684747163d952dd83a76d79c

     
     
     
     

    Number of Cloud Variables

     

    MIT Scratch limits you to 10 cloud variables per project. In CreatiCode, you can use up to 100. This allows you to build much more advanced multiplayer projects.

     
     
     
     

    Accepted Values and Update Frequency

     

    In MIT Scratch, cloud variables:

    • Can only store numbers
    • Can only update at most 10 times per second

    These limits were put in place to block users from building chat rooms, but they also make cloud variables harder to use.

    In CreatiCode, cloud variables support any type of value, with some important rules:

    • If the value contains letters (a–z), it must pass a moderation check to filter inappropriate content. These values can only be updated once per second per user. That’s still fast enough for chat room projects.

    • If the value does not contain letters, like 120 or "1_23_44", it bypasses moderation and can be updated up to 20 times per second per user. This is useful when you want to send multiple numbers in a single update. For example, to send X = 50 and Y = 80, you can combine them into one value of "50_80".

     
     
     
     

    Cloud Sessions

     

    In MIT Scratch, everyone running the same shared project receives the same cloud variable updates. To isolate groups, you’d have to make separate copies of the project.

    CreatiCode introduces cloud sessions, which limit cloud updates to just the users in the same session. If a user hasn’t joined a session, they’re placed in the default session.

    To join a session, use this block from the “Variables” category:

    d63c717b-72f7-479a-9595-71597766c20a-image.png

    This block takes about 1.5 seconds to run and should be used before updating any cloud variables.

    The session name is just a string that users agree to use. Only users in the same session will receive each other’s cloud variable updates—even if they’re running the same project.

    Here’s how to add the block to our earlier example:

    5371c2af-6f92-4375-a57a-cd55b3c0468a-image.png

     
     
     
     

    Private Cloud Variables for Clones (Advanced)

     

    In MIT Scratch, cloud variables are always global — shared across all sprites and clones. This creates problems when you’re working with clones.

    For instance, suppose a car sprite creates 2 clones: Clone 1 and Clone 2. If you use a global cloud variable like “facing direction,” then changing it to 90 will affect both clones — even if you only meant to rotate one.

    To fix this, CreatiCode lets you create private cloud variables for each sprite or clone:

    86ec028f-9c73-4591-8462-e4d99ee35191-image.png

    Now, each clone will have its own cloud variable, separate from the others. For example, all users’ “Clone 1” will share one variable, and “Clone 2” will share another.

     
     
     
     

    Example for Private Cloud Variables

     

    Here is an example project: play.creaticode.com/projects/6847575f1c49cae45091d685

    When the green flag is clicked, the original dog sprite hides and creates two clones, with IDs 1 and 2:

    20485574-7fe3-4327-97e4-d87f6cfbd749-image.png

    Each clone shows itself, says its clone ID, and moves to one side of the stage:

    884f5fda-d4cd-4209-8005-176279dc4986-image.png

    Now, when a clone is clicked, it increases its own private cloud variable called “direction” by 15. This triggers only that clone to rotate:

    dcf57267-c6f6-4929-ac99-c27ede0e9f1c-image.png

    As a result, when any user clicks on a dog clone, that specific clone rotates on every computer — but the other clone is unaffected:

    cloudcounter.gif





    We hope you enjoy these new features, and we can’t wait to see the amazing multiplayer projects you’ll build with them!

    posted in 2D Blocks
  • RE: left click should be drag in sprite creating area

    @the_true_odst

    What device/browser are you using? Have you tried to restart the browser?

    posted in Feedback
  • RE: How to find "If Shift key pressed" posted in Help
  • RE: Scroll wheel should be use as zoom instead of scroll in Creaticode Create

    @the_true_odst

    The scroll wheel is used for scrolling up and down to view the blocks, which is similar to the MIT Scratch interface. We strive to be consistent with MIT Scratch, unless there is a compelling reason to improve upon it.

    posted in Feedback