Meta Coding Game

Learn the craft, not the tool: a game that teaches the concepts behind the code your AI writes. Inspiration I work as an AI engineer. My background in scientific computing taught me to read AI-written code with the right amount of suspicion. Even so, I still run into problems where I don't know enough to catch the AI's mistakes. Learning more programming languages doesn't fix that. A language is a means, not the end. What helps, and in the age of coding agents may be essential, is understanding the craft rather than the tool: why a loop needs a stopping condition, when a hash map beats a list, why a nested loop turns O(n) into O(n²), what happens between a browser, a server and a database, and why promises run before timers. If I can vibe-code parts of an application without knowing the concepts the coding agent relies on, I can't properly review what it produced, and the serious bugs are exactly the ones I'll miss. This project gamifies the parts of a software engineer's job that still matter in the post-LLM era: reasoning about programs, predicting what they do, and verifying them. What it does 1. The block game: programming concepts without a language Learners snap blocks together and Bolt, the robot, runs the program on a grid. No syntax, only thinking. - 10 concepts: sequencing, loops, conditionals, while loops, functions, variables, recursion, debugging, algorithms and efficiency (Big-O). - More than "walk to the exit": - painting puzzles: draw a square, a spiral, windows or a fence, or mow a lawn row by row; - gems, keys and locked doors; - mazes; - step budgets; - debugging levels that start with a buggy program to fix. - One program, several worlds: levels have 2 or 3 worlds that one program must solve, so learners have to write general logic instead of memorising a path. - Predict, run, verify: run, step one block at a time, watch the running block highlight and the robot's sensors light up, then read why it failed. - Big-O you can see: the worlds come in different sizes, so after each run the game fits the step counts against world size and reports O(1), O(n) or O(n²). Efficiency levels start with a program that works but is too slow: make it faster. - New levels every time: 34 hand-built levels, each played once. After that every level is newly made: designed by Muse Spark with a different map layout (corridor, zigzag, maze, rooms, islands, spiral, arena, river), or generated offline. - Show as code: the same program in Python or JavaScript, or in any other language through Muse Spark. 2. Tracks: the software engineer's toolkit 58 topics in 6 tracks. Every challenge is interactive, and the game computes the correct answer itself. - Data structures: stack, queue, linked list, array, set, hash map, heap, binary search tree, trie and graph. Predict the final state after a series of operations, then watch it animate step by step. - Algorithms: - binary and linear search (you open boxes and count your checks); - bubble, insertion, merge and quick sort (sort bars yourself, then compare all four by comparison count); - BFS, DFS and Dijkstra (click nodes in visit order, with hints showing the queue, stack or known distances); - topological sort, greedy, dynamic programming, two pointers, backtracking, hashing and Big-O. - Async & languages: callbacks, promises, async/await and the event loop (read real JavaScript and order its output, checked by an event-loop simulator), race conditions, closures, objects, errors, testing, git and JSON. - Frontend & UI: the DOM, CSS layout, events, state and rendering, accessibility, responsive design. - Backend & APIs: HTTP, REST, status codes, databases and SQL, indexes, authentication, caching. - Servers & cloud: client/server, DNS, load balancing, scaling, CDNs, message queues, containers, serverless. - Find it in a photo: photograph a pile of books or a line of people. SAM 3.1 outlines and numbers each one, and the game turns your photo into a stack or queue challenge. - Animations: Manim animations explain key topics. Muse Spark writes new ones on request. 3. Adaptive and story-driven - Adaptive learning loop: a mastery score per concept; three failures in a row bring a gentler level built around the mistake; the next level is designed in the background while you play. - Story mode: Muse Spark writes a 10-chapter adventure, one chapter per concept, each in a new setting with its own map layout. Every chapter's level is designed as the next scene of the story. - Level of the day: one Muse-designed level per day, shared by every player, with the history kept. - Coach: hints in three levels of detail, "explain my program", real-world examples with sources, and free questions answered by an agent that can run your program. - Curriculum architect: Muse Wonder reads the whole play history, diagnoses misconceptions such as off-by-one errors or recursion without a base case, and plans the next levels and a boss level. 4. Learning from the real world: the Meta Lab - Sketch → level: draw a level on paper and photograph it. - Speak your program: say what Bolt should do, live. - Notes → world: upload course notes as a PDF and get levels themed on your subject. - Real-world loops: find the loop in a video of something repeating. - Clap a loop: clap a rhythm and see it as a loop. - Robot studio: design and edit your own robot. - World art: paint new worlds. - Ghost player: an AI plays the level in your browser tab. 5. Everywhere you code - MCP App: the levels play inside AI chats such as Claude, VS Code and Goose as an interactive board, with tools to list, run, generate, validate and translate levels. - Built-in project skills for Muse Code (AGENTS.md). 6. Polish - A light visual style based on Meta AI and Muse, with a Muse-style squiggle avatar. - Four worlds painted by Muse Image, switched automatically by concept. - Background music generated live in the browser, with a mood per concept, plus sound effects. - Works on phones, and keyboard-accessible. How we built it: Meta's models ┌─────────────────┬─────────────────────────────────────────────────────────────────────┐ │ Model │ What it does in the game │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ │ Level designer agent (with map layouts), coach and ask agent, story │ │ Muse Spark 1.3 │ mode, level of the day, Tracks challenges, Manim animations that │ │ │ fix themselves from render errors, code bridge, PDF notes, video │ │ │ understanding │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ Muse Image │ The four built-in worlds and the robot; new themes; multi-turn │ │ │ robot editing │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ SAM 3.1 │ Sketch-to-level detection, robot cut-outs, video object tracking, │ │ │ Find it in a photo │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ Muse Wonder │ Curriculum in background mode, boss levels, Ghost player (computer │ │ │ use) │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ Muse Spark 1.2 │ Clap a loop (audio understanding) │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ Muse Voice │ Speak your program (realtime and file) │ │ Transcribe │ │ ├─────────────────┼─────────────────────────────────────────────────────────────────────┤ │ Muse Spark │ Open-weight engines that can replace Muse Spark for designing and │ │ Open, Muse │ coaching │ │ Glimmer │ │ └─────────────────┴─────────────────────────────────────────────────────────────────────┘ Architecture: TypeScript throughout. - A shared engine (shared/) runs in the browser, the Node/Express server and the MCP server: the block language, interpreter, BFS solver and validator, level generator, learner model, Big-O analysis, maze generator, and the Tracks simulators. - The browser UI is vanilla TypeScript: a canvas renderer, the block editor, and Web Audio music. - API keys stay on the server, and every model feature falls back to an offline mode. Verification is part of the design: - Every level, whether hand-built, Muse-designed, sketched or from notes, passes a real simulator. A breadth-first search proves it can be solved and that it really needs its concept: a plain list of moves must not fit a loops level, and one fixed path must not solve every world. - Every Tracks answer is computed by the game's own simulators, never taken from a model. - Model-written Manim code is checked by rules (it may import only Manim, with no file or process access) and rendered in a separate process with a time limit and no secrets. Algorithms inside the game: - BFS over bitmask states, for level validation; - a recursive-backtracker maze generator; - least-squares log-log fitting for Big-O; - flood fill for sprite cut-outs; - peak detection on SAM's video tracks; - simulators for 8 data structures, sorting, graphs and the event loop. Challenges we ran into - Teaching versus solving: making AI-designed levels that teach. A model will happily produce a level that is solvable but doesn't need the concept, which is why the validator and the designer agent's tool loop exist. - Trusting the AI: we didn't want model mistakes to reach learners, so every challenge answer is computed independently. - Untrusted code: running model-written Python (Manim) safely. - Beyond walking: finding mechanics other than "move forward". Painting puzzles, step budgets and multi-world levels made concepts like recursion and Big-O something you can see. Accomplishments we're proud of - Big-O is measured on the learner's own program, not just explained. - An agent loop where Muse Spark and a real simulator iterate until the level is right. - Muse Spark writes and repairs its own Manim animations. - SAM 3.1 turns a photo of your bookshelf into a data-structure lesson. - The same levels play in the browser and inside AI chats as an MCP App. - Tested: 24 unit tests, 12 browser tests, and every level checked by the simulator. What we learned The most useful skill alongside AI is the ability to predict and verify what code will do. The game is built around that loop, and so is its own architecture: use the model, then check it. What's next - More Tracks, with interactive simulations for databases and system design. - A teacher dashboard. - Multiplayer daily challenges. - Letting learners review AI-written code for planted bugs: debugging levels where the "student" is a coding agent. Built with: TypeScript, Node.js, Express, Vite, HTML Canvas, Web Audio, Manim, MCP SDK and MCP Apps, Playwright, and the Meta Model API.