关于 game-studio
game-studio 是用于规划和构建浏览器游戏的总入口技能,2D 默认采用 Phaser,并为 3D 提供明确路径。它会分类需求并分派给专业技能,同时协调架构、UI、资源和试玩测试。
主要功能
- 012D 浏览器游戏默认采用 Phaser
- 02分派 Three.js 和 React Three Fiber 任务
- 03衔接架构、UI、资源与 QA 技能
- 04制定游戏循环、技术栈和资源流程
适用场景
- 01为浏览器游戏选择技术栈
- 02规划带 UI 和资源流程的 Phaser 游戏
- 03分派 React 承载的 3D 游戏任务
- 04协调浏览器游戏开发与试玩测试
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ openai/ plugins --skill game-studio安装后在 Claude Code 中输入/game-studio确认已加载。
附带文件agents/openai.yaml
详细介绍
游戏工作室
概述
将此技能作为浏览器游戏开发的统一入口。除非用户明确要求 3D、Three.js、React Three Fiber、以着色器为主的渲染,或其他以 WebGL 为先的方向,否则默认采用 2D Phaser 路径。
此插件有意采用不对称设计:
- v1 中,2D 是最成熟的执行路径。
- 3D 只有一个主张明确的默认生态系统:纯 TypeScript 或 Vite 应用使用原生 Three.js,React 托管的 3D 应用使用 React Three Fiber,默认交付资源格式为 GLB 或 glTF 2.0。
- 共享的架构、UI 和试玩实践适用于两者。
适用场景
- 用户仍在选择技术栈
- 请求涵盖运行时、UI、资源管线和 QA 等多个领域
- 用户只说“帮我制作一款游戏”,未指定实现路径
不应停留在此处的场景
- 运行时明确为原生 Three.js
- 运行时明确为 React Three Fiber
- 任务明确属于已交付资源相关问题
- 任务明确仅涉及前端或 QA
意图明确后,转到最具体的专用技能并从那里继续。
路由规则
- 在设计或编码前先对请求分类:
2D default:Phaser、精灵、瓦片地图、俯视角、侧视角、网格战术、动作平台游戏。3D + plain TS/Vite:命令式场景控制、类引擎循环、非 React 应用、直接进行 Three.js 开发。3D + React:React 托管的产品界面、声明式场景组合、共享 React 状态、以 UI 为主的 3D 应用。3D asset pipeline:GLB、glTF、纹理打包、压缩、LOD、运行时资源大小。Alternative engine:Babylon.js 或 PlayCanvas 请求,通常是比较或生态适配问题。Shared:核心循环设计、前端方向、存档/调试/性能边界、浏览器 QA。
- 分类后立即转到专用技能:
- 共享架构和引擎选择:
../web-game-foundations/SKILL.md - 深入实现 2D:
../phaser-2d-game/SKILL.md - 原生 Three.js 实现:
../three-webgl-game/SKILL.md - React 托管的 3D 实现:
../react-three-fiber-game/SKILL.md - 3D 资源交付与优化:
../web-3d-asset-pipeline/SKILL.md - HUD 和菜单方向:
../game-ui-frontend/SKILL.md - 2D 精灵生成与标准化:
../sprite-pipeline/SKILL.md - 浏览器 QA 和视觉审查:
../game-playtest/SKILL.md
- 共享架构和引擎选择:
- 在各个转接的技能间保持计划一致。不要让引擎、UI、资源和 QA 的决策彼此脱节。
默认工作流
- 明确游戏幻想和玩家动作。
- 定义核心循环、失败状态、进度系统和目标游玩时长。
- 选择实现路线:
- 2D 浏览器游戏默认使用 Phaser。
- 当项目明确是 3D,且希望在纯 TypeScript 或 Vite 应用中直接控制渲染循环时,选择原生 Three.js。
- 当项目已经采用 React,或希望借助共享 React 状态进行声明式场景组合时,选择 React Three Fiber。
- 仅当用户明确要求自定义渲染器或以着色器为先的界面时,才选择原始 WebGL。
- 尽早定义 UI 界面。即使游戏区域采用画布或 WebGL,浏览器游戏通常也需要 DOM HUD 和菜单层。
- 对于 3D 起步脚手架,默认采用简洁的 HUD,尽量保留游戏区域,并让次要面板保持折叠。
- 决定资源工作流:
- 2D 角色和特效:使用
sprite-pipeline。 - 3D 模型、纹理和交付格式:使用
web-3d-asset-pipeline。
- 2D 角色和特效:使用
- 在认定工作可用于生产环境之前,完成试玩循环。
输出预期
- 对于规划请求,请返回针对特定游戏的计划,涵盖技术栈选择、游戏循环、UI 界面、资源工作流和测试方法。
- 对于实现请求,请通过文件结构和代码边界清楚地体现所选技术栈。
- 对于混合请求,保留插件默认设置:优先使用 2D Phaser,除非用户另有要求。
- 当用户询问 Babylon.js 或 PlayCanvas 时,请如实比较,但仍将 Three.js 和 R3F 作为代码生成的首选默认项,除非用户明确选择其他引擎。
参考资料
- 引擎选择:
../../references/engine-selection.md - Three.js 技术栈:
../../references/threejs-stack.md - React Three Fiber 技术栈:
../../references/react-three-fiber-stack.md - 3D 资源流水线:
../../references/web-3d-asset-pipeline.md - Vanilla Three.js 入门模板:
../../references/threejs-vanilla-starter.md - React Three Fiber 入门模板:
../../references/react-three-fiber-starter.md - 前端提示词模式:
../../references/frontend-prompts.md - 游戏测试清单:
../../references/playtest-checklist.md
示例
- “帮我制作一个浏览器战术游戏的原型。”
- “我需要一个基于 Phaser 的动作游戏循环,以及 HUD 和菜单。”
- “我想做一个 Three.js 探索演示,包含 WebGL 光照和适配浏览器的 UI。”
- “我想用 React Three Fiber 制作一个基于 React 的 3D 配置器。”
- “优化我的 GLB 资源,以适配 Web,并控制文件大小。”
- “为一致的 2D 精灵动画搭建资源工作流。”
评论
支持 Markdown