Create · Design first
Design the game before you build it
“Make it fun” is not a spec. The Design Codex turns a vague idea into a coherent, buildable concept — composed from parts that are known to work, twisted until it's yours.
Spark — a composed starting point
“Walking Sim / Vignette, but perspective” — anchored on Vampire Survivors, built around portal / linked doors.
Vampire Survivors — One-stick horde survival where you only move — weapons fire themselves — and the whole game is your multiplying build racing an escalating swarm.
Walking Sim / Vignette — Story delivered by moving through space — atmosphere and environmental narrative over mechanics; pace is the design.
Portal / Linked Doors — Two openings become one — carry momentum and sightlines through folded space.
perspective — flip who the player is — invert the point of view on the loop
seed 576079902 — reproduce it: npm run design:spark -- --seed 576079902
That's the codex composing, live — a real anchor, genre, verb and twist sampled from the shelves below. A spark is a starting point to bend, never a design to obey.
Tension first
Every design hangs on a spine
Before shelves and twists, the codex asks one question: what tension does the player live inside? One objective, one scarcity, one verb that spends the scarce thing — find that loop and every other module has something to hold onto. The engine can even prove the coupling is load-bearing: remove a system andthe ablation gatechecks the game actually gets worse.
The Design Codex
217 composable modules, indexed for machines
Not a book of advice — a parts bin. Every module carries tags, “use when” guidance and a list of what it composes with, so an agent can actually assemble a design from it.
42
Anchors
Reference-game DNA — what makes each proven game tick, stated so you can borrow it.
36
Genres
Templates with their loops, verify patterns and scope expectations spelled out.
42
Systems
Modular organs — economy, grace, mastery, factions — that snap together.
30
Mechanics
The verb library: dash, parry, rewind, merge, grapple and friends.
23
Antipatterns
Named failure modes, so a design review can point at the trap by name.
10
Recipes
Worked “X but Y” designs — proof the composition method holds end to end.
Straight off the shelf
What a module actually looks like
process
The Spine — tension-first design
Find the one tension a game is about, then derive every element as an expression of it — and audit that each one traces back with a resonance table.
Use when · You want a game whose loop, theme, feel, and setting all pull the same direction — a coupled design, not an assembled one. Run this before (or instead of) the twist.
anchor
Celeste
Precision platformer where brutal difficulty and total forgiveness coexist — grace is a system, assist mode makes the mountain optional not easy.
Use when · Designing a movement-first game where deaths must feel fair and the difficulty needs a humane floor.
antipattern
Decoration
An element that doesn't trace back to the spine — present, but expressing no tension. Weight, not depth.
Use when · You are filling the resonance table and a row's arrow-to-the-spine cell comes up empty.
Hand it to your agent
Paste this into Claude Code, Cursor, or any coding agent. It interviews you first — the building comes after the brief.
Help me design an original game with the Hayao Design Codex, then prototype it.
1. Read the codex index — 217 composable design modules:
https://github.com/hellojanpacan/hayao-js/tree/main/design
(start with design/INDEX.md, then design/00-process/the-spine.md)
2. Interview me. Turn my intent into a one-page brief:
player fantasy, scope, constraints, pillars.
3. Find the spine first — the tension the whole game hangs on —
then compose: an anchor + a genre template + the systems they
imply, and one twist ("X but Y").
Check design/70-antipatterns/ before locking anything in.
4. Show me the brief. Iterate until I sign off — the concept is mine,
the composition is yours.
5. Then prototype it in the default Regalia style:
npm create hayao@latest my-game && cd my-game && npm install
Read AGENTS.md and docs/CONVENTIONS.md, build the core loop first.
6. Prove it works: npm run verify. Run it: npm run dev.
Start with the interview.Using Claude Code?
Install the Hayao plugin
The workflow above, packaged and enforced: authoring skills, commands like /hayao:new-game and /hayao:inspect-api, and a determinism gate — a hook that runs the proof harness and blocks the agent from finishing until it passes. Verification stops being a habit and becomes a wall.
/plugin marketplace add hellojanpacan/hayao-js /plugin install hayao@hayao
Concept already clear in your head?Take the quickstart— gofully from scratch— or, if all you have is something you made and can't put down,start from a spark.