threejs-game-skills架构深剖：9大Agent技能系统与Director编排机制全解析

threejs-game-skills架构深剖9大Agent技能系统与Director编排机制全解析【免费下载链接】threejs-game-skillsAgent skills for building playable, polished Three.js browser games with gameplay, AAA-style graphics, UI, QA, and optional AI-generated 3D, image, and audio assets.项目地址: https://gitcode.com/gh_mirrors/th/threejs-game-skillsthreejs-game-skills 是一套面向 Three.js 浏览器游戏的 Agent 技能系统你只需对 AI 编程助手说一句话它的 Director导演技能就会自动编排 9 大 Agent 技能系统——玩法、AAA 级画面、UI、调试、QA 以及 AI 生成 3D/图像/音频素材——把游戏从空文件夹一路做到可发布全程无需你手动挑选每个专业技能。 对新手来说这套系统最大的价值是把做一款能玩、好看、能上线的 3D 网页游戏这件复杂的事拆解成一条有质量门槛的生产流水线。一、项目架构一览三层设计整个仓库的设计非常清晰可以理解成三层层级内容位置技能层9 个独立技能各自包含SKILL.md、参考资料、脚本、资产skills/编排层Director 的 7 阶段流程与质量门控规则skills/threejs-game-director/references/phase-playbook.md验证层画布像素检查、视觉评分卡、Bot 试玩、发布风险报告skills/threejs-qa-release/官方说明文档可直接从项目根目录的 README.md 与 AGENTS.md 开始阅读它们是理解整套架构的最佳入口。二、9大Agent技能系统逐个拆解1️⃣ 总指挥threejs-game-director这是所有宽泛需求的默认入口。它负责端到端的游戏结果先跑通可玩循环再分阶段调度其他技能最后核验证据。它的 SKILL.md 中定义了几条铁律先检查运行环境能力能否读文件、跑脚本、开浏览器再决定工作流绝不把原型级作品称为高级——用户说不够基础就按高级品质标准对待全程维护 4 本账本Ledger让每一步都可追溯。2️⃣ 玩法地基threejs-gameplay-systems负责从 0 到 1 的可玩循环游戏设计简报、核心循环契约、关卡/遭遇规划、实体、输入、相机、物理、得分与手感顿帧、震屏、缓动、打击反馈。它内置了一个 Vite TypeScript Three.js 游戏脚手架assets/threejs-vite-game/新项目一句话即可生成且自带确定性测试钩子和种子随机数方便后续自动化验证。3️⃣ 画面升级threejs-aaa-graphics-builder当截图看起来还很初级时出场。它的核心规则写得很直白不要靠加光效把图元变成 AAA先做造型、再上材质、再打光、最后才加特效。它还配有一张 10 维度的视觉评分卡Visual Scorecard和校准锚点截图让好不好看变成可打分的数字。4️⃣ 界面设计threejs-game-ui-designer专注 HUD、菜单、暂停/胜负结算、图标、触控控件与安全区。它明确反对通用仪表盘式的 UI要求用游戏专属的计量条、徽章、冷却环等设计语言并保证 UI 永远不遮挡玩家、威胁和关键触控点。5️⃣ 调试专家threejs-debug-profiler专治黑屏、渲染异常、移动端崩溃、加载失败等疑难杂症以及性能剖析Draw Call、三角形数、显存、包体大小。它的工作方式是一次只优化一个瓶颈并用基线/优化后对比数据说话。6️⃣ 质量守门员threejs-qa-release在宣称完成之前必须经过它构建检查、桌面移动端截图、画布非空白像素检测inspect-threejs-canvas.mjs 会输出颜色熵、边缘密度、亮度对比等实测指标、视觉回归基线、Bot 自动试玩和生产构建验证。7️⃣~9️⃣ 三大 AI 生成器3D / 图像 / 音频这三个技能是可选的外挂武器需要配置相应的 API Key 才能工作threejs-3d-generator基于 Tripo API 的文字/图像转 3D产出可直接进游戏的 GLB/FBX 模型支持自动绑骨与动画重定向完整说明见 skills/threejs-3d-generator/SKILL.mdthreejs-image-generator基于 Gemini 图像 API 生成概念图、贴图、天空板、Logo、GUI 美术并作为图像转 3D 的输入源threejs-audio-generator基于 ElevenLabs 生成音效、氛围循环、UI 音、语音 TTS 与变声见 skills/threejs-audio-generator/SKILL.md。三、Director 编排机制它如何指挥整支乐队这套系统的精髓不在单个技能而在 Director 的编排机制。它由四套机制咬合而成1. 运行器能力检查 技能路径阶梯Director 启动时先确认当前 AI 运行器能做什么能否直接调用兄弟技能能否按路径读文件能否执行 shell 命令能否驱动浏览器答案决定它自己干活还是请你帮忙。读取技能文件时则按五级路径阶梯依次尝试相对路径 → Claude 目录 → Codex 目录 → 通用目录 → 仓库源目录规则定义在 skills/threejs-game-director/SKILL.md#L23-L31。2. 七阶段流水线编排流程固化在 phase-playbook.md 中每个阶段都有明确的入口证据和出口证据阶段 1 发现与可玩契约→阶段 2 玩法系统→阶段 3 外部素材寻源→阶段 4 AAA 画面→阶段 5 UI→阶段 6 调试与剖析→阶段 7 QA 与发布注意一个反直觉的设计阶段 3外部素材寻源被强制排在画面阶段之前——先决定每个高价值模型面用程序化还是 AI 生成再动手做画面避免做到一半才发现该用生成模型的返工。3. 四本账本LedgerDirector 全程记录四本账技能加载账本哪些技能被加载、路径或失败原因、参考资料账本每个阶段的必读文档是否真的读了、外部素材寻源账本每个模型面/音效的来源决策、阶段执行账本各阶段状态与证据。这套记账式编排保证任何一步的跳过都有明文理由而不是悄悄省略。4. 三重质量门控 报告审计外部素材门宣称高级品质前必须先运行凭证探测脚本probe_asset_credentials.sh拿到SET|MISSING的实测输出才允许说没有 API Key参考资料门阶段必读文档没有加载该阶段不许标记为完成高级完成规则 完成门截图被图元、方盒子天际线、通用状态卡占据直接判定未完成见 SKILL.md#L95-L97。最后还有机器审计兜底最终报告会被 audit_reference_report.py 以--premium模式检查必备章节审计不过不许宣称完成。四、视觉评分卡让画面质量可测量AAA 画面技能内置了一组校准锚点截图用来给自评定标——评分卡明确要求如果你的截图看起来更接近 scene-1 而不是 scene-3那相关维度最高只能给 1~2 分无论写了多少代码。锚点图存放在 skills/threejs-aaa-graphics-builder/assets/scorecard-anchors/上图对应约 1 分的校准锚点图元角色与拾取物摆在平坦稀疏的竞技场里配通用工具式 HUD——这正是 threejs-game-skills 定义中原型占位的典型形态。上图对应约 2 分自制的轨道套件、导入的英雄模型资产、有类型感的 HUD 和刻意的灯光设计达到高级风格化门槛。上图对应约 2.5~3 分高密度分层世界处于实机游玩中英雄剪影清晰、事件驱动特效、HUD 与世界观高度统一是展示级Showcase的参照。评分卡覆盖 10 个维度艺术方向、英雄角色、障碍物、奖励物、世界、材质、灯光渲染、VFX、UI、性能证据宣称高级品质的要求是每个维度不低于 2 分、平均分不低于 2.3且必须由新鲜眼睛复核一遍评分规则见 visual-scorecard.md。五、快速上手指南一键安装 threejs-game-skills 技能npx skills add majidmanzarpour/threejs-game-skills --skill * -a claude-code -g -yCodex 用户把-a claude-code换成-a codex即可也可克隆仓库后执行 install.sh。最快使用方式在空项目目录中打开 AI 助手只点名 DirectorUse threejs-game-director to build a premium futuristic tower defense game from scratch. Build a playable loop first, then iterate until it passes browser, mobile, visual, UI, performance, and release checks.随后 Director 会自行加载玩法、画面、UI、调试、QA 等兄弟技能并在需要外部素材时自动调用三大生成器。更完整的示例见 README.md 的 What Good Usage Looks Like 章节。可选 API Key 配置三个生成器均为可选能力核心 Three.js 技能无需任何付费 Key即可工作。需要外部生成时按 README.md 说明配置TRIPO_API_KEY、GEMINI_API_KEY、ELEVENLABS_API_KEY环境变量即可。六、总结 threejs-game-skills 的架构精髓可以浓缩为一句话用阶段流水线 账本追溯 门控验证把 Agent 做游戏的不确定性管了起来。9 大技能各司其职Director 负责编排四本账本负责留痕视觉评分卡与 Bot 试玩负责举证。对于想体验一句话生成可发布 3D 网页游戏的开发者来说这是目前把 AI 游戏开发工程化做得最完整的一套开源技能系统。【免费下载链接】threejs-game-skillsAgent skills for building playable, polished Three.js browser games with gameplay, AAA-style graphics, UI, QA, and optional AI-generated 3D, image, and audio assets.项目地址: https://gitcode.com/gh_mirrors/th/threejs-game-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考