mcpField
T
threejs-aaa-graphics-builder

threejs-aaa-graphics-builder

github.com/majidmanzarpour创意与媒体2.6k3.3k 次安装4 周前更新
代码仓库

关于 threejs-aaa-graphics-builder

面向 Three.js 游戏的图形制作 Skill,帮助将基础画面升级为经过创作且兼顾性能的场景,涵盖美术方向、资产来源、渲染和迭代评估。

主要功能

  1. 01基于截图评估画面
  2. 02制定美术方向与图形架构
  3. 03获取程序化或生成资产
  4. 04完善材质、光照与渲染
  5. 05添加关联游戏状态的特效
  6. 06检查性能并生成报告

适用场景

  1. 01提升现有游戏的画面质量
  2. 02制作可游玩的代表性场景
  3. 03添加与游戏状态关联的特效

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/majidmanzarpour/threejs-game-skills --skill threejs-aaa-graphics-builder

安装后在 Claude Code 中输入/threejs-aaa-graphics-builder确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

agents/
openai.yaml
references/
authoring-recipes.md
shader-cookbook.md
technical-art.md
visual-scorecard.md

详细介绍

Three.js AAA 图形构建器

负责制作级图形优化:将基础截图转变为精心创作、高密度且注重性能的视觉效果。

参考资料

文件何时阅读
references/visual-scorecard.md为视觉效果评分或提出任何高级/AAA/展示级效果声明时
references/authoring-recipes.md构建主视觉、障碍物、奖励、世界套件或道具模型;更改光照、色调映射、阴影、雾效、后期处理或图形架构时
references/technical-art.md涉及渲染预算、材质套件、VFX 系统、实例化/LOD、导入资源清理,或任何可能影响浏览器性能的内容时
references/shader-cookbook.md涉及自定义着色器、onBeforeCompile、天空或后期处理时;将其中的配方作为经过测试的起点,并根据项目的 Three.js 版本进行验证

如果要全面解决“看起来仍然很基础”的问题,或进行高级效果优化,请在实现前阅读全部四份资料。范围较窄的图形编辑只需加载相关参考资料并执行相应检查;用户指定的风格和范围优先于配方默认设置。

核心规则

发光无法让基础几何体看起来达到 AAA 水准。先构建精心创作的造型,再处理材质、光照,最后添加效果——顺序不可颠倒。

工作流

  1. 如果存在可玩的场景,在目标视口中截取或检查游戏运行中的截图。
  2. 对于现有游戏,为受影响的视图评分并找出最薄弱的表面。对于新游戏,先确定美术方向、摄像机尺度、材质角色和主视觉目标;不要凭空编造优化前的截图。
  3. 补齐游戏缺少的图形架构:材质库、程序化纹理与贴花、模型工厂、世界道具套件、VFX 系统、渲染管线和诊断工具。
  4. 为每个高价值表面选择一种资源来源:程序化 Three.js、threejs-image-generator 参考图或纹理、threejs-3d-generator 模型,或图像转 3D 混合流程。如果任务涉及外部生成,请运行凭据探测。 在生成依赖内容或绑定骨骼之前,先检查概念设计/模型。先用实际资源和反馈完成一个有代表性的可玩场景,再扩展内容套件。
  5. 升级所有明显薄弱的表面,而不只是主视觉:危险物、奖励、地面与赛道、前景道具、背景层、预警提示、材质变化和状态 VFX。
  6. 等精心创作的造型完成后,再添加光照、色调映射和渲染润色。
  7. 添加与游戏状态关联、由事件驱动的 VFX。
  8. 根据校准基准重新评分,并引用检查器测得的指标。持续改进,直到所有高级效果类别的得分都至少为 2,或明确指出具体阻碍。

资源来源

如果任务涉及外部生成,先运行 threejs-game-director/scripts/probe_asset_credentials.sh;明确采用程序化艺术时则无需探测。设置好密钥后,应生成主视觉表面资源(玩家、角色、生物、Boss、载具、飞船、建筑、武器、标志性道具、主视觉环境元素)和高价值 2D 资源(天空、背景、纹理与装饰条参考图、贴花、阵营标志、图标、GUI 与标题图,以及图像转 3D 的输入),除非用户要求仅使用程序化艺术或排除外部服务。程序化 Three.js 适用于重复道具、套件、碰撞代理、VFX 几何体和实例化体积。出现故障时,按照 director 的 references/asset-recovery.md 处理;一次超时并不能证明生成服务不可用。

对于动画资源,除了轮廓还要检查运动表现:在真实游戏过程中检查移动、混合过渡、脚部接触、受击时机和次级运动。经过大幅优化后,可以请独立评审者专门指出缺陷;但最终评分和整合仍由负责人负责。

报告

提供优化前后的评分,每个类别各附一行证据;列出升级的表面、变更文件、截图、对照预算表的渲染器诊断结果、生成资源路径与任务 ID,以及仍然薄弱的部分。如果使用了生成的 3D 资源,还需提供导入资源诊断信息(缩放、边界、碰撞代理、动画片段)。

评论

支持 Markdown