歸藏 Game Skill

让 AI 从零做出一个能在浏览器里玩的 3D 动作游戏

English · 简体中文

上面这段是演示游戏《雾锁山门》里的实机画面。点这里直接玩，电脑和手机都能打开，不用安装。

这是什么

一个给 AI 编程助手（Claude Code、Codex 等）用的 Skill。装上之后，对它说"做一个武侠题材的俯视角 3D 动作游戏"，它会按一套走通过的流程去做：先问清楚你要什么，接上你手头的素材生成工具，自己推进画面、自己截图核对，最后把游戏打包成一个网页文件。

Skill 里写的不是理论，是我用 Fable 5.2 花一个下午做出《雾锁山门》的过程中踩过的坑，和最后留下来的做法。那次大约 6 小时、4.5 亿 Token（其中一部分是 Opus 5.5 跑的测试），很多都花在了返工和试错上。这个 Skill 的目的就是让你和你的 AI 少走这些弯路。

一个仙侠题材的俯视角 3D 动作游戏：一个场景、一段小怪遭遇战、一场 Boss 战，有剧情和配音。所有创意都是 AI 自己定的，我只说了要做国风仙侠。

画面：大片随风起伏的草，分层的雾、雪和远山，覆水石台上的反光。渲染流程是在 three.js 上自己搭的，只用兼容性最好的 WebGL，所以手机、电脑、小程序类容器里都能跑
角色与场景：5 个带骨骼的 3D 角色、2 把武器、12 种场景道具、5 种掉落物。先用即梦出设定图，再用 Tripo 转成模型，提示词都是 AI 自己写的
战斗：三段连招、闪避、格挡、弹反、处决，还有饮药、御剑和大招"万剑归宗"。Boss 有二阶段、起身过场和台词
声音：8 条配音、配乐、环境音和音效
体积：原始素材将近 100MB，打包后是一个约 33MB 的 HTML，里面包含全部模型、贴图、音乐和配音


三段连招	剑诀	万剑归宗

演示的三种形态，都是同一份源码打出来的：

形态	说明
在线版	先渲染出场景再边跑边加载；手机有触屏摇杆和按钮；设置里可以调画质、换高清材质、改按键
单文件版	一个约 33MB 的 HTML，没有任何网络请求
小程序容器版	按小红书小工具的限制（不能联网、不能用 WASM、包体 10MiB）单独构建，约 8MiB

直接让 AI"做个 3D 游戏"，通常会得到一个方块灰模、手感发飘、要自己搭环境才能跑的东西。装上这个 Skill 之后：

把这个仓库的链接发给你的 AI，让它安装即可。或者手动：

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

Codex 等其它工具，克隆到它们各自的 skills 目录。

然后直接说需求，比如：

做一个武侠题材的俯视角网页 3D 动作游戏，一个场景、一波小怪、一个 Boss。
我有 Tripo 和即梦可以用。

素材工具对最终效果影响很大。我一开始让它直接用文字生成模型，质量很差；改成"先出设定图，再转 3D"之后上了一个大档次。

调研与规划 → 设定与素材 → 动作 → 手感与特效 → 声音与打包

路径	内容
`SKILL.md`	整体流程和每个阶段的检查点
`references/assets.md`	素材生成与免费素材来源
`references/characters-animation.md`	角色、骨骼与动画
`references/combat-feel.md`	战斗手感
`references/vfx-ui-audio.md`	特效、界面与声音
`references/pitfalls.md`	踩坑清单
`references/packaging.md`	体积优化、单文件打包、在线托管、手机与受限容器
`scripts/`	可直接复用的输入处理、本地服务器、三种打包脚本

它不是一句话出成品。《雾锁山门》我试玩了 7 轮，每轮提 5 到 10 个问题。我不懂做游戏，只会说"动作很僵硬""打击感很差"，AI 会把这些话翻译成专业做法去查、去改。你仍然需要来回试玩提意见
几件事我会坚持让 AI 做：给它参考视频；要求"先调研再动手"；别让它自己造轮子，把现成的素材工具接上
Skill 目前只在一个项目上完整走过一遍，另做过一次计划层面的对照测试。它能让方向少走弯路，不保证成品质量

歸藏。觉得有用的话点个 Star，也欢迎把你做出来的游戏发给我看。