跳到主要内容
AI教程

用歸藏 Game Skill 让 AI 制作可玩的浏览器 3D 动作游戏

本文介绍歸藏 Game Skill 的用途、安装方式和完整工作流程,演示如何让 Claude Code、Codex 等 AI 编程助手制作带战斗、动画、音频和多种发布形态的浏览器 3D 动作游戏。

用歸藏 Game Skill 让 AI 制作可玩的浏览器 3D 动作游戏

如果你曾经让 AI “做一个 3D 游戏”,很可能得到的是一个能移动的方块场景:角色动作僵硬,战斗没有反馈,素材需要自己准备,最后还要手动搭建环境才能运行。歸藏 Game Skill 的目标,就是把一套经过实际项目验证的制作流程交给 AI 编程助手,让它从需求澄清、素材准备、动作和战斗设计,到测试与打包,按阶段推进。

本文将以仓库中的演示项目《雾锁山门》为背景,介绍如何安装和使用这个 Skill,以及如何向 AI 提出更容易执行的游戏需求。

浏览器三维游戏演示

歸藏 Game Skill 是什么

这是一个供 Claude Code、Codex 等 AI 编程助手使用的 Skill。安装后,你可以直接描述想做的游戏,例如“制作一个武侠题材的俯视角网页 3D 动作游戏”,AI 会先询问参考作品、视角、氛围、游戏范围、素材工具和可用额度,再根据流程逐步实现。

它并不是一个自动生成成品的游戏引擎,也不是一句提示词就能完成全部工作的工具。它更像是一份面向 AI 的项目制作规范,包含阶段计划、检查点、战斗手感建议、素材生成方法、常见问题和打包脚本。

演示项目能做到什么

仓库中的《雾锁山门》是一个仙侠题材的俯视角 3D 动作游戏,包含一个场景、一段小怪遭遇战和一场 Boss 战,并配有剧情与配音。你可以在在线演示页面中直接试玩,无需安装。

  • 画面:包含随风起伏的草、分层雾效、雪、远山和水面石台反光,基于 three.js 和兼容性较好的 WebGL 实现。
  • 角色与场景:使用 5 个带骨骼的 3D 角色、2 把武器、12 种场景道具和 5 种掉落物。
  • 战斗:包含三段连招、闪避、格挡、弹反、处决、饮药、御剑和“万剑归宗”大招,Boss 具有二阶段战斗。
  • 声音:包含配音、配乐、环境音和战斗音效,共有 8 条配音。
  • 发布:源码可以构建为在线静态站点、约 33MB 的单文件 HTML,或面向受限容器的离线包。

安装 Skill

使用 Git 克隆

如果你使用 Claude Code,可以将仓库克隆到对应的 skills 目录:

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

使用 Codex 或其他 AI 编程工具时,请将仓库放入该工具约定的 skills 目录。完成安装后,重新打开或刷新 AI 编程环境,使它能够读取 Skill 内容。

准备运行环境和素材工具

项目要求本地安装 Node.js 18+,主要用于运行本地服务器和执行打包流程。素材工具不是绝对必需,但会明显影响最终效果。

  • Tripo:用于将图片转换为 3D 模型,以及进行骨骼绑定。
  • 即梦 或其他出图工具:用于角色设定图、图标、题字等素材,也可以准备配音。
  • Suno:用于生成配乐,Skill 可以帮助整理音乐提示词。

如果没有这些服务,可以使用免费模型、程序化几何体和其他免费素材,但画面质量可能会降低。实际项目中,先生成角色设定图,再把设定图转换成 3D 模型,通常比直接用文字生成模型更容易得到稳定结果。

第一次使用:给 AI 提出需求

安装好 Skill 后,不建议只输入“做一个 3D 游戏”。应当先说明题材、视角、平台、玩法范围和手头的工具。下面是一条适合开始项目的示例指令:

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

AI 通常会根据这段需求继续询问细节。你可以补充参考视频、希望采用的美术风格、目标设备、是否需要手机触控、预期的游戏时长,以及是否需要导出单文件 HTML。

关键原则是先让 AI 调研和规划,再开始写代码。参考视频、目标平台和素材条件越明确,后续返工越少。

完整制作流程

歸藏 Game Skill 将制作过程拆成以下五个阶段:

  1. 调研与规划:分析参考作品,确定视角、玩法、场景范围和阶段计划,并记录实现方式。
  2. 设定与素材:制作世界观和角色设定图,将图片转换为 3D 模型并完成骨骼绑定。
  3. 动作:使用素材平台提供的预设动作;不足的部分通过程序计算姿势中的手脚位置。
  4. 手感与特效:逐项实现前摇、后摇、命中顿帧、击退、格挡、弹反和闪避打断等战斗反馈,并使用网格与着色器制作特效。
  5. 声音与打包:加入音效、配音和配乐,压缩资源,最后构建在线版本、单文件版本或受限容器版本。
