Your AI Adventure Starts Here
Learn to talk to Claude and build anything you can imagine.
๐ YOUR QUEST MAP
๐ฏ SKILLS YOU'LL UNLOCK
Navigate your computer like a pro
Learn to talk to AI and get great results
Create real apps that run in browsers
Build projects you can show off to friends
Terminal Basics
Learn to speak the computer's secret language
MISSION BRIEFING
Before you can team up with your AI coding buddy, you need to learn the terminal - a secret text-based way to control your computer!
Think of it like this: normally you click on things with your mouse. But coders type commands instead - it's like texting your computer and having it do exactly what you say!
๐ Opening Your Terminal
- Press Cmd + Space (opens Spotlight)
- Type
Terminal - Press Enter
- Press the Windows key
- Type
PowerShell - Click to open
- Press Ctrl + Alt + T
- That's it! ๐
โจ๏ธ Your First Commands
Try these in the simulator below, then on your real terminal!
pwd
+5 XP
"Print Working Directory" - shows your current location
๐ง Memory trick: "Print Where am I, Dude?"
ls
+5 XP
Lists all files and folders in your current location
๐ง Memory trick: "List Stuff"
cd [folder]
+5 XP
"Change Directory" - moves you to a different location
๐ง cd .. goes back one folder
mkdir [name]
+5 XP
"Make Directory" - creates a new folder
๐ง Example: mkdir claude-quest creates a folder called "claude-quest"
clear
+5 XP
Clears the terminal screen - nice and tidy!
๐ฎ TERMINAL SIMULATOR
Practice commands right here! Complete the challenges below.
๐ฏ CHALLENGE MISSIONS
pwd to see where you are
ls to list files
cd Documents
mkdir claude-quest and press Enter
Meet Claude Code
Your AI Coding Companion
MISSION BRIEFING
Now you're going to meet your new teammate: Claude Code! It's an AI that understands what you want to build and helps you create it.
Think of Claude as a super-smart coding buddy who never gets tired of your questions!
๐ฅ๏ธ Time to Use a REAL Terminal!
In Level 1, you practiced with a simulator in your browser. Now it's time to use a real terminal on your computer!
Open your terminal and put it side-by-side with this website so you can follow along.
How to open Terminal on Mac:
- Press
Cmd + Spaceto open Spotlight - Type "Terminal" and press Enter
Or find it in Applications โ Utilities โ Terminal
How to open Terminal on Windows:
- Press
Windows key, type "PowerShell" - Click "Windows PowerShell" to open it
Or right-click the Start button and select "Terminal"
๐ง Installing Claude Code
Before we can use Claude, we need to install some things. Ask a parent or guardian to help!
Install Node.js
First, check if Node.js is already installed. In your terminal, type:
node --version
If you see a version number (like v18.0.0), skip to Step 2!
If you get an error, you need to install Node.js:
- Go to nodejs.org
- Click the big green "LTS" button (LTS = stable version)
- Open the downloaded file (it ends in .pkg)
- Click "Continue" through each step, then "Install"
- Enter your Mac password when asked
- Close and reopen Terminal, then try
node --versionagain
- Go to nodejs.org
- Click the big green "LTS" button (LTS = stable version)
- Open the downloaded file (it ends in .msi)
- Click "Next" through each step (default options are fine)
- Click "Install", then "Finish"
- Close and reopen PowerShell, then try
node --versionagain
Install Claude Code
Now install Claude Code with this command:
npm install -g @anthropic-ai/claude-code
This downloads Claude Code to your computer. It might take a minute!
โ ๏ธ Getting a permission error?
If you see "EACCES" or "permission denied", try one of these fixes:
Mac/Linux - Option 1 (easiest): Add sudo before the command:
sudo npm install -g @anthropic-ai/claude-code
Enter your Mac password when asked (you won't see it typing - that's normal!).
Mac/Linux - Option 2 (better long-term): Fix npm permissions:
sudo chown -R $(whoami) ~/.npm
Then try the install command again (without sudo).
Get an API Key
Parents: This step requires creating an Anthropic account.
- Go to console.anthropic.com
- Create an account or sign in
- Go to "API Keys" and create a new key
- Copy the key (you'll need it in the next step)
The first time you run Claude, it will ask for this key.
Create Your Project Folder
Remember the claude-quest folder from Level 1? That was practice! Now let's make a real one:
cd ~/Desktop && mkdir claude-quest && cd claude-quest
cd ~\Desktop; mkdir claude-quest; cd claude-quest
This creates your project folder on your Desktop and moves into it!
๐ Starting Claude Code
You're ready! In your terminal (inside the claude-quest folder), type:
claude
The first time you run it, Claude will ask for your API key. Paste it in and press Enter!
You'll see Claude Code start up with a welcome message.
๐จโ๐ฉโ๐ง Note for Parents
Claude Code asks for permission before doing things like creating files. This is a safety feature! However, the prompts can be confusing for kids.
Option 1 (Recommended for learning): Use normal mode. Help your child understand the permission prompts - it teaches good habits!
Option 2 (Smoother experience): Start Claude with:
claude --dangerously-skip-permissions
This skips permission prompts. Only use this in a safe folder where Claude can freely create and edit files.
๐ฌ Talking to Claude
Claude understands plain English! Here are some things you can say:
โก Power Tips
Be Specific
Instead of: "Make me a game"
Try: "Make a number guessing game where I guess 1-10"
Follow Up
"Can you explain that again?"
"What does that line do?"
No Dumb Questions
Claude loves to explain things! If you don't understand, just ask again.
๐ฎ Claude Commands
/help
See all commands
/clear
Fresh conversation
Ctrl+C
Exit Claude
๐ฏ CHALLENGE MISSIONS
Complete these on your REAL terminal with Claude Code!
claude
/help command
Your First Prompts
Learn to Ask Claude to Build Things!
MISSION BRIEFING
This is where the magic happens! You'll learn to prompt Claude to build cool things.
The secret to great AI prompts: Be specific about what you want! Tell Claude what to build, how it should work, and what it should look like.
๐ฎ PROMPT PRACTICE
Copy each prompt, paste it to Claude, and watch the magic happen!
Generate epic random gamer tags!
Create a gamer tag generator that makes random cool names by combining adjectives + nouns + numbers (like "ShadowNinja_99" or "EpicWolf_X"). Let me click to generate new ones!
Roll different types of dice for games!
Create a dice roller where I can roll different dice (d4, d6, d8, d12, d20). Show buttons for each dice type and animate the roll!
Guess the secret number - higher or lower!
Create a number guessing game! Pick a random number 1-100, let me type guesses, tell me "too high" or "too low", count my attempts, and show a celebration when I win!
Calculate weapon damage with crits!
Create an RPG damage calculator! I enter base damage, it checks for critical hits (20% chance for 2x damage), adds random variance, and shows the total with cool visual effects!
Countdown timer like in games!
Create an esports match countdown timer! Click to start, show big dramatic numbers counting down from 10, then flash "MATCH START!" with epic effects!
Battle the computer - best of 3!
Create rock paper scissors! Click buttons to choose, play against the computer, best of 3 rounds. Show each choice with emoji, track the score, and declare a champion!
๐ Opening Your Creation
Claude will create an HTML file. To see it:
- Find the .html file in your claude-quest folder
- Double-click it to open in your browser!
๐ง The Art of Iteration
Your first version is just the start! Try asking Claude to improve it:
Pro tip: Good prompts are specific! Instead of "make it better", try "add a confetti animation when I win".
Level Up Your Projects
Master the Art of Iteration!
MISSION BRIEFING
Your simple projects work, but they could be SO much cooler! Time to learn the pro skill: iteration.
Iteration means making something better step by step. The best creators don't get it perfect the first time - they improve it!
๐ฏ The Iteration Loop
Pro creators follow this cycle:
Build
Create a basic working version
Test
Try it out, find what's missing
Improve
Ask Claude to add one feature at a time
The key: One change at a time! Don't ask for 10 features at once - add them step by step.
๐ UPGRADE CHALLENGES
Take any project from Level 3 and make it awesome! Here are upgrade ideas:
Make it look professional!
Make this look more professional: add a dark gaming theme with a gradient background, make the buttons glow when I hover, and add smooth animations when things change.
Add audio feedback!
Add sound effects! Play a click sound when buttons are pressed, a success sound when I win, and a fail sound when I lose. Use the Web Audio API or audio elements.
Remember my high scores!
Add localStorage to save my progress! Save my high score and display it. When I come back, my record should still be there. Add a "Reset" button to clear saved data.
Works on phones too!
Make this work great on mobile phones! Buttons should be big enough to tap, text should be readable, and it should look good on small screens. Use responsive CSS.
Add confetti, shakes, and more!
Add exciting animations! When I win, show confetti falling. When something big happens, shake the screen. Make numbers bounce when they update. Make it feel alive!
Add something totally new!
Add a new feature I didn't have before! [Describe what you want - like "add a leaderboard", "add difficulty levels", "add a history of past rounds", or "add multiplayer mode"]
๐ก Pro Prompting Tips
Be Specific
"Add a red glow" is better than "make it look cool"
One Thing at a Time
Ask for one change, test it, then ask for the next
Describe Problems
"The button doesn't work when I click it" helps Claude fix it
Share Examples
"Make it look like Fortnite's menu" gives Claude a clear target
Epic Web Apps
Build Something Amazing You Can Show Off!
FINAL MISSION
This is it. The final boss. Time to build a REAL web app - something big enough to show your friends!
Pick an epic project below, or create your own idea. These are bigger projects, so take your time!
๐ฎ EPIC WEB APP PROJECTS
Choose a project that sounds awesome to you!
Battle Royale Simulator
Fortnite-style survival in the browser!
Create a web app "battle-royale.html" - a battle royale simulator game! Show a map grid where I can move around. Find loot (weapons, shields, meds) by exploring. A storm circle shrinks every 30 seconds. Fight AI enemies. Track health, shields, and inventory with a cool HUD. Dark theme with neon accents!
- "Add keyboard controls (WASD to move)"
- "Make loot have rarity colors like Fortnite"
- "Add a kill feed that shows eliminations"
Brawler Arena
Brawl Stars-style character battles!
Create a web app "brawler.html" - a turn-based battle game! Character select screen with 4 brawlers (Tank, Assassin, Healer, Sniper) - each with unique stats, a basic attack, and a special ability. Battle against an AI enemy. Show health bars, ability cooldowns, and battle log. Animated attacks!
- "Add character portraits and descriptions"
- "Make health bars animate when taking damage"
- "Add a 'Super' ability that charges up"
Crafting & Inventory
Minecraft-style crafting system!
Create a web app "craft.html" - a Minecraft-inspired crafting game! Click to mine resources (wood, stone, iron, diamond, coal). Drag-and-drop inventory system. 3x3 crafting grid where I place items to craft tools and items. Show recipe book. Track total items crafted. Pixelated graphics style!
- "Add tool durability that decreases with use"
- "Make better tools mine faster"
- "Add achievements for first craft of each item"
Loot Box Simulator
Open boxes, collect rare items!
Create a web app "lootbox.html" - a loot box opening simulator! Earn coins over time. Buy different box tiers (Common $10, Rare $50, Legendary $200). Epic unboxing animation! Items have rarity colors (grayโgreenโblueโpurpleโgold). Collection page showing all items and completion %. Satisfying effects!
- "Add a 'pity system' - guaranteed rare after X opens"
- "Make duplicate items give coins back"
- "Add sound effects for different rarities"
๐ก Or Create Your Own!
Have a different idea? Go for it! Here are some starters:
Tournament bracket maker
Click-speed aim trainer
Random dungeon map generator
Game stats dashboard
Character creator with export
Virtual pet / Tamagotchi
Achievement unlock system
Fake hacker terminal
๐ ๏ธ Pro Tips for Big Projects
Start Small
Get the basic version working first. Add features one at a time.
Test Often
Refresh and test after each change. Easier to fix bugs early!
Save Progress
Ask Claude to add localStorage so your game saves between sessions.
Style Last
Get it working first, then make it pretty. Function before fashion!
โ Boss Level Checklist
Code Arcade
Build Classic Games That Never Get Old!
๐น๏ธ WELCOME TO THE ARCADE
Time to level up your skills by building the games you love to play! Each of these classic arcade games will teach you new tricks.
๐ฎ ARCADE CLASSICS
Build at least 3 of these 6 legendary games to complete the level!
The classic! Eat food, grow longer, don't hit yourself!
Create a Snake game! Arrow keys to move, eat the red food to grow, game over if you hit yourself or the walls. Show the score and a "Play Again" button. Make the snake green and the food red!
The OG video game! Paddle vs paddle action!
Create Pong! Two paddles (W/S for left, Up/Down for right), a bouncing ball, first to 5 points wins. Add sound effects when the ball hits paddles. Show the score at the top!
Smash all the bricks with your bouncing ball!
Create Brick Breaker! Move paddle with mouse/arrows, bounce ball to break colorful bricks. Different colored bricks = different points. 3 lives, show score. Celebration when all bricks are gone!
Quick reflexes! Click the moles before they hide!
Create Whack-a-Mole! 9 holes in a grid, moles pop up randomly for 1 second. Click to whack them for points. 30 second timer. Show score and play "bonk" sound on hit. High score tracker!
Flip cards and find matching pairs!
Create Memory Match! 16 cards (8 pairs) with emoji on them. Click to flip, match 2 to keep them revealed. Count moves and time. Shuffle on new game. Celebration animation when you win!
How fast can you type? Race against the clock!
Create a typing speed test! Show a paragraph to type, highlight correct/wrong letters as you type. Calculate WPM (words per minute) and accuracy. Multiple difficulty levels with different texts. Save best score!
๐ฅ BONUS CHALLENGES
Make your arcade games even better with these upgrades:
Space Explorer
Launch Into Cosmic Coding Adventures!
๐ MISSION BRIEFING
Welcome to Space Command, cadet! Your mission: build incredible space-themed projects that would make NASA jealous.
๐ธ SPACE PROJECTS
Complete at least 3 of these 6 cosmic creations!
Defend Earth from incoming space rocks!
Create Asteroids! Spaceship in center, rotate with arrows, thrust forward with up, shoot with space. Asteroids drift across screen, break into smaller pieces when shot. Score points, 3 lives!
Interactive solar system explorer!
Create an interactive solar system! Sun in center, planets orbiting at different speeds. Click a planet to see facts (size, distance from sun, moons). Zoom in/out controls. Make orbits visible with dotted lines!
3... 2... 1... LIFTOFF!
Create a rocket launch simulator! Countdown from 10 with dramatic effects. Rocket launches with fire animation, camera follows it up. Show altitude, speed, fuel. Stage separation at certain heights. Land on the moon!
Classic alien defense! Pew pew!
Create Space Invaders! Grid of aliens moving side-to-side and down. Player ship at bottom, move with arrows, shoot with space. Aliens shoot back randomly. Shields for cover. Waves get faster!
Navigate the night sky!
Create a star map! Dark background with twinkling stars. Show major constellations (Big Dipper, Orion, etc.) - click to highlight and see the name and mythology. Add a search feature to find constellations!
Design your own spacecraft!
Create a spaceship builder! Drag and drop parts: cockpit, wings, engines, weapons, thrusters. Calculate ship stats (speed, firepower, fuel). Color customization. Save/load designs. "Launch" animation when done!
Fantasy Quest
Forge Legendary RPG Adventures!
โ๏ธ ENTER THE REALM
Welcome, brave coder! In this realm, you'll forge RPG systems, magical worlds, and epic adventures. This is where true legends are made!
๐ก๏ธ LEGENDARY PROJECTS
Complete at least 3 of these 6 epic creations to become a Legendary Coder!
Design your hero's look and stats!
Create an RPG character creator! Choose race (human, elf, dwarf, orc), class (warrior, mage, rogue, healer). Customize appearance with dropdowns. Distribute stat points (STR, DEX, INT, etc.). Generate a character portrait and stat card!
Epic combat system with strategy!
Create a turn-based battle system! Hero vs Monster. Choose actions: Attack, Defend, Magic, Item. Health bars, damage numbers that float up. Critical hits with special effects. Victory/defeat screens with XP rewards!
Manage your loot and gear!
Create an RPG inventory! Grid of slots, drag items to rearrange. Item types: weapons, armor, potions, quest items. Click to see item stats and description. Equip slots for head/chest/weapon. Gold counter. Sell items to shop!
Explore procedural dungeons!
Create a dungeon crawler! Grid-based map, move with arrows. Fog of war (only see nearby). Random rooms with treasures or monsters. Simple combat on encounter. Find the exit to go deeper. Track dungeon level and score!
Track your heroic adventures!
Create a quest log system! List of quests with titles, descriptions, objectives. Mark objectives complete with checkboxes. Quest categories: Main, Side, Daily. Show rewards (XP, gold, items). Completed quests section!
Combine elements to create magic!
Create a spell crafting system! Combine elements (fire, water, earth, air, light, dark) to discover spells. Fire+Air=Fireball, Water+Earth=Mud, etc. Show spell effects with animations. Spellbook to track discovered spells. Secret combinations to find!
๐ ULTIMATE CHALLENGE
Ready for the ultimate test? Combine multiple systems into one epic game!
๐ THE DRAGON SLAYER
Create a complete mini-RPG: Character creation โ Explore dungeon โ Find items โ Battle dragon boss!
Create "Dragon Slayer" - a complete mini RPG! Start with character creation (name, class). Explore 5 dungeon rooms finding items and fighting small monsters to level up. Final room has a dragon boss. Turn-based combat. Win = celebration! Lose = try again!