Asteroid Dodge
v1 baseline
- - Basic ship movement
- - Single obstacle speed
- - No score tracking
v2 upgrade
- + Live scoreboard
- + Difficulty ramp over time
- + Power-up and shield mode
AI Coding for Kids
Build Apps and Games with AI
HeyOtto Code turns ideas into real working projects in minutes. Kids build, play, remix, and level up fast - then find every build saved under Projects to keep improving.
Runs in the browser · Nothing to install · Pick up builds anytime in Projects
live build session
> build: asteroid dodge game
+ added ship movement and collision logic
+ added scoring and difficulty ramp
saved to Projects: asteroid-dodge-v1
- Build your first game in minutes
- Apps and games auto-saved in Projects
- Real code, not toy blocks
- Built for ages 8-18 with parent controls
Starter builds kids love (and what they learn)
Small scopes so the first session ends with something on screen — then kids grow the same project into something bigger when they are ready.
- Starter Build
Asteroid Dodge
Pilot a ship, dodge obstacles, and beat your high score.
Learn loops, collision logic, and game state.
- Starter Build
Quiz Battle
Create a trivia game on any topic you love.
Learn arrays, randomization, and scoring systems.
- Starter Build
Habit Streak Tracker
Track habits with streak counters and progress bars.
Learn state updates and persistence basics.
- Starter Build
Pixel Drawing App
Build a mini art tool with colors and brush controls.
Learn events, input handling, and UI controls.
- Starter Build
Flashcard Race
Turn school topics into a fast-paced study game.
Learn timer logic and conditional feedback loops.
- Starter Build
Mood + Music Generator
Match moods to playlists and visual themes.
Learn data mapping and component-driven UI.
AI Games and App
What HeyOtto code ships
HeyOtto Code teaches kids the same tools real developers use — just with Otto as the pair programmer who explains everything along the way.
What you can build
- Games
Memory games, quizzes, puzzles, trivia, card games, and more
- Interactive apps
Calculators, timers, drawing pads, to-do lists, and small tools
- Web pages & UIs
Landing pages, dashboards, forms, and surveys
- Visualizations & animations
Interactive demos, data visualizations, and animated effects
The Stack
HTML
Plain HTML with inline CSS and JavaScript
HTML + Tailwind
Utility-first styling for fast, responsive layouts
React
Interactive components with hooks (useState, useEffect, useRef, and more)
React + Tailwind
Recommended combo for most rich, interactive projects
Libraries Included
- React hooks for state and side effects
- Tailwind CSS for responsive, modern styling
- Lucide icons (Heart, Star, Trophy, and many more)
- Layouts that adapt to different screen sizes
Key constraints
Clear boundaries keep learning focused and the runtime safe for families.
- No external CDN scripts (self-contained bundles)
- No external API calls or fetch requests
- No localStorage access
- Runs in a sandboxed iframe for security
Parent peace of mind: every build is visible in your dashboard and kids create inside family-safe guardrails.
How kids go from idea to playable game with HeyOtto Code
- 1
Pick a build idea
Try “make a dodge-the-asteroids game,” “build a drawing app,” or “make a quiz battle.”
- 2
Otto generates your first playable version
A real app launches immediately with code you can explore and edit.
- 3
Find it in Projects
Your build is automatically saved in Projects so you can reopen and improve it whenever you want.
- 4
Add upgrades and ship new versions
Ask for levels, themes, scoring, difficulty modes, and polish. Each upgrade teaches new coding concepts.
Where builds live
Projects: where builds become a portfolio
Projects is the home for every build: reopen, remix, and show progress over time — without hunting through chat history for the last good version.
One place for every build
Projects becomes a portfolio kids can revisit, remix, and show off.
Pick up exactly where you left off
Auto-save means no “lost work” panic — just reopen and keep going.
Refactor without fear
Rename, reorganize, and simplify as the app grows — like real software.
Versioning habits that stick
Milestones stay in one project thread so progress is easy to see and share.
Starter builds kids love (and what they learn)
- Example direction
Arcade mini-games
Build reaction games, runners, and memory games while learning loops, conditionals, and game state.
- Example direction
Quiz battles and school games
Turn any subject into a game and learn arrays, scoring logic, and randomization.
- Example direction
Creative apps
Make drawing and design tools while practicing event handling, UI controls, and interactivity.
- Example direction
Useful daily tools
Build trackers, planners, and mini utilities kids actually use - and keep improving them in Projects.
Version upgrades kids can feel
Same project name, richer feature set — kids learn to ask for scoped upgrades instead of starting from zero every time.
Quiz Battle
v1 baseline
- - Static questions
- - Single player only
- - Simple result screen
v2 upgrade
- + Random question pools
- + Two-player mode
- + Animated win/loss states
Your Kid's Coding Assistant
Otto isn't just generating code — it's explaining every step, catching bugs, and asking the right questions to help kids think like real developers.
Want me to explain this loop in kid-friendly steps?
I found a bug in your collision logic. Fix it together?
If we add a second enemy type, what state do we need to track?
Every Build Is a Lesson in Disguise
Concepts land because they're tied to projects kids actually want to finish — not abstract exercises from a textbook.
LoopsConditionalsState ManagementDebuggingUIEvent HandlingData StructuresPrompt Engineering
More fun than tutorials. More educational than one-click generators.
Most coding tools force a tradeoff: either fun but shallow, or educational but boring. HeyOtto Code combines both - high-velocity creation kids want to use, with real coding depth and family-safe controls parents trust.