游戏制作流程参考

让 AI 自己验证结果

这个 Skill 的一个重点,是让 AI 不只检查控制台是否报错,还要实际观察画面。流程中建议尽早准备自测工具,让 AI 能够逐帧推进画面、通过 URL 参数直接进入指定关卡,并使用 F3 诊断面板查看运行状态。

AI 可以自行截图,再对照需求检查角色位置、相机视角、特效、UI 和战斗状态。你仍然需要试玩并反馈,但不必每次都亲自寻找明显的画面问题。

反馈时不需要使用专业术语。例如你可以说“动作很僵硬”“打击感很差”“镜头被屋顶挡住”或“角色看起来缩小了一半”。Skill 会帮助 AI 将这些描述转换成可执行的排查和修改任务。

设计基础战斗手感

对于动作游戏,功能能运行并不代表手感合格。Skill 在战斗流程中强调以下要点:

  • 为攻击设置出招前摇和收招后摇,让动作具有节奏。
  • 命中时加入短暂顿帧,突出攻击反馈。
  • 根据攻击类型设置不同等级的击退效果。
  • 区分普通格挡和弹反,并让闪避能够打断当前动作。
  • 让敌人轮流进攻,避免所有敌人同时围攻玩家。
  • 为 Boss 设计二阶段、起身过场和台词等战斗变化。

实现时,应将这些项目作为检查清单逐项验证,而不是只关注角色能否移动或攻击。连招、剑诀和大招等能力也需要结合动画、命中判定、特效和声音共同调试。

动作游戏战斗效果

处理常见问题

3D 网页游戏中有不少问题不会直接表现为代码错误,因此仓库提供了专门的踩坑清单。遇到以下现象时,可以优先查阅references/pitfalls.md:

  • 方向键或输入状态卡住。
  • 预设动画导致角色被甩离原地。
  • 泛光效果过强,造成画面过曝。
  • 相机被建筑屋顶遮挡。
  • 打包后角色尺寸与开发环境不一致。

这些问题通常需要结合输入处理、动画根骨骼、相机碰撞、后处理参数和资源缩放逐项排查。不要只根据“没有报错”判断功能已经完成。

选择发布方式

在线静态站点

在线版可以先渲染场景,再在运行过程中继续加载资源。适合部署到静态托管服务,并可以加入手机触屏摇杆、画质设置、高清材质切换和按键配置。

单文件 HTML

单文件版本会将模型、贴图、音乐和配音一并打包进 HTML。演示项目的原始素材接近 100MB,打包后约为 33MB。这个方式便于分享和离线运行,但需要特别关注资源压缩与最终文件体积。

受限容器离线包

如果目标平台不能联网、不能使用 WASM,且包体限制为 10MiB,就需要单独构建适配版本。演示项目针对小红书小工具类限制制作了约 8MiB 的离线包。

不同发布形态并不是简单复制同一份配置。应在项目早期确定目标平台,以便从资源格式、加载方式和功能范围上提前做取舍。

网页游戏发布形态

查阅仓库中的参考资料

完成安装后,可以让 AI 直接阅读以下文件,并在对应阶段参考它们:

使用时需要注意什么

这个 Skill 不能代替人工试玩,也不保证一次生成高质量成品。《雾锁山门》的制作过程经历了多轮试玩,每轮都提出若干问题,再由 AI 继续修改。因此,你需要持续观察游戏并给出反馈。

更有效的协作方式包括:提供参考视频;要求 AI 先调研再动手;让它优先接入现成的素材工具;每完成一个阶段就运行和截图验证;在确定平台后尽早进行体积测试。

目前 Skill 已在一个完整项目中走过一遍,并进行过一次计划层面的对照测试。它更适合帮助你减少方向错误和重复试错,而不是承诺任何题材都能自动得到同样的完成度。

总结

歸藏 Game Skill 将制作浏览器 3D 动作游戏拆解为可执行的步骤:先澄清需求,再准备素材和动画,随后调试战斗手感、特效与声音,最后根据平台限制完成打包。安装后,你可以从一条具体的游戏需求开始,让 AI 在规划、实现和验证之间持续迭代。

如果你希望进一步了解完整细节,可以查看GitHub 仓库,并试玩《雾锁山门》。Skill 本身采用 AGPL-3.0;演示游戏中的美术、模型、配音、配乐和文案属于作者内容,使用时请分别遵守对应许可。