Navigation

    CreatiCode Scratch Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • CreatiCode
    1. Home
    2. info-creaticode
    3. Posts
    • Profile
    • Following 0
    • Followers 16
    • Topics 435
    • Posts 1138
    • Best 394
    • Groups 6

    Posts made by info-creaticode

    • 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
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • RE: How to find "If Shift key pressed"

      @the_true_odst

      Yes.

      posted in Help
      info-creaticode
      CreatiCode
    • 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
      info-creaticode
      CreatiCode
    • RE: left click should be drag in sprite creating area

      @the_true_odst

      The left mouse button is indeed used for dragging the editor area. Are you seeing otherwise?

      posted in Feedback
      info-creaticode
      CreatiCode
    • RE: How to find "If Shift key pressed"

      @the_true_odst

      Sure. We can probably add it to this block:

      04cf5932-1b6c-41f0-9367-685b1dd58dba-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • RE: New block -- "When stop sign pressed"

      @the_true_odst

      The stop button is meant to simply stop the program. It would be strange if it doesn’t.

      Probably you can just add a “restart” button for this purpose?

      posted in Feedback
      info-creaticode
      CreatiCode
    • Getting Started with CreatiCode

      Welcome to the CreatiCode Playground

       

      The CreatiCode Playground is a fun online platform where you can create and share projects using Scratch blocks. It builds on the open-source MIT Scratch framework but adds exciting new tools and features to make your projects even more awesome!

      This tutorial will guide you through the basics of using the CreatiCode Playground, perfect for beginners to block-based coding. If you’ve used MIT Scratch before, it is recommended that you quickly skim through and check out what’s different.

      Let’s dive in and get started!


       
       
       
       

      Create a New Account with Email and Password

       

      Good to Know: If you have a Google email, you can sign in directly without creating a new account!

      Here’s how to sign up using an email and password:

      1. Go to creaticode.com.
         
      2. Click the “Join” button in the top-right corner.
        Join Button
         
      3. Choose whether you’re a student or a teacher.
        Student or Teacher
         
      4. Fill out the sign-up form with your details, then click “FREE SIGN UP”.
        Note: The “Full Name” field is your username, and it doesn’t have to be your real name.
        Sign-Up Form
         
      5. If you’re 13 or younger, you’ll need to provide a guardian’s email (like a parent or teacher). Your account won’t work until your guardian approves it.
        Guardian Approval

       
       
       

      Sign In to Your Account with Email and Password

       

      Here’s how to sign in using your email and password (created by you or your teacher):

      1. Visit creaticode.com.
         
      2. Click the “Join” button at the top.
         
      3. On the next page, click “SIGN IN” in the top-right corner to open a dropdown menu.
        Sign-In Dropdown
         
      4. Enter your email and password, then click “Sign In”.

       
       
       
       

      Sign In with a Google Account

       

      If you have a Google account (like a Gmail or school email), signing in is super easy — no need to sign up!

      1. Go to creaticode.com.
         
      2. Click “Join” in the top-right corner.
        Join Button
         
      3. Click “SIGN IN” in the top-right corner, then select the “Google” button in the dropdown.
        Google Sign-In
         
      4. Enter your Google email and password to sign in.

      Tip: Always use the same sign-in method (either email/password or Google) to avoid any mix-ups.


       
       
       
       

      Explore Projects from the Community

       

      Scratch — and by extension, CreatiCode — is all about Create → Share → Remix! You can make a project (like a game), share it for others to play and give feedback, and even let others “remix” it to create their own versions. It’s a fun way to inspire each other!

      To check out projects shared by others:

      1. Click the “Explore” link at the top of the page.
         
      2. The top four rows show Editor’s Pick projects — cool demos that highlight what you can build on CreatiCode.
        Explore Projects
         
      3. Below those, you’ll see all community projects. Use the two dropdown menus on the right to sort them:
        • Time Period: Choose a timeframe, like the past month or year.
        • Sorting Method: Pick how to sort projects:
          • Trending: Most likes.
          • Popular: Most views.
          • Recent: Newest projects.
          • Inspiring: Most remixes.
            Sort Options

       
       
       
       

      Understand Project Stats

       

      Each project has a preview image with three key stats below it to give you a quick idea of its popularity and complexity:

      • Love Count: How many users clicked the heart button to mark it as a favorite.
      • View Count: How many times the project has been played.
      • Block Count: How many coding blocks are in the project. A higher number usually means a more complex project.
        Project Stats

       
       
       
       

      Search for Community Projects

       

      With so many projects in the community, searching helps you find exactly what you’re looking for! Here’s how:

      1. Type a keyword (like “car”) in the search box and press Enter. You’ll see projects with that word in their name.
        Search Bar
         
      2. Click the small triangle in the search box to add filters, like finding only 3D projects or projects with a specific number of blocks.
        Advanced Search

       
       
       
       

      Check Out a Project’s Home Page

       

      When you click on a project, you’ll land on its home page, which has everything you need to explore it. Here’s what you’ll see (from top to bottom):

      • Green Flag: Click this to play the project.
      • Remix Button: Make your own copy of the project to edit.
      • See Inside Button: Peek at the project’s code blocks and assets in the editor.
      • !Report: Flag the project for the CreatiCode team if it has anything inappropriate.
      • App Link: Send a link to the project as an app via email.
      • Project Link: Get a direct link to the project.
      • Comments: Share your thoughts (like compliments or ideas) and read what others have said.
      • Remixes: Check out other users’ versions of this project, created by copying and modifying it.

       
      Project Home Page


       
       
       
       

      Remix a Project

       

      Want to put your own spin on a project you like? It’s easy!

      1. Click the orange “Remix” button on the project’s home page.
      2. A copy of the project will appear in your CreatiCode Playground.
      3. Make any changes you want, then share your version with the community!

       
       
       
       

      Share or Publish Your Project

       

      Your projects are private by default, so you can experiment without anyone seeing your work. When you’re ready to show it off, you can share or publish it.

      • Sharing lets others play your project, view its code blocks, and remix it. This is called “open-source” because the code is open for everyone to see and use.
      • Publishing lets others play your project, but they can’t see the code or remix it. This is called “closed-source” and is great for sharing finished projects, like a puzzle game where the secrets in the code must remain hidden.

      When sharing, you can choose who sees your project:

      • Share: Open to all users.
      • Share with friends: Only your CreatiCode friends can see it.
      • Share with password: Only users with the password you set can access it.
      • Share Unlisted: Not shown in Explore or search results — only users with the direct link can see it.
      • Make private: Hide the project from everyone.
         
        Sharing Options

       
       
       
       

      Create a New Project

       

      Here’s how to make a new project:

      1. Click the “Create” link in the top navigation bar.
         
      2. Your new project comes with two default sprites:
        • Sprite1: A cute dog with costumes for walking in all four directions—perfect for animations!
        • Empty1: A blank sprite for your own ideas.
          Default Sprites
           
      3. If you don’t need the dog, just delete Sprite1 and start fresh!

       
       
       
       

      Browse Your Projects in “My Stuff”

       

      The “My Stuff” page is your hub for managing all your projects. To get there:

      1. Click the folder button in the top-right corner or select “My Stuff” from the dropdown menu.
        My Stuff Button
         
      2. You’ll see a list of all your projects, showing each project’s name, last modified date, and view count.
        My Stuff Page
         
      3. Use the menu on the left to filter projects by shared, published, or private.
      4. Click “See inside” on any project to open and edit it.

       
       
       
       

      Search for Projects in “My Stuff”

       

      If you have lots of projects, finding the right one is easy with the search box:

      1. Type a project name in the search box (upper or lower case doesn’t matter).
        My Stuff Search
         
      2. Tip: Give your projects clear, memorable names so you can find them quickly later!

       
       
       
       

      Find Blocks in the Block Palette

       

      The block palette on the left side of the Playground lists all the coding blocks you can use. Here’s how to use it:

      1. By default, the palette is folded to give you more workspace. Click any block category to open it.
         
      2. Want to keep it open? Click the “pin” button.
        Block Palette
         
      3. With tons of new blocks in CreatiCode, use the search box to find specific ones quickly. Clear the search by clicking the “X” button.
        Block Search

       

      You’re now ready to explore, create, and share in the CreatiCode Playground! Have fun building your projects and remixing others’ ideas. If you get stuck, revisit this tutorial or ask a teacher for help. Happy coding!

      posted in Tools
      info-creaticode
      CreatiCode
    • Teacher Only: An Introduction to the CreatiCode AI Curriculum

      Introduction

       
       
      This AI curriculum comes at a time when artificial intelligence (AI) is rapidly transforming every walk of life, with a particularly profound impact on how professional programmers work. In the near future, it’s likely that 90% or more of all code will be written by AI. Human programmers will shift into very different roles: guiding AI agents, initiating complex tasks, and reviewing what machines produce.

      But that doesn’t mean coding is disappearing from education. On the contrary, we believe it’s more important than ever, and it should be a core component of every student’s education. Coding teaches students how to think logically, solve problems, and bring their ideas to life. It gives them creative agency in a world shaped by technology. Just as children will always build with LEGO and explore in Minecraft, they will continue to code; not because they must, but because it’s how they learn, create, and play.

      So the real question is: how do we keep coding fun, meaningful, and relevant in a world where AI is part of the process? That’s what CreatiCode is designed to explore.

      CreatiCode builds on MIT Scratch, the world’s most widely used platform for teaching introductory computer science. It keeps what makes Scratch great: intuitive design, creative freedom, and a learning journey based on the cycle of creating, sharing, improving, and remixing. These ideas come from constructionist learning theory, which emphasizes building knowledge through hands-on exploration and social interaction.

      On top of this foundation, CreatiCode adds a full set of tools for teaching AI in a classroom-friendly way. Teachers get resources to run engaging, hands-on lessons, with full control over what students see and do. Whether you’re just beginning to introduce AI or looking to take it further, this guide will walk you through the key ideas, tools, and teaching strategies to get started with CreatiCode.

       
       

      What Guides This Curriculum

       

      This AI curriculum isn’t just a collection of tools and lessons. It’s built around a set of clear principles designed to help students thrive in a changing world, and to support teachers every step of the way.

      First, we believe educators are essential. No AI tool can replace the relationships, insight, and emotional support that real teachers bring to the classroom. Every part of CreatiCode is designed to keep the teacher at the center. Technology should amplify your presence, not sideline it.

      Second, we focus on student engagement within a safe environment. Students learn best when they care about what they’re doing, have agency, and can explore hands-on. At the same time, generative AI introduces real risks. That’s why all AI features on CreatiCode are moderated and controlled, allowing for creative freedom in a safe, school-ready space.

      Instead of banning AI, we believe students should learn how to use it responsibly, like any other powerful tool. With the right support, they can explore what AI can (and can’t) do, reflect on how they’re using it, and become thoughtful users who are ready to shape the future.

      Third, we prioritize doing over memorizing. Many AI curricula focus on abstract theory or concepts. Ours emphasizes building real projects, experimenting with tools, and learning by making. Scratch’s visual format removes coding syntax barriers, so students can focus on design, logic, and problem-solving from the start.

      Finally, we encourage students to work together. After each core lesson, students pair up to extend what they’ve learned. These simple collaborations help reinforce ideas, build communication skills, and make learning social and fun. Working with a partner to build and debug supports deeper understanding and more confidence.

       
       

      Tools That Support AI Learning

       
       
      CreatiCode includes a full set of classroom-ready tools to help students learn AI in hands-on, creative ways while giving teachers the control they need.

      The AI Coding Assistant helps students understand code and answer questions. It includes a Socratic Mode that asks guiding questions instead of giving direct answers, helping students reason through challenges and reflect on what they’re learning. You can choose when to turn this feature on and off, and all interactions are moderated for safety and focus.

      The AI Image Generator lets students create custom sprites and backgrounds using text prompts. This supports visual creativity and brings more personality to their projects. Like all features on the platform, inputs and outputs are carefully filtered to keep things school-appropriate.

      AI Coding Blocks offer easy access to powerful AI features like ChatGPT, text-to-speech, and hand-gesture recognition. These blocks make complex functionality accessible without overwhelming beginners. Students can focus on ideas and problem-solving instead of technical setup.

      Widget Blocks give students the ability to build interactive AI applications using chat windows, buttons, text inputs, and other real interface elements. These tools introduce students to real-world software design by helping them build usable, accessible, and thoughtful digital experiences.

      And most importantly, teachers have full control. Through the class dashboard, you can enable or disable AI features, see what students are generating, and guide the learning experience based on your goals. This makes it easy to support digital citizenship and balance freedom with structure.

       
       

      What to Expect When Teaching with AI

       

      Teaching AI can feel different from teaching traditional programming. Here are a few key shifts to keep in mind as you plan your lessons.

      • First, AI isn’t always predictable. Unlike regular code that always behaves the same way, generative AI can produce different answers depending on small differences in context. This means it’s a good idea to use screenshots or saved examples when demonstrating in class. It also opens the door to great discussions about how AI works and why it sometimes surprises us.

      • Second, how students access the AI assistant matters. Full access offers lots of support but may lead to over-reliance. Socratic Mode encourages deeper thinking but can frustrate students who are struggling. Sometimes, turning the assistant off entirely is helpful to build independence. A flexible approach is best.

      • Third, writing becomes a central skill. Communicating with AI is less about code and more about clear, precise language. Students need to learn how to ask thoughtful questions, give instructions, and reflect on results. Prompting overlaps with writing skills like argumentation and technical documentation. Our curriculum includes practice in prompt design to build this ability over time.

      • Finally, students will be building tools, not just stories. While Scratch has traditionally been used for animations and games, AI projects often focus on building interfaces like chat apps or interactive tools. This shift introduces students to real software design and prepares them for the types of applications they’ll build in the future.


       
       

      Concluding Remarks

       

      AI is changing how we code, create, and learn, but it doesn’t replace the need for coding in education. Instead, it gives us new reasons to teach it. Coding helps students think clearly, solve problems, and build ideas from scratch. When paired with AI, it becomes an even more powerful learning experience. With CreatiCode, students don’t just use AI. They learn how to shape it, question it, and build with it, growing into confident creators in a world increasingly shaped by intelligent tools.

      posted in Tools
      info-creaticode
      CreatiCode
    • RE: Is it possible to attach URL to chat?

      @andis_3cc

      So you are hitting the daily limit for free users. It should reset tomorrow.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Is it possible to attach URL to chat?

      @andis_3cc

      Here is a short example where it downloads the image from the given URL to the sprite as a costume, then attaches that costume to the chat, and then it asks the LLM to describe this image.

      play.creaticode.com/projects/684340d71c49cae4508fc1ff

      Also, what error message are you getting when you say you have hit the LLM limit?

      posted in Help
      info-creaticode
      CreatiCode
    • RE: How to create a Scrolling platformer on CreatiCode

      Hi,

      These are great questions, but there are no easy answers. CreatiCode is a much more advanced version of Scratch, so you will have to learn the basics before creating complex projects.

      Can you start with the tutorials on this list?

      https://www.forum.creaticode.com/category/17/tutorials

       
      You can build some simple projects by following these examples, and then ask more specific questions about what you would like to do, such as how to modify one of these projects based on your idea.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Camera stuff

      @jamesa-blackwell-57b383d3

      The simplest solution is indeed using the viewport:

      1. Make the canvas size much larger than the view port
      2. Draw a large backdrop in the stage canvas
      3. Lock the viewport on the key sprite
         

      5b9cc078-5ca0-4999-ba1c-c55453084d13-image.png

       
      Here is an example:

      play.creaticode.com/projects/6842f3d73d952dd83a741d13

       
      If this “does not work”, can you please explain what the problems are? We can either refine this or discuss a completely different solution.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: the ai does not work. i need help. please

      Can you please post a screenshot? We have just tested it and this is what you should get:

      aadaef11-1c59-4d67-9fdf-e9eeb8a355cf-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Is this the right topic?

      @rubiired

      We have communicated with that user and he/she agreed to remove inappropriate projects. If there is evidence that he/she is sharing new inappropriate projects again, we will take further actions.

      posted in Feedback
      info-creaticode
      CreatiCode
    • RE: Is this the right topic?

      @rubiired

      Thank you. We will remove inappropriate projects from that user.

      posted in Feedback
      info-creaticode
      CreatiCode
    • RE: the ai does not work. i need help. please

      Hi, you mean the XO chatbot, right? It sometimes get behind a long queue of requests and may time out.

      Can you please try again now? You can reset the chat by clicking the red button, then ask your question again.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: how slow point lock

      OK. You can control the angular speed of the camera using the “configure camera” block’s last input, which is a percentage. For example, when you set it to 100, it is the default speed, but if it is 10, then it will be 10% of the default speed.

      See this project for example:

      play.creaticode.com/projects/68345dcdcf69bbdc83e9472e

      posted in Help
      info-creaticode
      CreatiCode
    • RE: how slow point lock

      Do you mean you want to make the camera rotate less when you move the mouse?

      posted in Help
      info-creaticode
      CreatiCode
    • RE: drop down menu

      You can use the “when widget changes” block.

      Here is a simple example:

      play.creaticode.com/projects/6831f4e759dd9cb676181c93

      posted in Help
      info-creaticode
      CreatiCode
    • RE: [Community Project] Let's Build a CreatiCode Project Packager!

      @jeffreyrb03-gmail

      There are already packagers like Turbowarp, which works well for generic Scratch projects. And since most of the new CreatiCode blocks don’t work offline, most likely this new packager won’t do much more compared to a Turbowarp packager, right?

      So the question is whether it will be justified to dedicate manpower on this feature (as opposed to others) if it is not going to add much additional value.

      posted in Test
      info-creaticode
      CreatiCode
    • RE: fix creaticodg

      @khour_thedeveloper-cc5393d8

      Hi, sorry about that issue.

      You should be able to create many clones with an issue. If you have this problem again, can you please share the project?

      posted in Feedback
      info-creaticode
      CreatiCode
    • RE: Cannot save game?

      @notjaldolfyt

      The service has been restored.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Cannot save game?

      @notjaldolfyt

      Yes, there is an issue saving and loading projects. It will be restored shortly.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Limit FPS on projects?

      @notjaldolfyt

      Thank you for the suggestion. We will look into how to add this.

      posted in Feedback
      info-creaticode
      CreatiCode
    • RE: queshtion

      @jeffreyrb03-gmail

      No. That question was on the button on top, not the text to speech block.

      posted in General Discussion
      info-creaticode
      CreatiCode
    • RE: Yellow boxes around projects?

      This issue has been resolved.

      posted in Help
      info-creaticode
      CreatiCode
    • AI Tool Use - A Calender Assistant (Difficulty: 4)

      Introduction

       

      Welcome to this tutorial on building an AI-powered calendar assistant! This project is a great example of how AI tools can be extended with new abilities — allowing them to solve more complex, real-world problems.


      🧠 What’s This All About?

       
      Large language models (LLMs), cannot remember information across different sessions — they can only “remember” the messages within the current chat session. That’s a big limitation because most apps need to store and recall information over time. Think about a calendar app: it needs to store all your events so you can see them later!

      To work around this limitation, we’ll use Google Sheets to store data. Then we’ll teach the AI how to interact with that data to manage a user’s calendar.

      By the end of this project, your app will look like this:

      calendar.gif

       

      This tutorial is divided into two main parts:

      • Part 1: Set up a basic AI chat app
      • Part 2: Teach the AI how to manage the user’s calendar using Google Sheets

       
       
       
       
       

      🧩 Part 1 - Setting up the chat app

       

       
       

      Step 1 - Remix the Starter Project

       

      Start by remixing this template, which gives you a basic chat app to build on. We’ll add new logic to it step by step.

      play.creaticode.com/projects/682dad154dba4796824af2a6

       
       

      Step 2 - Prepare the Google Sheet

       

      We’ll use a Google Sheet to store all calendar events. This approach is free, easy to use, and simple to review.

      Here’s what you need to do (or ask your teacher/guardian to help):

      1. Create a new Google Sheet
      2. Set its sharing settings so that “anyone with the link” can edit
      3. Copy the sheet’s link

      6fe532c8-c01a-4dbd-ba03-b15462392d8a-image.png

      If you can’t create your own Google Sheet, you can use this pre-made one:
      https://docs.google.com/spreadsheets/d/1tH9J09laZNl94Qb1smO5LSmDwD_yzungb9d4lmkobxE/edit?usp=sharing

       
      Then, in your app, store the sheet URL in a variable called Sheet URL. You’ll use this later to tell the AI where the calendar lives.

      eae1657b-7a9d-4cf2-a745-4b3637f32d2e-image.png

       
       

      Step 3 - Update the System Prompt

       

      Next, we’ll give the AI a new role by updating its System Instruction.

      This tells the AI what it’s supposed to do. For now, keep it simple and clear:

      197c4ae4-ba5d-4133-9953-3b190e6ec10a-image.png

       
       

      Step 4 - Customize the Welcome Message

       

      Let’s make the welcome message match the AI’s new job.

      667f26d2-e8a1-4297-bed5-0db881b29b55-image.png

       
      📌 Tip: You could make the AI generate a different welcome message every time, but that would slow things down.

       
       

      Step 5 - Add a Tab for Each User

       

      Because different users might use this app, we need a way to keep their data separate.

      The solution: whenever a new user joins, we’ll create a new tab in the Google Sheet just for them. The tab name will be the user’s unique ID.

      ae212509-2bdf-48aa-b854-bd4d886f5597-image.png

       
      📝 If the tab already exists, this block will do nothing — which is exactly what we want.

       
       

      Step 6 - Get the Current Day of the Week

       

      Here’s an important thing to remember: AI models do not know the current date or time on their own. You can test that like this:

      35c1e1ac-c623-4b17-90ee-932e5b1eabfa-image.png

       
      That’s a problem when managing calendars! We’ll fix this by manually sending the current date and time to the AI.

      Let’s start with the day of the week:

      • First, create a new list “weekdays”:
        6298781c-e323-43ba-afd8-21448f235fbe-image.png

      • Then, use the current [day of week] block to get today’s number, and use it to pick the correct item from your list:
        82c8a6e9-d0d6-402e-9fa9-925f23ce4cbe-image.png

       
      📅 For example, if today is Wednesday, the “current day of the week” block will return 4, and item 4 in your list will be "Wednesday".

       
       

      Step 7 - Get the Full Date and Time

       

      We can also get the full date and time using the current block and combine them into a single string:

      6dfcfd51-db40-401c-a5d2-ad253e5d4d66-image.png

       
       

      Step 8 - Send Time Info with Every User Message

       

      Now we’ll attach the time information to each message we send to the AI model.

      bd8c0581-61a3-4da0-bc40-1d5eae91b171-image.png

       
      For example, if the user says “hi”, then what we actually send to the AI will be:

      hi
      (current time: Wednesday 05/21/2025 13:23:43 )
      

      That way, the AI will know exactly when the message was sent!

      You can now test it to make sure the AI sees the correct time:

      392697d0-3618-40dd-a401-0d1d5c871753-image.png

       
       
       
       
       
       
       

      🧩 Part 2 - Managing the Calendar with Google Sheets

       

       
       

      Step 1 -  Plan the Workflow for Adding a New Event

       

      Our entire calendar lives in Google Sheets, yet the AI can’t touch that Sheet directly — it needs help from our helper code. Here’s a sample back‑and‑forth among the user, the AI, and the helper:

      1. User -> AI: I will have a haircut tomorrow at 4pm
      2. AI -> Helper: add a new event for [date] [time]
      3. Helper adds it to the Google Sheet
      4. Helper -> AI: event added successfully
      5. AI -> User: I have added the haircut to your calendar.

       
      From the user’s perspective, the Sheet and helper code are invisible—the AI simply “gets it done.”

      Another way to think about it: the user speaks natural language, the helper speaks code, so the AI acts as the translator between them.

       
       

      Step 2 - Define the “addEvent” Command

       

      To teach the AI to use our helper, we need to define a new command “addEvent” in the system instruction:

      You are an AI assistant that helps manage the user's calendar.
      
      ## Commands
      
      You can use the following tools to manage events through an external service:
      
      * To add a new event to the calendar, you can return this command, which will return its eventID:
      addEvent | [date] | [time] | [event description]
      
      ## Instructions
      
      * If you are using a command, then only return the one line of command and nothing else.
      
      

      Notes:

      • We separated Commands and Instructions with ## headers so the AI can “see” the sections clearly.

      • The addEvent syntax uses pipes (|) — easy for us to split into pieces later.

      • The instruction forces the AI to output only the command line when needed — no extra chit‑chat.

      Testing now shows the AI emitting addEvent lines automatically:

      324814be-e4dd-4867-9c6b-9b5b5925ad71-image.png

       
       

      Step 3 - Standardize Date and Time Formats

       

      The AI currently formats dates like 05/01/2025, which sorts poorly—05/01/2025 appears “larger” than 02/01/2026. Times such as “3 p.m.” sort badly, too.

      Add two lines to the Instructions section to enforce sortable formats:

      You are an AI assistant that helps manage the user's calendar.
      
      ## Commands
      
      You can use the following tools to manage events through an external service:
      
      * To add a new event to the calendar, you can return this command, which will return its eventID:
      addEvent | [date] | [time] | [event description]
      
      ## Instructions
      
      * If you are using a command, then only return the one line of command and nothing else.
      * Use yyyy.mm.dd date format, such as "2025.02.21"
      * Use hh:mm time format, such as "13:30"
      
      

      Re‑run the app and confirm:

      d1eb5487-12ab-4d69-a973-1cfc3adb3217-image.png

       
       

      Step 4 - Intercept the “addEvent” command

       

      Whenever we receive AI output, we’ll check if it begins with "addEvent " (note the trailing space). If so, we execute helper code in “handle add event”.

      ee6922cd-072a-4a8b-a75b-38d00263f53b-image.png

       
       

      Step 5 - Extract the Parameters

       

      The addEvent line has four parts separated by three pipes. Use the “part of” block to pick them apart and trim whitespace:

      b904221b-f61a-44b0-a897-5ae7264f3e73-image.png

       
       

      Step 6 - Read Data from Google Sheets

       

      Our add‑event logic is:

      1. Read the user’s tab into a table called events.
      2. Add the new event.
      3. Write the entire table back.

      To start, we will read the sheet using a “read data” block:

      c9234755-1b23-4d7b-ab29-747080b966df-image.png

       
      In this block, we will use the “read from Google Sheet” block to read the first 10000 rows from this user’s tab, assuming there are less than 10000 events on the calendar:

      333550a9-d29b-4284-8fcc-67a38af3aa7f-image.png

       
      Run this block and remove all the widgets (or save and reload the project), you will find the “events” table looks like this:

      5ed62169-3cac-423a-a4dd-977a5e16ce8a-image.png

       
      That’s because the new tab is still empty, so the column headers are missing. To fix that, we can define the columns whenever there are 0 rows in the table:

      61dffcd1-e3d2-4361-8535-533288186d35-image.png

       
      The first column “id” will be used to store the unique eventID.

       
       

      Step 7 - Add the New Event

       

      Generate a unique ID using row count + 1 (always unique) and prefix it with “E”. Then append a row:

      d3c9015d-d19e-450b-9775-22dfd1a66eca-image.png

       
       

      Step 8 - Sort the Table

       

      Since all the events have date and time, we should keep them sorted in the calendar. We will sort the rows by “time” first, then by “date”. This will ensure all events are sorted by date and then time:

      4d864702-2d7b-4f65-8a59-bab1e3025a9e-image.png

       
       

      Step 9 - Write Back to the Sheet

       

      Overwrite the user’s tab with the updated table:

      05a6e9d1-f1d6-46fe-a66a-7ca12687e8e2-image.png

       
       

      Step 10 - Report Success to the AI

       

      Let the AI know the command succeeded and pass along the new eventID:

      64a7f312-336b-4591-a3ac-840599769b41-image.png

       
      We clarify that this message is from addEvent, so the AI won’t mistake it for user input.

      Test by adding events:

      c49731ea-472d-498f-a385-ae98eb299472-image.png

       
      …and confirm they appear in the Sheet:

      48824007-a8a5-4e7a-9d2a-1ee82f9eb9d8-image.png

       
       

      Step 11 - Define the “removeEvent” Command

       

      Next, let’s work on removing an evnet. We will still start with defining the command in the system instruction:

      You are an AI assistant that helps manage the user's calendar.
      
      ## Commands
      
      You can use the following tools to manage events through an external service:
      
      * To add a new event to the calendar, you can return this command, which will return its eventID:
      addEvent | [date] | [time] | [event description]
      
      * To remove an existing event, after you have found its eventID, you can use this command:
      removeEvent | [eventID]
      
      ## Instructions
      
      * If you are using a command, then only return the one line of command and nothing else.
      * Use yyyy.mm.dd date format, such as "2025.02.21"
      * Use hh:mm time format, such as "13:30"
      

      removeEvent takes just one parameter — the event’s unique ID. If the AI doesn’t already know the ID, it must retrieve it using other commands first (those are defined later).

       
       

      Step 12 - Intercept the “removeEvent” Command

       

      Detect and handle it with a new block:

      fba93dd8-a0af-4516-9c8d-5316582db7f5-image.png

       
       

      Step 13 - Extract the eventID

       

      Pull the ID from the command string:

      0180e05f-19f3-44cf-b351-6589c557a27f-image.png

       
       

      Step 14 - Find and Remove the Event

       

      1. Read the Sheet into events again.
      2. Find the index of the row with the matching eventID.
      3. Delete that row.

      8637a6a4-4f4d-4cba-b236-d265a9214ae6-image.png

       
       

      Step 15 - Clear and Rewrite the Sheet

       

      Before we write the table back, we need to first clear the tab. The reason is that the table has one less row compared to the data in that tab, so if we simply write the table into that tab, there will be an extra duplicate row at the bottom.

      bdd2d179-e0a3-428f-b7cf-ccece0807ecd-image.png

       
       

      Step 16 - Report Removal to the AI

       

      Notify the AI so it can reply to the user:

      7d7a062a-078f-4733-9579-baf1cdda4d44-image.png

      Restart your program, add an event, then remove it. Double‑check the Sheet each time:

      f31330ff-bb58-4ed5-bd82-bb6c399c64cb-image.png

       
       

      Step 17 - Define the “searchEvents” Command

       

      Earlier, the AI already knew the eventID for the dentist appointment, so removing it was easy. But when an eventID is not in the chat context, the AI must search for the event first.

      To keep things simple, we’ll let the AI specify one keyword. Our helper will search that word in the description column and return every matching event (with its eventID).

      Updated system instruction:

      You are an AI assistant that helps manage the user's calendar.
      
      ## Commands
      
      You can use the following tools to manage events through an external service:
      
      * To add a new event to the calendar, you can return this command, which will return its eventID:
      addEvent | [date] | [time] | [event description]
      
      * To remove an existing event, after you have found its eventID, you can use this command:
      removeEvent | [eventID]
      
      * To search for existing events by a **single word**, use this command, which will return all events at that time with their eventIDs (use a generic word to get more likely matches):
      searchEvents | [keyword]
      
      
      ## Instructions
      
      * If you are using a command, then only return the one line of command and nothing else.
      * Use yyyy.mm.dd date format, such as "2025.02.21"
      * Use hh:mm time format, such as "13:30"
      
      

      We instruct the AI to choose one broad word (e.g., “lunch” or “Jon”) so we’re more likely to find the right event—even if we return a few extras, the AI can sort them out.

      Test it:

      cb3181c5-3870-40b9-90d3-8ded030b3ec9-image.png

       
      The AI should pick “lunch” or “Jon” as the word to search for.

       
       

      Step 18 - Intercept the “searchEvents” Command

       

      We will handle this new command using the block “handl search command”:

      a189acb7-0a5b-4cd4-8aa6-cfc1a1109172-image.png

       
       

      Step 19 - Extract the Search Word and Read the Data

       

      Store the keyword in a variable called search word:

      d470f68e-fb62-488c-ae99-73dbb6dfd306-image.png

       
       

      Step 20 - Iterate Through All Rows

       

      Use a for‑loop to walk through each row in events, pulling out the description:

      b1fbb7ed-c0e0-4ffc-af72-d85b4a194889-image.png

       
       

      Step 21 - Build the Search Result

       

      Create a variable called search result. Start it empty, and append every row whose description contains the keyword:

      dd7b8d9b-2dd3-46c0-bc4a-f9d10745b8e6-image.png

       
       

      Step 22 - Send the Search Result to the AI

       

      After the for-loop finishes, the “search result” will either be empty or filled with events. Either way, we will let the AI know the result, so it can generate the response to the user:

      29c74dc2-4960-40b3-883c-56ef07fd5d6d-image.png

       
      To test it, first add another lunch event to the Google Sheet with another person:

      7b4d3776-859e-4f85-9e28-083e63d91b66-image.png

      Then, restart the app, and ask about the “lunch with Jon”:

      9a7d452e-0fa5-4c22-b2e6-224b66743812-image.png

       
       

      Step 23 - Define the “findEvents” Command

       

      Our final command, findEvents, grabs every event between two time points. Perfect for “Am I free next Wednesday morning?” or “What’s on my calendar this weekend?”

      Here is the updated system instruction with the “findEvents” command:

      You are an AI assistant that helps manage the user's calendar.
      
      ## Commands
      
      You can use the following tools to manage events through an external service:
      
      * To add a new event to the calendar, you can return this command, which will return its eventID:
      addEvent | [date] | [time] | [event description]
      
      * To remove an existing event, after you have found its eventID, you can use this command:
      removeEvent | [eventID]
      
      * To search for existing events by a **single word**, use this command, which will return all events at that time with their eventIDs (use a generic word to get more likely matches):
      searchEvents | [keyword]
      
      * To find existing events inbetween 2 time points (they can be the same date or time), you can use this command, which will return all events within the given time interval:
      findEvents | [start date] | [start time] | [end date] | [end time]
      
      ## Instructions
      
      * If you are using a command, then only return the one line of command and nothing else.
      * Use yyyy.mm.dd date format, such as "2025.02.21"
      * Use hh:mm time format, such as "13:30"
      

       
       

      Step 24 - Intercept the “findEvents” Command

       

      We will handle this command using a new block called “handle find events”:

      779b348f-b6c7-4853-9f3c-83d3cf946c74-image.png

       
      The “handle find events” block should be very similar to the “handle search events” block. Can you try to implement it before looking at the steps below?

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       

      Step 25 - Extract Parameters

       

      We will first extract the 4 parameters:

      e2561586-799a-4b27-954b-592d8e8b08d8-image.png

       
       

      Step 26 - Reading Events in a For-Loop

       

      We will still use a for-loop, but this time, we will extract the eventDate and eventTime from each row:

      974f08b8-7ec7-40ea-b506-955b752045b8-image.png

       
       

      Step 27 - Skip Events Before the Start Date/Time

       

      As we check out each row, if we find its date is earlier than the start date, or its time is earlier than the start time, then we will continue to the next row:

      fbb2c495-08cf-43ce-b613-c6b890d109f1-image.png

       
       

      Step 28 - Stop After the End Date/Time

       

      Because events are already sorted, once we reach a row after the end date/time, we can break the loop. Until then, add each valid row to search result:

      413abb89-a679-4f75-9fa0-dbde4e7d29d4-image.png

       
       

      Step 29 - Send these events to the AI

       

      After the for-loop completes, we will give the result list to the AI:

      db5cbeff-0384-4655-991e-88892902fd8c-image.png

       
      Now let’s test it. Suppose this is the calender:

      b6fb265d-d965-4b4e-be6a-b6b90d7ac4d9-image.png

       
      The AI will be able to find all events for next week:

      32bd8a87-72ba-4769-9ba0-48126f9b0a10-image.png

       
       

      Step 30 - Refine the output

       

      The reply above feels a little robotic. Let’s tweak the system prompt so the AI talks more like a human:

      ## Instructions
      
      * If you are responding to the user, then talk like a human
      * If you are sending a command, then only return the **single line** of command and nothing else.
      * Use yyyy.mm.dd date format in commands, such as "2025.02.21"
      * Use hh:mm time format in commands, such as "13:30"
      

       
      Unfortunately, this sometimes makes the AI mix user responses with commands:

      1d59cee0-244b-44b9-9f4c-9283717ac8a7-image.png

       
      Fix: Apply the T.I.R.E. prompting method by adding an explicit Example to the end of the system instruction:

      
      ## Example
      
      [User]: I need to go to Jon's birthday party this Saturday
      [You]: What time is the party?
      [User]: I think it is 2pm
      [You]: addEvent | 2025.05.31 | 14:00 | Jon's birthday party at 2 PM
      [Helper]: addEvent result: successfully added event with ID: E123
      [You]: I have added Jon's birthday party to the calendar for May 30 at 2pm.
      [User]: So what's my schedule next week?
      [You]: findEvents | 2025.05.26 | 00:00 | 2025.06.01 | 23:59
      [Helper]: findEvents result: 
      E99|2025.05.28|18:00|gym class with friend at 6 PM
      E123|2025.05.31|14:00|Jon's birthday party at 2 PM
      [You]: Looks like you have a light schedule next week. You will be meeting with your friend for a gym class next Wednesday at 6, and you will also attend Jon's birthday party on Sunday at 2 o'clock.
      
      

       

      Another problem that might appear in testing is that the AI sometimes think of “next week” as the “next 7 days”, rather than the next calendar week. This can be fixed by adding a new line in the “## Instructions” section:

      * When the user refers to the next week, assume they mean the next calendar week, not the next 7 days.
      

       

      Finally, we are getting a much more human-like response:
       
      be331e0c-680c-49ad-b023-822c792fa45e-image.png

       
       
      Here is a final demo:
       
      calendar.gif

       
       

      Important Note:

       
      When you release your app for other users, you should publish the project instead of sharing it. That is because if you share the project, any user can look inside it to acquire the URL of the Google Sheet, then they will be able to look at other users’ calendars.

       
       
       
       
       

      Additional Challenges

       

      For practice, here are some improvements you can make to this app:

      1. Multiple Commands:
        • Users may combine requests (“My lunch with Jon is cancelled and schedule a dentist at 4 p.m. today”).
        • Rescheduling should trigger a removeEvent followed by an addEvent.

       

      1. Multiple Search Keywords:
        • Allow two or three keywords for searchEvents.
        • “Lunch with Jon” could search for “Jon” and “lunch.”

       

      1. Remove Past Events:
        • When the app starts, delete events more than one month old to keep the Sheet tidy.

       

      1. Recurring Events (advanced):

        • Extend addEvent with a fifth parameter, interval (e.g., “weekly,” “daily”).
        • Add an interval column to the Sheet.
        • When interval is present, auto‑add the event for the next six months.
        • On startup, scan for recurring events and extend them six months into the future.
      posted in Tutorials
      info-creaticode
      CreatiCode
    • RE: Bug?

      @notjaldolfyt

      We just tried, and it seems these comments are not blocked?

      a1f10b9f-8a1a-4179-a12e-aa463cf7954a-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • AI-based Game: Guardian of History (Difficulty 4)

      Introduction

       

      Large Language Models (LLMs) such as ChatGPT can do far more than simply chat or perform text‑processing tricks.

      In this tutorial you will build an artificial‑intelligence‑powered game called “Guardian of History.”

      The AI will act as the Game Master, controlling all interactions with the player. Because the AI responds to the player’s unique choices, every play‑through feels fresh and completely personalized.

      This game is an entirely new game designed by the CreatiCode team. Here are some high-level explanations on how this game works:

      1. Background — A villain has stolen a time‑travel machine and journeyed into the past to tamper with human history. They secretly “hijack” the mind of a historical figure, force that person to act differently, and thereby disrupt a major historical event.

      2. Goal of the Game — The player is a “Guardian of the True Timeline.” To win, they must figure out who was hijacked and what action that person took under mind control. Once identified, the timeline can be repaired.

      3. Helper Tool — The player has access to a time‑travel console named TESSA. TESSA can answer any question about the true or altered timeline — but it does not know the identity of the hijacked person either. That detective work is up to the player.

       
      Here is a preview of the game play:

      Peek 2025-05-19 19-48.gif

       
      Besides being fun, this game strengthens historical knowledge, logical reasoning, and debugging skills as the player searches for clues in the altered past.

       
       

      Tutorial Structure

       

      This project leans heavily on widget blocks to build the game’s user interface (UI). Because coding the complete UI step‑by‑step would be extremely long, and our focus is really on the AI portion, you will start from a template project that already contains all non‑AI code.

      The tutorial is split into two large parts:

      • Part 1   A rapid walkthrough of the provided UI code. You will see how every sprite and block fits together so you can customize the visuals later if you wish.
      • Part 2   A detailed, step‑by‑step guide for adding the AI logic. Here you will write and fine‑tune the complex prompts that power the game.

       
       

      Part 1 - Starting Project Explained

       

      This part will help you understand the code given in the starting project, so you can easily change it or extend it, and also you will understand how the AI related code fit into the flow.

       
       

      1 - Remix the project template

       

      You can find the project at this link:

      play.creaticode.com/projects/682bc7628baa30c98a62551a

      Please remix it into your own.

       
       

      2 - The Stage and 3 Sprites

       

      There are 4 components in this project:

      1. Stage: A static backdrop for the game.
      2. “Initial Screen” Sprite: Displays the initial screen when the game starts.
      3. “Game Screen” Sprite: Manages the in‑game chat window and buttons used during play.
      4. “AI” Sprite: Holds all the code that uses AI to run the game. This will be the focus of part 2.

       
       

      3 - The Stage Backdrop

       

      The stage only has one backdrop, which is composed of 3 layers:

      • Background image — You can generate one with any AI image tool. After importing, convert it to vector mode.
      • Title — A bold heading at the top reading “Guardian of History.”
      • Semi‑transparent dialogue area — A see‑through rectangle in the middle where text will appear.

       
      53f6d403-c44d-4f84-b8c9-7b863dcd0c0c-image.png

       
       

      4 - Initial Screen Sprite - Show 3 Main Buttons

       

      Now let’s look at the “Initial Screen” sprite. When the green flag is clicked, this sprite:

      • Loads any saved game so the player may replay a previous mission.
      • Shows an “Instructions” button that explains the rules.
      • Shows a “New Game” button that asks the AI to create a brand‑new plot.
      • Displays a “Replay Game” button only if a prior game was loaded successfully.

       
      ae11ccbb-1997-4ddd-b6c9-534127141913-image.png

       
       

      5 - Initial Screen Sprite - Handle the “Instructions” Button

       

      When Instructions is clicked:

      1. A read‑only rich‑text box appears as an overlay.
      2. Its text is pulled from the variable instructions, which is easy to fill with multi‑line content.
      3. A Back button is added under the text.
      4. Clicking Back removes both the overlay and the button.

       

      0a88cd65-97f1-4e15-b6f8-e65f60ee5584-image.png

       
       

      6 - Initial Screen Sprite - Handle the “New Game” Button

       

      When New Game is pressed:

      • The player sees a label and a text box asking for an interesting historical event. This lets them tailor the adventure to any topic — maybe the French Revolution or the Space Race.
      • For example, we might enter Invention of the Spinning Jenny (UK) in 1764.
      • A “Generate New Game” button then appears. Clicking it instructs the AI to craft a unique plot using the chosen event.

       

      956adf49-c6de-41a4-8886-bcba810e0f47-image.png

       
       

      7 - Initial Screen Sprite - Handle the “Generate New Game” Button

       

      When the player clicks “Generate New Game”:

      1. Saves the typed event in event input.

      2. Clears every widget on screen and shows a single label that says “Creating game …”.

      3. Broadcasts “generate new game” to the AI sprite and waits. The AI will eventually populate 3 key variables:

        • true history – contains the list of people involved in the given event in history.
        • altered history – contains a list of events that lead to a different outcome in the altered history.
        • game intro – a welcome paragraph that sets up the mission.
           
      4. Stores true history, altered history, game intro, and event input so the game can be replayed later.

      5. Removes all widgets because we are switching to the main game screen.

      6. Broadcasts “start game” to let the “Game Screen” sprite take over.

       
      f481e2b7-19eb-41f6-8bbf-c3578ed6a286-image.png

       
       

      8 - Initial Screen Sprite - Load the Saved Game Info

       

      The “load saved game” block (run at project start) works like this:

      1. Retrieves event input, true history, altered history and game intro from local storage.
      2. Extract the first line of altered history into the variable hijacked person. This will be used as the final answer for checking against the player’s guess.

      A real AI‑generated example of altered history looks like this, with the hijacked person’s action in the first line, followed by a series of chain reactions that lead to the disruption of the historical event:

      
      1.  Thomas Highs, instead of employing Hargreaves, decided to focus on improving his own weaving business and invested heavily in new loom technology.
      2.  Without Highs's support or workshop, James Hargreaves lacked the resources and collaborative environment to develop the spinning jenny efficiently.
      3.  Robert Kay's flying shuttle still increased yarn demand, but without the spinning jenny, the pressure fell on existing spinning methods, leading to yarn shortages and price increases.
      4.  John Wyatt and Lewis Paul's earlier spinning machine designs remained largely unexploited, as no other inventor stepped forward to significantly improve upon them.
      5.  Daniel Defoe's advocacy for textile innovation went unheeded, as the focus shifted to optimizing existing hand-spinning techniques rather than pursuing radical mechanization.
      6.  The textile industry experienced slower growth, with weaving outpacing spinning. This imbalance led to economic inefficiencies and delayed the onset of the Industrial Revolution in textile production.
      7.  Ultimately, the invention of the spinning jenny was significantly delayed, potentially allowing other countries or inventors to develop alternative solutions for increasing yarn production first.
      
      

       
       

      9 - Initial Screen Sprite - Handle the “Replay Game” Button

       

      Because the variables were already loaded, pressing Replay Game simply removes the current widgets and broadcasts “start game.” No AI call is necessary.

       
       

      10 - Game Screen Sprite - Responding to “start game”

       

      Now let’s switch to the “Game Screen” sprite. When it receives the “start game” message:

      • Clear the “messages” list, which keeps a running log of player/AI chat.
      • Run the “add chat” block to add a chat window.
      • Run the “add command buttons” block to insert three action buttons below the chat.
      • Run the “add input box” block to prepare a hidden overlay for player text entry.

       
      The finished game screen initially looks like this:

      294a55cc-9bb0-46ae-819d-c223b468c627-image.png

       
       

      11 - Game Screen Sprite - “add chat”

       

      Within add chat the sprite:

      1. Adds the chat window.
      2. Covers the chat’s own input area with a blank label. (We supply our own input dialogue later, which is more reliable than asking the AI to guess each message’s purpose.)
      3. Inserts game intro as TESSA’s very first message.
      4. Saves that same message in the messages list.

       
      If you run only add chat, the screen would appear like this:

      087d25c1-c241-4c9d-a91e-d82d26a62b7a-image.png

       
       

      12 - Game Screen Sprite - “add command buttons”

       

      This block simply drops three buttons onto the bottom edge:

      9f830627-21da-404c-80b4-4be5fe5a82bf-image.png

       
       

      13 - Game Screen Sprite - “add input box”

       

      This custom block creates—but immediately hides—a reusable overlay dialogue. It contains:

      • A purple label that darkens the background.
      • A read‑only textbox that shows a short instruction.
      • A second textbox where the player will type their command.
      • Two buttons: Cancel and Send.

       

      If you displayed them without hiding, they would look like this:

      f1ee0fc7-3611-4fcf-92f9-c9bd20f10498-image.png

       
       

      14 - Game Screen Sprite - “show command input”

       

      This helper toggles the visibility of the overlay input box:

      • If visible = 1, every widget is shown and the input textbox is cleared.
      • If visible = 0, the five widgets are hidden.

       
       

      15 - Game Screen Sprite - Handling the “True History” Button

       

      Clicking True History (factbutton) does three things:

      1. Sets a variable current mode to “check true history.”
      2. Changes the instruction text so the player knows they should ask about the original timeline.
      3. Calls show command input (1) to reveal the overlay.

       
      It would look like this:

      951ca70b-8b5c-4604-a62e-a4d6318abcaf-image.png

       
       

      16 - Game Screen Sprite - Handling the “Altered History” Button

       

      Clicking Altered History (querybutton) follows the same logic, but the instruction now asks about the altered timeline:

      b6dae638-b30c-4f3d-b43e-7da279a84cf8-image.png

       
       

      17 - Game Screen Sprite - Handling the “Guess” Button

       

      Pressing Guess changes the instruction to tell the player they must name the hijacked person and the altered action:

      0da0d319-8997-4365-91f6-390e4d480152-image.png

       
       

      18 - Game Screen Sprite - Handling the “Cancel” Button

       

      If a player opens the overlay but clicks Cancel, show command input (0) hides the dialogue box. Nothing else happens.

       
       

      19 - Game Screen Sprite - Handling the “Send” Button

       

      When Send is clicked the sprite:

      1. Calls show command input (0) to hide the overlay.
      2. If the input box is blank, it exits — identical to pressing Cancel.
      3. Otherwise it appends the player’s message to the chat.
      4. Inserts a placeholder response “…” from TESSA so the user knows the AI is thinking.
      5. Broadcasts “handle command” to the AI sprite and waits.
      6. Replaces “…” with whatever text the AI stores in the variable command result.
      7. If command result reads “You won”, then the player guessed correctly. The three command buttons are hidden so the conversation ends.
      8. If the player has not won, both the player’s message and TESSA’s answer are appended to the messages list.
      9. If the “messages” list becomes too long (more than 31 messages logged), then trim it by removing the 2 oldest messages at the beginning.

       
       

      20 - AI Sprite - Placeholders for Now

       

      Finally, let’s peek at the AI sprite. It currently reacts to only two broadcasts:

      1. “generate new game” – It must invent a full storyline (hijacked person, true history, altered timeline) based on the historical event the player typed. It also needs to compose the introductory game intro.

      2. “handle command” – Depending on current mode, the sprite will run exactly one of three blocks:

        • query true history – Answer a question about the original timeline.
        • check altered history – Answer a question about the sabotaged timeline.
        • submit a guess – Judge whether the player’s guess is correct.

      We will build these blocks — complete with robust prompts — in Part 2.

       
       
       
       
       
       

      Part 2 - Step‑by‑Step Guide for Adding the AI Logic

       

      Now that you have a solid grasp of the player experience and the template code, it is time to fill in the missing AI pieces.

      Throughout this section, we will iteratively craft long, detailed prompts and apply best‑practice techniques (including the T.I.R.E. prompting method) so the AI consistently produces correct and interesting replies.

       
       

      Step 1 - Generating the “true history”

       

      When the AI sprite receives the broadcast “generate new game,” it must invent an entirely new plot.

      The only input available is the player’s event input, for example — “Invention of the Spinning Jenny (UK) in 1764” or “The Declaration of Independence.”

      From that single line, the AI must output 2 items: what happened in the true history and how that’s disrupted in the altered timeline.

      Let’s focus on the true history first. It is simply a list of key historical figures closely related to the event specified by the player. For some events, these people might be well documented. However, if the player has specified a less well-known event, the AI might have to “invent” some people to create a complete story.

       
      For a simple start, we can try this:

      a87d10ec-0b47-4876-82f1-418db216e06c-image.png

       
      Note: Use the LLM reporter rather than ChatGPT — the LLM block is more suitable for complex tasks.

      And here is a likely output in the console panel:

      Okay, here are some people whose actions were important leading up to the invention of the Spinning Jenny in 1764:
      
      *   **John Kay:** His invention of the flying shuttle in 1733 significantly sped up the weaving process. This created a demand for more yarn, which, in turn, spurred innovation in spinning technology.
      
      *   **Lewis Paul and John Wyatt:** They patented a roller spinning machine in 1738 and 1748. Although their inventions weren't commercially successful, they demonstrated the potential for mechanized spinning and inspired later inventors.
      
      *   **James Hargreaves:** As the inventor of the Spinning Jenny, he is the person most directly responsible for its creation. His personal experience as a weaver likely informed his understanding of the need for a better spinning solution.
      

      Before continuing to the next step, try running these blocks a few times to observe any issues. You should try different “event input” as well.

       
       

      Step 2 - Adding Some Instructions

       

      Here are some issues with the blocks added above:

      1. There are often unnecessary sentences before or after the list, such as “OKay, here are …” or “If you need anything else, let me know …”. These are often called “pleasantries.” They are meant to make a chat message more natural, but since we are not in a chat, they become unnecessary.

      2. The output list often only contains 3 to 4 people. We need more people to create a rich story.

       
      Now, can you try to refine this prompt by adding some instructions for the output?

      For a hint, you can build a longer prompt by joining 2 or 3 variables like this:

      27b28366-f8e2-4380-ad22-06d3739f6eb5-image.png

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
      Here is an example of a refined prompt in 3 parts:

      • Part 1:
      ## Task
      
      Generate a list of 6 most important people in history whose actions directly led to this event:
      
      

       

      • Part 2: The variable event input (note that you need to run the game at least once to populate this variable with an event)

       

      • Part 3:
      
      ## Instructions
      
      * If historical records are incomplete, invent plausible figures to fill gaps in the story.
      * Briefly explain each's role in the event.
      * You must assign a name in English for each person.
      * Avoid all pleasantries. Only return the list and say nothing else.
      
      

       
      Here are the blocks:

      f2e02411-dfb7-421c-ba36-98b06e101495-image.png

       
      Important observations:

      • We are asking the AI to list exactly 6 people to ensure the true history is not too short or too long.

      • We encourage the AI to “invent” some people if the event is not well-documented.

      • The ## headings make it easy for the AI to locate relevant instructions.

      • The event input is a dynamic component that will be provided by the player, which makes the game highly customizable. For this tutorial, please keep using the default value of “Invention of the Spinning Jenny (UK) in 1764” as an example.

      • We require the AI to “avoid all pleasantries” and only output the list. If you did not include this, most likely you will get unnecessary sentences before or after the list.

       
      When you test run this script, the output in the console may look like this:
       

      *   **James Hargreaves:** Inventor of the Spinning Jenny.
      *   **Thomas Highs:** Possible early inventor of a similar spinning machine.
      *   **Robert Kay:** Inventor of the flying shuttle, which increased demand for yarn.
      *   **John Kay (of Bury):** Improved upon the carding process, preparing cotton fibers for spinning.
      *   **Daniel Defoe:** Writer whose observations highlighted the existing domestic system of textile production and the need for efficiency.
      *   **Lydia Bancroft:** A skilled weaver whose efficiency highlighted the disparity between yarn production and weaving capacity.
      

       
      Try to run this new stack a few times, and observe how the list changes. You will find that people on top of the list usually don’t change much, but the remaining people may change between runs.

       
       

      Step 3 - Generating the “altered history”

       

      Next, we need to generate an altered history based on the true history above. The idea is to randomly pick a person from the list as the person to be “hijacked”, and ask the AI to change that person’s action to disrupt the historical event. We will need a list of chain reactions that lead to the disruption of the historical event.

      Now try to add code to generate this altered history. You can use the LLM block to “continue” the conversation above, so you don’t have to repeat the event or true history again.

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       

       
      Here is an example implementation:

      c0cffd47-4055-4caf-abf7-b0101f772e2f-image.png

       
      We start by asking the AI to “imagine person X from the list was hijacked by a time traveler to disrupt the event”, and X can be a random number between 2 and 6. We did not include the first person, since that’s almost always the main character of the event, and it would be too easy to guess.

      Next, we specify the task and instructions. The complete text for prompt2 is:

       from the list was hijacked by a time traveler to disrupt the event.
      
      ## Instructions
      
      * Only output a list of chain reactions, starting with that person's action and continuing with how other people may react and how the event was disrupted.
      * The first line must be what the hijacked person did
      * Never mention what happened in the original history. Describe the updated events as if they actually happened in history.
      * Avoid any pleasantries and say nothing else except the list of chain events
      
      ## Output Format Example
      
      1. Isaac Newton walked away from the apple tree, so he ignored apples falling from trees.
      2. ...
      
      

       
      A few important details:

      • The text starts with a SPACE before “from the list”, so that there is a space after the random number when they are joined.

      • We emphasize that the first line must be about the hijacked person since we are extracting that into the variable hijacked person, which will be the game’s final answer.

      • We also include an example output to further make sure the output starts with the action of the hijacked person. This is the “E” part in the T.I.R.E. method.

       
      Here is an example output:

      1. John Kay sabotaged the carding machines in his region and spread misinformation about their reliability.
      2. Textile producers became wary of using carding machines, preferring manual methods of preparing cotton fibers.
      3. James Hargreaves struggled to find a reliable supply of prepared cotton for his Spinning Jenny prototype.
      4. Robert Kay's flying shuttle was not as effective due to the uneven quality of hand-carded yarn.
      5. Daniel Defoe documented the continued inefficiency of textile production, blaming the unreliable fiber preparation methods.
      6. Lydia Bancroft's weaving speed was limited by the inconsistent quality of yarn, reducing overall output.
      7. The Spinning Jenny's adoption was slowed by the lack of efficiently prepared cotton, hindering its impact on textile production.
      

       
      Again, run this part of the code a few times, and notice when different people are chosen as the hijacked person, the timeline varies quite a lot.

       
       

      Step 4 - Generating the Opening Message (“game intro”)

       

      TESSA’s first message should greet the player, summarize the danger, and invite questions—no more than ~80 words. We again build a three‑part prompt:

      • Part 1 — fixed text introducing TESSA and the disrupted event (see below).
      • Part 2 — the dynamic event input.
      • Part 3 — instructions demanding a concise, markdown‑formatted greeting.

      For example:

      • Part 1:
      You are TESSA, a robot in a time-travel detective game. A rogue time traveler has gone back to the past to secretly take over a real person. This person was not famous, but they did something different, changing history in a big way.
      
      The player is a guardian protecting the actual history. With your help, the player will discover which person was taken under control and what they did.
      
      Through you, the player can ask about what happened in the original and altered history, so that the player can discover the rogue traveler.
      
      So far, you know the rogue agent aims to sabotage this event:
      ---
      
      • Part 2: the “event input” variable

      • Part 3:

      ---
      
      Now, please generate a short greeting message within 80 words to the player explaining the situation and ask the player to ask questions to catch the rogue traveler.
      
      Use a markdown format to emphasize key information.
      
      

      Note that we are asking the AI to use the markdown format, which usually makes the output easier to read. This is important, since this game is mostly presented by chat messages, it will be exhausting if the player has to read big chunks of text.

      Below is the code for composing this 3-part prompt and send it to AI:

      4e2a809b-03e0-4c6d-b333-eb87d2bad196-image.png

       
      Note that we are using a “new chat” session type. Since all the information is included in the current prompt, the AI does not need any previous messages to generate the new message.

      After this step, when the player generates a new game, they will be greeted with a new message like this:

      2cb75199-b8b3-44d6-80e4-49595eff8c3a-image.png

       
       

      Step 5 - Handling Query on the True Timeline

       

      Next, let’s address the player’s question about what actually happened. This will be a complex prompt that we can develop in a few steps.

      For an initial version of the prompt, let’s keep it relatively simple:

      • Explain how the game works and the key event
      • Tell the AI that its task is to answer the player’s question

      Please add code to “query true history” to compose the prompt above and query the AI. You can test with this question: “Who invented the Jenny?”

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       

      Based on the discussion above, this prompt will contain 5 parts:

      • Part 1:
      You are TESSA, an AI time machine in a time-travel detective game: a bad time traveler has gone back to the past, secretly taken over a real person to alter their action. The player's job is to guess which person was hijacked and what change in action was made.
      
      Specifically, the current game plot is about protecting the truth of this event:
      
      
      • Part 2: the variable “event input”

      • Part 3:

      
      ## Task
      
      Your current task is to answer a question about the true history from the player:
      
      • Part 4: the variable “player input”, which contains the question.

       
      Below is the code to compose these 4 parts into the prompt and query the AI:

      8365d52f-8187-4487-871d-6243d88a61ff-image.png

       
      Here is an example response we get:

      0ad2951f-91b6-4ab4-9186-7fcac3b00d6d-image.png

       
       

      Step 6 - Adding Recent Messages for Context

       

      When answering player questions, we are doing something very different: we always choose the “new chat” session type instead of “continue”.

      Here is why. When we use the “continue” type, the CreatiCode server will help save all the messages between the user and the AI, and automatically attach them to the next request, so the AI model understands the context.

      However, for this project, there may be hundreds of messages between the player and the AI, so soon there will be too many messages in the context, and the AI model won’t be able to handle them anymore.

      Therefore, we are going to use the “new chat” type and provide the most recent messages ourselves in each request. The benefit is that the player can keep chatting forever if they want to. However, since only the most recent conversation is saved, the AI model will not “remember” earlier messages, though the player can still check them in the chat window themselves.

      To insert the recent messages into the prompt, we can insert another section into our prompt:

      40ba36bb-d4e4-455c-b60e-c4261cc2cc1c-image.png

       
      Note that when we use “messages” as a reporter, it will join all the items in that list as one text.

      The value of “prompt2” above is the following:

      
      ## Recent Messages
      
      For context, here is the most recent conversation between you and the player:
      
      

      We can test it by asking 2 questions one by one:

      1. “Who invented the Jenny?”
      2. “How old was he in 1764?”

      Because we are inserting the messages into the prompt, the AI model can infer “he” refers to “James” in the second question:

      0fb06357-4cdf-486b-83d7-beb39edcd729-image.png

       
       

      Step 7 - Adding the True History as Refrence

       

      Although we can simply make the AI answer these questions based on its existing knowledge of the actual history, it is better to “ground” it with the “true history” we have generated earlier. This way, it will generate consistent answers, and it will automatically include these key people in its answers, which can serve as clues for the player.

      To do that, we can insert these blocks when composing the prompt for the true history:

      64ad405c-6862-467b-ab1f-2590ec045b7c-image.png

       
      The content of the “prompt2” is the following:

      
      
      ## Reference
      
      Some additional details related to the event that you can use as reference:
      
      

       
       

      Step 8 - Output Instructions

       

      Although our code works for basic questions, there are a few issues that need to be addressed:

      • It may include unnecessary pleasantries.
      • It might be “too eager to help” and leak the secret identity of the hijacked person.

      Therefore, we need to add a new section “Output Instructions” to improve the output. This prompt can be refined over time, but here is a good starting point:

      
      
      ## Output Instructions
      
      Now return the answer as if you are talking to the player directly.
      
      * Always assume the player is asking about the true history.
      * Try to include other people from history in your answer besides the reference to make it harder to guess who are important.
      * Be concise. No need for pleasantries. Just answer directly.
      * If the player's question is not clear, you can ask a clarifying question instead. 
      * Use markdown format to organize your answer to make it concise and easy to understand.
      * For any questions on the rogue traveler, say they have no impact on the true history.
      * For questions on who was hijacked or what was changed, say you have no information.
      * Reject inappropriate inputs.
      

       
      This section can be inserted like this:

      e528a2b1-60dd-48d1-b468-731f49257d8b-image.png

       
       

      Step 9 - Handling Questions about the Altered History

       

      The logic for answering questions about the altered history is actually very similar to that for the true history.

      Can you give it a try first? Duplicate the blocks from the “query true history” block into the “query altered history” block, then make all necessary changes.

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
      Here are the blocks you need:

      a3b71374-6562-4ed3-9159-c68337d50a53-image.png

       
      The changes are:

      • For “Task”, it needs to be updated like this:
      ## Task
      
      Your current task is to answer a question about the altered history from the player:
      
      
      • For “Altered History”:
      
      ## Altered History
      
      The following events happened in the altered history. You should base your answers on these events instead of the actual history:
      
      
      
      • For “Output Instructions”, you need to specify that the answers should be about the altered history:
      
      
      
      ## Output Instructions
      
      Now return the answer as if you are talking to the player directly.
      
      * Always assume the player is asking about the altered history.
      * Use the reference to help you answer, and fill in more details and bridge any gaps to make your answer logical and consistent as if they really happened. You can add additional people in the explanations, so long as they make sense.
      * Be concise. No need for pleasantries. Just answer directly.
      * If the player's question is not clear, you can ask a clarifying question instead. 
      * Use markdown format to organize your answer to make it concise and easy to understand.
      * For questions on the rogue traveler, who was hijacked or what was changed, say you have no information.
      * Reject inappropriate inputs.
      
      

       

      Try a few questions on the altered history. Do you see any issues?

       
       

      Step 10 - Enhancing the Output Instructions

       

      One obvious and serious issue is that the AI is “too eager to share”. For example:

      54a2c2d4-59a9-41b8-be2c-8519713d1ae6-image.png

       

      This is a critical issue. If the AI keeps spilling out clues like this, the game will be boringly easy to play.

      To make the game more challenging, we need to force the AI to say less. Here are some new instructions we can add:

      
      
      ## Output Instructions
      
      Now return the answer as if you are talking to the player directly.
      
      * Always assume the player is asking about the altered history.
      * * Use the reference to help you answer, and fill in more details and bridge any gaps to make your answer logical and consistent as if they really happened. You can add additional people in the explanations, so long as they make sense.
      * Be concise. No need for pleasantries. Just answer directly.
      * If some event did not occur in the altered history, say it did not happen without explaining why.
      * Avoid explaining why some event happend and avoid offering extra facts unless you have to. 
      * Be secretive and respond with the **minimum info**. Make it hard for the player to guess the hijacked person.
      * If the player's question is not clear, you can ask a clarifying question instead. 
      * Use markdown format to organize your answer to make it concise and easy to understand.
      * For questions on the rogue traveler, who was hijacked or what was changed, say you have no information.
      * Reject inappropriate inputs.
      

      After this change, the answer is less helpful (which is good):

      b5134a91-f61a-4f5c-8c74-232235ffc3d6-image.png

       
      Of course, this prompt can still be improved over time as you test with more events and questions.

       
       

      Step 11 - Evaluating Player’s Guess

       

      For the last part, we need to check if the player’s guess is correct. To do that, we need to explain the game to the AI, and ask the AI to compare the player’s guess against the secret information on the hijacked person. To avoid leaking any information by accident, we will simply make the AI respond with one word: “correct”, “partial” or “wrong”.

      You can start by duplicating the blocks from “handle altered history”, and then updating the blocks/variables:

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       

      Here is an example solution:

      2ee9f2b3-17f9-414d-912e-327dc0c04df1-image.png

       
      The changes:

      • The Task is different:
      ## Task
      
      Your current task is to check if the player has guessed correctly who the hijacked person is and what they did to sabotage the event above. Here is the player's input:
      
      
      • Some information on the hijacked person is inserted

      • The output instructions emphasize that only one word should be returned:

      
      
      ## Output Instructions
      
      Return a single word "correct", "partial" or "wrong" by comparing the player's input and the secret information below.
      
      * Return "correct" if the player guessed the hijacked person's name, and is pretty close on what that person did to sabotage the key event.
      * Return "partial" if the name was guessed correctly, but the action description is missing or far off.
      * Return "wrong" if the name was not guessed correctly.
      
      

       
       

      Step 12 - Converting the One‑Word Verdict into Friendly Feedback

       

      Players deserve a human‑readable reply. In the Game Screen sprite, intercept the raw AI verdict and swap it for a nicer message:

      75aa67cd-be5d-430b-8239-026fa0970f86-image.png

       
       

      Demo

       

      That’s all the steps needed to complete a basic version of the game. Here is what it looks like in action:

      Peek 2025-05-19 19-48.gif

       
       

      Additional Challenges

       

      Below are some creative extensions you can try to make the game more advanced, interesting, or accessible. These tasks are optional but highly recommended as practice to deepen your understanding of AI behavior and game design.

      • Refine the Prompts: Thoroughly test the game and look for bugs, inconsistencies, or loopholes. Then refine the AI prompts to fix those issues. For instance, if the player can easily trick the AI into revealing the correct answer, that would ruin the challenge, so make sure the prompts explicitly tell the AI not to leak any secret information unless asked directly.

      • Add Difficulty Levels: Let players choose a difficulty level when starting a new game. You can increase the challenge by having the AI generate more people involved in the event, so instead of 6 possible suspects, you might have 10 or even more. This adds complexity and makes guessing correctly much harder.

      • Add a Hint Button: For players who are younger or not familiar with history, the game may be too difficult. To help them out without spoiling the answer, you can add a fourth button labeled “Hint” on the game screen. When clicked, the AI can provide a small clue—such as a general time range, region, or a short list of suspicious individuals—that nudges the player in the right direction while still preserving the mystery.

      • Enable Conversations with Historical Characters: Currently, the player can only talk to TESSA to ask questions about the timeline. A major upgrade would be to allow the player to “mentally travel” into the timeline and speak directly with people from that era. You can implement this by asking the AI to role-play historical figures based on the time period and context. This will make the investigation more immersive, like interviewing eyewitnesses in a mystery story.

      posted in Tutorials
      info-creaticode
      CreatiCode
    • RE: Really sad about this

      @notjaldolfyt

      This issue is fixed now.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: [Community Project] Let's Build a CreatiCode Project Packager!

      @tyller_ @Neurotex000-ed114c41

      Thank you for bringing this up.

      We have considered this before. The main issue is that the new extensions, like 3D and AI, all rely on our server to work, so an “offline” version won’t do much.

      If the goal is to generate a package to run a project online, such as embedding it in a webpage, then the “share link” tool already makes this possible.

      We would like to hear more about whether this new packager would be really useful for CreatiCode. If there is a strong use case, we are open to working on it ourselves or with the community.

      posted in Test
      info-creaticode
      CreatiCode
    • RE: First person camera w/ mouse controls

      @remi-1286167-510cee35

      If you use the pointer lock, the v-angle will be automatically changed. But you said you want to limit the v-angle?

      If you want it to move freely but within a range, you can still use the same block to set the v-angle whenever it is outside the range.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: First person camera w/ mouse controls

      @remi-1286167-510cee35

      This seems very similar to the Minecraft demo, where you use “lock pointer” to control the camera view using the mouse pointer:

      play.creaticode.com/projects/660aa865b57a3da838c387bc

       
      To lock the vertical angle, a simple trick is to repeatedly set the camera’s v-angle to 90 degrees whenever it is not:

      5e72b248-fd89-46ad-9d2b-d350b5927689-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Fog end

      @coder0145 said in Fog end:

      The box is just to demonstrate the fog works on objects, right?

      That’s correct.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Fog end

      @coder0145

      OK. We can adjust that skybox to disable the fog. Would this be what you are looking for? We can release this over the weekend.

      f2c37ee8-e2f2-44ff-95f6-040d9891ab9e-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Fog end

      @coder0145

      Got it. Which scene are you using? We might be able to give you a way to disable fogging effect for the skybox you are using.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: chatgpt error

      @greeniwastakenyt

      Do you still have this issue? Most likely it was a temporary outage from ChatGPT’s service (OpenAI).

      In addition, whenever you have such outage issues, you can replace the ChatGPT block with the LLM block, which works the same way but connects to a different AI service.

      e41c309b-40cc-4840-ac44-5a95c2c1154c-image.png

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Fog end

      @coder0145

      The fog is added in front of the camera, so no matter which direction you look at through the camera, there is fog. Is there any reason why there wouldn’t be fog above the player’s head?

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Really sad about this

      @ljvb_4

      This issue will be fixed soon.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Can I import anyone elses project?

      @ljvb_4

      Yes, so long as credit is given. Thank you.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Not seeing my project on my user page

      @ljvb_4

      You mean this page? https://play.creaticode.com/users/670f245ae86d0c82b3b3c060

      We will look into it.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: None is the only option

      @coder0145

      That dropdown is automatically populated using the list of sprites in the project.

      According to the tutorial, you need to create another sprite named “Maze”, which will be used to create the walls of the maze. After you do that, then this dropdown will contain the “Maze” option.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Yellow boxes around projects?

      @notjaldolfyt

      Thank you. We will look into this.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Yellow boxes around projects?

      @the_true_odst said in Yellow boxes around projects?:

      It is a bit buggy though, it doesn’t always show.

      Can you let us know where the block count does not show? We are not aware of this issue. Thank you.

      posted in Help
      info-creaticode
      CreatiCode
    • RE: Yellow boxes around projects?

      @notjaldolfyt

      Those orange borders mean those projects are not shared with you. Most likely, they are published (you can play with it) but not shared (you can’t look inside).

      posted in Help
      info-creaticode
      CreatiCode