Hour of AI 2025
HOW TO BUILD A puzzle game WITH AI
Grades 2 + | Javascript
Make a game just by describing it. In this one-hour lesson, create an immersive world with hidden puzzles and funny characters from scratch step by step. All you need is access to the internet.
At the end of the lesson you will have a game website you can share with your friends and family and play together. The lesson can be completed in an hour or spread over a week to create a game with more detail.
Open this template and follow the lesson plan below:
Lesson Plan
60 Minutes
Overview
Make a game just by describing it. In this one-hour lesson, create an immersive world with hidden puzzles and funny characters from scratch step by step. All you need is access to the internet.
At the end of the lesson you will have a game website you can share and play with your friends and family. The lesson can be completed in an hour or spread over a week to create a game with more detail. With Rosebud, you can make a game just by describing it. It sounds like magic, but in this one-hour lesson, I will give you a step-by-step guide on how to create a multiplayer puzzle game from scratch, in under one hour! You don't need to download anything, and you don't even need to know how to code. All you need is access to the internet.
Although it's easy to get started, Rosebud is unlike any no-code platform you've seen before. It's extremely powerful because AI lets you generate JavaScript code under the hood. This means students can use Rosebud to also learn to code in the process. Creators have been making RPGs, adventure games, and 3D games—all experiences you can create by describing what you want, step by step.
This lesson is written by Rosebud Marketer Andi Bucescu.
Know Before You Start: Fixing Bugs
Is your game stuck somewhere? Did Rosie fail to generate a piece of code? You can fix it by:
- Clicking “Fix it” when she shows you the option
- Going back to an earlier version in the “History” tab
- Explaining your prompt differently
- Asking for help on our Discord
Know Before You Start: Rosebud in Your Classroom
Make sure your school's IT team allows access to rosebud.ai! Some school servers block gaming and AI sites, and you may have trouble accessing it on a school network.
Let's Get Started!
Classroom Slides
Section 1: Building the world (20 min)
Step 1: Set up the Game
1. Setting up your game is as simple as opening this Rosebud game link.
2. Clicking the remix button in Rosebud.
Now, your Rosebud project editor should show a game on the right side of the screen, and a prompt bar on the left.
✅ Checkpoint 1:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Step 2: Change the Environment
A good way to start crafting a game from scratch is to make it look pretty!
You can turn this template into anything you can imagine. Simply describe it to Rosie. The options are endless: add a sunset scene, turn it into a nighttime horror scene, add rain, or make it Dune themed!
What coding model are you using in the prompt bar? Here’s a breakdown:
- Use Sonnet 4.5 for a smart, affordable model (recommended)
- Use ai-agent for more complex tasks (it helps you skip a few tasks!)
Changing the Atmosphere
If you’re using Sonnet, Gemini, or Grok, let’s make sure you’re working in the right code base. This step will make sure Rosie doesn’t get overwhelmed, and working in the right tabs.
1. Click on the Code Tab
2. Click on the purple box next to “ai” so it turns white
3. Make sure all the boxes in the ai menu are white
4. Go back to the preview tab, and click into the prompt bar
5. Describe your ideal atmosphere, and send!
Message Rosie:
Feel free to copy one of these messages, paste it into Rosebud, then hit submit to display the background in your game:
“Turn this into a magical sunset scene, and add in more deer to the scene”
or
“Make the sky green and the grass blue!”
or
“Add a castle in the middle of the scene”
or come up with your own!
Explore your game to make sure that you're happy with the new atmosphere before proceeding to the next step.
✅ Checkpoint 2:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Step 3: Plan & Navigate the Assets
Now that we have our atmosphere in place, it's time to add some fun elements to our game.
Navigate Assets
1. Go to the assets tab, and scroll through all the pre-generated assets that exist in Rosebud.
2. Select a few that you like, and start thinking about what challenged or riddles you'd link to each. In the next section, we'll show you how to add them to your game, and how these can be liked to riddles. But don't shy away from adding a different kind of challenge!
(PS: you can also experiment with creating your own, or downloading 3D assets from other gaming websites)
✅ Checkpoint 3:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
01 May, 2025
⚠️ Important Note:
You’ve probably reached the free prompt limit for this tutorial by now.
Use code HOUR-OF-AI-ROSE for 50% off an indie dev membership to continue
We sincerely apologize — due to increased user activity and in order to ensure a high-quality experience for everyone, free prompts are now limited. We truly appreciate your understanding.
Section 2: adding puzzles (20 min)
Step 4: Integrate Objects
Right now, you have a plan for what you want to add into your game. We'll show you how to add in each object, and how to add in a riddle linked to each.
Add in Objects
1. Hover over one of your favorite objects.
2. Click on the “+”, then send the prompt in the prompt bar. Rosie will add it to your game.
3.Repeat 2-4 times with other objects that you like!
✅ Checkpoint 4:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Step 5: Design Riddles
We will add a riddle for each object you chose to add into your scene. Before showing you the basic steps you need to follow, here’s what a riddle could look like:
If you added in a chest, you could prompt rosie to show this riddle when you get near it:
“I’m a wooden box with iron bands,
riches hidden in my hands.
Open with a key, and you’ll be blessed --
what am I?”
Then, you have to type in the correct answer to get a reward!
Design Riddles
1. Decide on a riddle to show for an object
2.Prompt Rosie to show the riddle when you approach the object
Message Rosie (example):
For the chest, add an alert that tells a player “this object is hiding a prize” and add a control to reveal the riddle if they are near it. The riddle to be revealed is “[insert riddle]”
.jpeg)
3.Prompt Rosie to add an answer box
.jpeg)
4.Repeat 2-4 times with other objects
Message Rosie (example):
Once the riddle is revealed, add in an answer box where the player can type in their answer. The correct answer is “treasure chest”. If the player types the correct answer, the screen says “success” and the chest disappears. If they type the incorrect answer, say “uh-oh! Try again!”
Step 6: Add in Rewards
Now that your riddles are working, let's get your player rewards for solving each one! We'll show you how to reward them with coins for each correct answer, but you can expand the rewards to encapsulate anything that you like! Imagine power-ups, different cash rewards, or extra decorations for their world!
Let's see how to incorporate coin collection.
Add in a Coin Reward
1. Prompt Rosie to add in a coin counter
Message Rosie (example):
Add in a coin tracker visible to each player. this starts with 0 when they start the game. every time they solve a riddle, they receive 100 coins.
2. Change success message
Message Rosie (example):
Every time a user gets a correct answer, change the success message to “ka-ching! You just solver a riddle and got 100 coins. Keep it up!”
3. Repeat 2-4 times with other objects, or add different rewards!
Message Rosie (example):
If the user solves the riddle linked to the chair, they get 500 coins. Change the success message and coin tracking to reflect this.
✅ Checkpoint 5:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Section 3: integrating npcs (20 min)
Step 7: Change the NPC's look
What are NPCs?
NPCs (Non-Player Characters) are the people, animals, or creatures you meet in a video game that you don’t control. Instead, the game controls them. They might give you quests, sell you items, or just make the world feel alive. Think of them like the shopkeeper, the guard, or even the villager who waves at you when you walk by: they’re all NPCs!
We’ll learn to change their looks, personalities, and teach them to reveal clues for each riddle.
Change the NPC's look
Remember the code tab? It’s time to go back and make sure “ai” is selected, as this controls the NPCs! You only need to do this if you’re using Sonnet, Gemini, or Grok.
1. Click on the code tab
2. Click on the white box next to "ai" so it turns purple
3. Make sure all the boxes in the ai menu are purple
4. Click on the purple box next to "core," "data," "game," "multiplayer," and "ui" so they turn white
5. Make sure you read Rosie’s responses, she’ll let you know if she needs access to any other code tabs!
6. Find the NPC in your world. There’s an NPC already in your game. Can you find it? Chat to them to get a sense for how they speak.
7. Navigate to the assets tab, and find them a new look.
Message Rosie (example):
Change my current NPC to “male casual”.
Step 8: Change NPC’s Personality
We got the NPC to look the way you wanted them to! Now, let's make them talk like you would like them to as well! We'll work onchanging their name and communication style.
Change Your NPC's Personality
1. Prompt Rosie to change your npc’s name and personality
Message Rosie (example):
Change my NPC to talk like a grumpy grandpa. His name is Uncle Tom, and he likes to talk about how going to school was harder back in his day.
2. Prompt Rosie to reveal hints through npcs.
Message Rosie (example):
Uncle Tom should be able to give me hints to solve my riddles if I ask for them in the chat. Please teach him the riddles and correct answers.
✅ Checkpoint 6:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Step 9: Share Your Game
Look at that! An hour has flown by and your game is fully playable! Well done!
It's time to share your game so that you and your friends can enjoy it together. Here's how to find your shareable link:
Publsih Your Game
1. Click share
2. Click “Publish & Share”
3. Share the link and play with your friends!
✅ Checkpoint 7:
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Bonus Section: improve the Game
Step 10: Go Further
Here’s what you can do to improve your game:
1. Add in more NPCs (they can appear if you answer a question wrong!)
2. Add in a side quest that invites you to build a house
3. Add in another side quest (for example, tell Rosie to hide 5 keys in your game. If you collect them all on time, you can receive a secret prize)
Wrapping Up
Congrats, you’ve just built an awesome puzzle game for you and your friends from scratch!
And you did it all without having to code.
Have fun making more games with Rosie!
– Rosebud Team
Explore Other EDUCATIONAL GAME TEMPLATES
3D Adventures
Ask Rosie to create a forest using geometric shapes!
PlAY NOW
RANDOMIZER
Create your own randomizer! Ask Rosie to change the sections to match your topic.
PlAY NOW
MATCHING GAME
Create your own matching game! Change the images and text on the cards to match your topic.
PlAY NOW
GROUPING GAME (WORDLE)
Create your own Wordle-like grouping game! Ask Rosie to change the groups and words to whatever you want.
PlAY NOW