This skill teaches Claude Code to build playable 3D action games for the browser

Chinese AI blogger 歸藏 (Guizang) has turned what he learned from an AI game project into a "skill" for Claude Code and Codex. It's meant to help AI coding assistants build a 3D action game that runs in the browser. You can play the demo, "雾锁山门", right on your phone or PC.

Tools Nov 11, 2026 8 min read Source: GitHub (neue Projekte)
Illustrative image, AI-generated

What it's about

Chinese AI writer and blogger 歸藏 (Guizang, known on X as op7418) has published a project on GitHub called guizang-game-skill. It's a skill: a bundle of instructions, checklists and scripts that an AI coding assistant like Claude Code or Codex loads when needed and then follows like a playbook. This one is meant to teach the AI to build a complete top-down 3D action game that runs right in the browser, with characters, a combat system, effects, music and voice acting.

The proof is the demo game "雾锁山门" (roughly: "Mist Seals the Mountain Gate"), set in the Chinese fantasy genre known as xianxia. You can try it without installing anything, on PC or smartphone, at op7418.github.io/guizang-game-skill. The repository is at github.com/op7418/guizang-game-skill.

The demo: what the AI built

"雾锁山门" is small but complete: one scene, a fight against a group of regular enemies and a boss battle, plus a story and voice acting. The author says his only brief was "Chinese style, xianxia". The AI made every creative decision on its own.

  • Graphics: grass that sways in the wind, layered fog, snow, mountains in the background and reflections on flooded stone platforms. It all runs on a custom rendering pipeline built on three.js, a popular JavaScript library for 3D in the browser. It uses only WebGL, the most widely supported browser graphics API. That's why the game runs on phones, PCs and inside embedded mini-app environments.
  • Characters and objects: 5 rigged characters (so they can be animated), 2 weapons, 12 props and 5 types of enemy drops. The process started with concept art from Jimeng, ByteDance's image generator. Tripo then turned the art into 3D models. The AI wrote the prompts for both itself.
  • Combat: a three-hit combo, dodging, blocking, parrying and finishers, plus healing potions, riding a flying sword and a special attack called "万剑归宗" (roughly "Ten Thousand Swords Return"). The boss has two phases, a cutscene and its own lines of dialogue.
  • Audio: 8 voiced lines, music, ambient sound and sound effects.

The raw assets came to almost 100 MB. In the end, everything fits into a single HTML file of about 33 MB, including models, textures, music and voice acting.

Version Description
Online version Shows the scene first and loads the rest in the background; virtual joystick on phones; adjustable graphics quality, HD textures and key bindings
Single file one HTML file of about 33 MB, works offline
Mini-app version built for the limits of mini-tools in the Xiaohongshu app (no network, no WASM, 10 MiB max), about 8 MiB

All three versions come from the same source code.

The cost: 6 hours and 450 million tokens

According to the README, the game was built in one afternoon with a model the author calls "Fable 5.2". It took about 6 hours and roughly 450 million tokens. Tokens are the chunks of text AI providers bill by. Some of that went into tests with Claude Opus 5.5. A lot of it went on rework and trial and error, the author says. The skill is meant to cut out exactly those detours by recording what worked and which bugs came up.

What the skill actually changes

The author puts the problem like this: if you just ask an AI to "build a 3D game", you usually get gray boxes, mushy controls and a project you have to set up a dev environment for first. The skill tackles five areas:

  1. Ask first, then build. The AI starts by pinning down reference games, camera perspective, mood and scope. It also asks which tools you have for making art and models, and how many credits you have left on them.
  2. Check its own work. On day one, the AI sets up testing tools: it can step the game forward frame by frame, jump straight to a specific section via URL parameters and open a diagnostics panel with F3. It takes its own screenshots, then tells you what it actually looked at and what merely ran "without errors".
  3. Rules for combat feel. That covers wind-up and recovery on attacks, a brief freeze on impact (hitstop), tiered knockback, blocking and parrying, enemies that attack one after another instead of all at once, and dodges that cancel the current action. In short: what makes hits feel like they land.
  4. A bug list. It covers stuck arrow keys, canned animations that fling characters out of position, blown-out glow effects (bloom), roofs blocking the camera and characters that shrink to half size after packaging. For each item, the list gives the symptom, cause and fix.
  5. Three ways to package the game. Large models and files get heavily compressed: as a single HTML file, as a static website that shows the scene first and loads the rest later, or as an offline bundle for restricted environments.

The workflow has five phases: research and planning, game world and art, animation, combat feel and effects, and finally audio and packaging. The platforms only provide a few ready-made animations. The skill generates the remaining poses in code by calculating where the hands and feet go. Effects are built from models with shaders, small programs that run on the GPU, rather than from masses of particles.

Installation and what you need

The easiest way is to give the AI the repository link and let it install the skill itself. For Claude Code, you can also do it by hand:

git clone https://github.com/op7418/guizang-game-skill ~/.claude/skills/guizang-game-skill

For Codex and other tools, put the repository in that tool's skills folder. After that, a request like this is enough: "Build a top-down 3D action game in wuxia style for the browser, one scene, one enemy wave, one boss. I have access to Tripo and Jimeng."

What For Without it
Node.js 18+ local server and packaging required
Tripo image to 3D model, rigging free models and code-generated geometry, noticeably worse graphics
Jimeng or another image generator concept art, icons, lettering, voice acting free assets
Suno music the skill writes prompts or generates music in code

The author stresses how much these tools matter. At the very start, he had models generated directly from text, and the results were weak. Going the long way, concept art first and then 3D, improved the quality a lot, he says.

What the skill can't do

The author is strikingly candid:

It's not a finished game from a single sentence.

He tested "雾锁山门" over seven rounds and reported 5 to 10 problems each time. He can't develop games himself. He just says things like "the movements are stiff" or "hits feel bad", and the AI translates that into technical terms, researches the problem and fixes it. His advice: give the AI reference videos, insist on "research first, then build", and have it hook into existing tools instead of coding everything from scratch. So far, the skill has been run end to end on just one project, plus a comparison test at the planning stage. It helps you find the right direction, he says, but it doesn't guarantee quality.

On licensing: the skill itself (docs and scripts on the main branch) is under AGPL-3.0. The demo game's content, meaning art, models, voices, music and text, is the author's copyright. You can play it and share the link, but you can't redistribute it, rebrand it or use it commercially.

Our take

The project neatly shows where AI coding assistants are heading. It's no longer just about the model. What matters now is documented expertise, packaged as skills, that walks the AI through a proven process. The focus on self-checking stands out most: the AI is supposed to review screenshots and openly say what it hasn't verified. That's exactly where many AI projects fall apart.

There are still limits. 450 million tokens adds up even on cheap plans, and paid services like Tripo and Suno come on top. The skill is based on a single project. Nobody has shown yet whether it works as well for other genres or other users. And even with the skill, a human has to test the game several times and give feedback. Still, for hobbyists who've always wanted to build a small game, it's a concrete, easy-to-follow starting point, and you can check out the demo yourself in a minute.

Sources

#claude code#game development#three.js#agent skills#browser games
Read the original source

Ask the AI assistant

Questions about this article, installation or background? Our assistant knows this page and runs on our own machine, not in someone else's cloud.

Connecting …

The Assistant is an AI (Gemma 4) and can make mistakes – please check important details against the source. Questions are used only to generate an answer and are deleted after one hour. Please don't enter any personal data.

Comments

What do you think? Already tried it? Write it here, no sign-up needed.

  1. Loading comments …

Comments are public. Links aren't allowed, and we delete abusive posts. You can delete your own comment at any time in this browser. Learn more in the Privacy Policy.