Procedural Generation
What if you could teach a computer to build endless worlds, create infinite treasure, and design a dungeon that goes on forever? Let's do it! 🚀
Endless Possibilities 🎲
Have you ever noticed that every time you start a new world in Minecraft, it looks totally different? Or how the dungeons in games like Hades change on every run? That’s Procedural Generation (or ProcGen)! Instead of a human drawing every single tree and mountain by hand, a programmer writes rules, and the computer rolls virtual dice to build the world for you.
Why Bother with ProcGen?
Imagine trying to build a world as big as Minecraft by hand. It would take a huge team of artists decades! With ProcGen, a small team can write a set of smart rules to generate a massive, unique, and replayable world automatically. It's working smarter, not harder, and it's what makes "infinite" games possible.
How Does It Work? 🤔
Click the button to generate a new item!
The simplest way to understand ProcGen is to imagine the computer has "magic boxes" full of words. It just grabs one from each box and sticks them together! You just played with a treasure generator right now.
Pro-Tip: The Magic of "Seeds" 🌱
Ever wonder how you can share a specific Minecraft world with a friend using just a few numbers? That's a 'seed'! It's a starting number for the random generator. If two computers use the same rules AND the same seed, they'll create the exact same 'random' world. This is how game developers can share, test, and replay their generated worlds.
🛡️ Safety Check!
When you use AI tools, remember the #1 rule: Never share personal information. Don't type your real name, your school, or your address. Keep your prompts about your game world, not your real world. Stay safe, explorer!
🛠️ Let's Build a Loot Generator!
Need random items for your game? Tell our AI Assistant what kind of game you're making, and it will procedurally generate a loot table for you!
🤔 Think Like a Game Designer...
If you gave our AI three secret rules to make good loot, what would they be? Maybe... a cool name 🗡️, a silly description 🤪, and how rare it is ✨? Take a second to think!
Ready? Click below to see the instructions *we* gave the AI.
🤫 Curious about our AI's secret instructions?
"You are an RPG game designer. Generate a fun, kid-friendly JSON array of 5 procedurally generated items based on the user's game idea. Include the item name, a silly description, and a wacky drop rate percentage. Format it nicely with emojis."
This is called a 'System Prompt.' It's a hidden instruction that guides the AI. Learning to write good system prompts is a super-powerful skill called 'Prompt Engineering'!
🔬 Peek Behind the Curtain: How does our site talk to the AI?
When you click the button, our website sends a message to a server over the internet. This is called an API call. The message includes your prompt and our secret instructions. The server asks the AI model for a response, gets it back, and sends it to your browser to be displayed! It looks something like this in code:
async function getAiLoot(userPrompt) {
const response = await fetch("https://api.tomorrowhub.ai/generate", {
method: "POST",
body: JSON.stringify({
prompt: userPrompt
})
});
const lootData = await response.json();
return lootData;
}
📜 Quest Alert: The Clumsy Alchemist!
Grizelda the Alchemist just spilled all her potions! 😱 She needs your help to invent three new ones for her shop. Your mission is to write one perfect prompt for the Loot Generator above. Make sure your prompt asks the AI to create potions that have:
- ✅ A funny name
- ✅ A weird side-effect
- ✅ A super gross ingredient
Go save Grizelda's shop!
🚀 Level Up: Build Your OWN Generator
Seeing code like this can look tricky, but it's just like a recipe for a cake! 🍰 You list your ingredients (the words in each list) and then write one final instruction ('mix one from each list!') to tell the computer what to do.
One of the best tools for this is Perchance.org. Here's what our magic box generator would look like there:
// This is our recipe's name! loot [adjective.titleCase] [material.titleCase] [item.titleCase] // These are our ingredient boxes! adjective flaming spooky gigantic material iron slime diamond item sword helmet banana
🔥 Advanced Challenge: Build It From Scratch!
Ready to go beyond other tools? Your mission is to build the "magic boxes" generator yourself using JavaScript! Programmers build small 'helper' scripts like this all the time to quickly generate placeholder data or test ideas without needing a complex tool. It's a fundamental coding skill.
Fill the boxes below with your own ideas (one per line). Then, write the JavaScript to make the button work!
Your creation will appear here...
🔥 Stretch Goal: Add Item Rarity!
Can you add a fourth box for item rarity (e.g., "Common," "Rare," "Epic")? Then, modify your JavaScript to not only display the name, but also change the color of the output text based on the rarity! This is exactly how games make exciting loot drops stand out.
Beyond Gaming 🎬
This idea of using rules to generate content isn't just for games! It's a superpower used everywhere:
- Movies & CGI: To create realistic forests or huge crowds. See how it was used to build armies in The Lord of the Rings!
- Art: "Generative artists" write code that creates beautiful images. Explore some amazing examples in the p5.js examples gallery.
- Data Science: To create safe, "synthetic" data for testing new programs without using anyone's real information.
👨👩👧 Parent Corner
This isn't just about video games; it's a huge idea about how creativity, rules, and randomness work together. Exploring it with your child is a great way to build worlds and make connections, both on-screen and off.
🎲 Parent & Child Challenge: The Dice Maze!
Here's a fun, no-screen activity! Grab a piece of graph paper and a six-sided die.
- Draw a start and end point on the paper.
- For each square, roll the die. If you roll a 1 or 2, draw a wall in that square. If you roll anything else, leave it empty.
- Keep going until you've built a whole maze. Can you solve it together?
This is exactly how simple procedural generation works: rules + randomness = a unique creation! For a digital next step, you could try building your paper maze in a simple game engine like GDevelop.