shader-dev

shader-dev 技能概述

shader-dev 的用途

shader-dev 是一套实用的 GLSL shader 技能，适合把视觉想法落成实时效果，尤其适合 ShaderToy 风格的工作流。它在你想构建或调试 ray-marched 场景、SDF 组合、光照、程序化纹理、粒子、流体运动、后期处理或相机效果时特别有用，而不是靠猜测哪种 shader 技术最合适。

适合哪些人使用

shader-dev 最适合图形开发者、技术美术、探索高动效界面的 UI 工程师，以及被要求根据粗略视觉描述生成 shader 代码的 AI agent。它尤其适合这种任务：“把这个效果用 GLSL 做出来”，而不是 “解释原理”。

它的不同之处

shader-dev 的核心价值在于技术路由：它把大量 shader 主题组织成一条结构化路径，而不是把所有视觉问题都当成一个泛化提示词来处理。也就是说，面对“发光隧道、雾气和柔和阴影”这类需求，它能比一次性 prompt 更快缩小到正确的构建模块。它的覆盖面也足够广，既能处理组合，也能处理渲染问题；这一点很重要，因为真正的阻碍有时不只是形状生成，还有走样、阴影和 buffer 工作流这类质量问题。

如何使用 shader-dev 技能

正确安装并触发

使用 npx skills add MiniMax-AI/skills --skill shader-dev 安装，然后用聚焦的请求来调用它，比如 /shader-dev create a raymarched SDF crystal scene with rim lighting and soft shadows。这个技能是按用户输入来工作，因此提示词应描述视觉目标、目标平台和约束，而不只是说出一种技术名称。

提供合适的输入形态

高质量输入通常包含：

• 效果类型：ray marching、SDF、fluid、particle system、post-processing
• 目标环境：ShaderToy、WebGL，或其他 GLSL runtime
• 视觉意图：“干净的 UI 背景”“电影感雾效”“游戏感霓虹隧道”
• 约束：性能、移动端支持、单 pass 还是 multipass、不要纹理、不要 3D 资源

像“做得酷一点”这样的模糊请求会迫使技能去猜。更强的请求例如“构建一个兼容 ShaderToy 的 SDF 走廊，包含动态面板、环境光遮蔽和抗锯齿，并针对实时运行优化”，则能提供足够细节，让它选对技术路径。

先看对的文件

先读 SKILL.md 了解调用方式和路由，再在深入阅读 reference/ 页面之前，先检查最相关的 techniques/ 文件。比如：

• ray-marching.md：用于 sphere tracing 场景
• sdf-3d.md 或 sdf-2d.md：用于对象构建
• lighting-model.md：用于着色选择
• procedural-noise.md：用于有机变化
• post-processing.md：用于 bloom、tone mapping 或屏幕空间润色

当你需要实现细节、数学推导或边界情况处理时，再去看 reference/ 文件。这样首轮阅读会更快，也能避免过度阅读无关的 shader 理论。

能提升输出质量的工作流

一套更好的 shader-dev usage 工作流是：先确认核心渲染方式，确认目标 runtime，先让它生成主要效果，再在基础场景跑通后叠加辅助效果。比如，先生成几何体和相机，再添加阴影、AO、抗锯齿和色彩分级。这个顺序能减少坏掉的 shader 代码，也让调试更容易。

shader-dev 技能 FAQ

shader-dev 只适用于 ShaderToy 吗？

不是。这个技能在理念上兼容 ShaderToy，但底层的 GLSL 思路可以迁移到其他实时 shader 环境。如果你的引擎有不同的 uniform、buffer 结构或纹理规则，尽早说明，这样输出才能贴合你的 runtime。

什么时候不该用 shader-dev？

如果你需要的是简单的静态渐变、CSS 动效，或者不依赖 GLSL 的非 shader UI 效果，就可以跳过 shader-dev。它最有价值的场景，是最终输出依赖 shader 数学、渲染管线或实时视觉合成的时候。

shader-dev 比通用 prompt 更好吗？

通常是的，因为 shader-dev skill 提供的是知道技术路线的指导，而不是让模型从零推断正确的渲染策略。它在涉及多个相互作用系统时收益最大，比如 SDF 几何加光照再加基于 buffer 的反馈。

shader-dev 适合初学者吗？

适合，只要你用日常语言描述想要的画面，并让技能来路由技术。初学者最好的做法是先给出一个可见目标，比如“做一个雾气缭绕的传送门”或“做一个发光的 UI 球体”，而不是一口气要求完整的生产级 shader。

如何改进 shader-dev 技能

先说视觉目标，再说技术

最好的 shader-dev guide 输入，应该先描述场景结果，再描述数学方法。“缓慢流动的霓虹水面，带地平线雾气和反光高光”比只说“用 domain warping”更好，因为技能可以把效果映射到更合适的技术组合上。

补充最容易把 shader 搞坏的约束

想要更好的结果，就把必须成立的条件说清楚：

• 是否需要 ShaderToy 兼容
• 单 pass 还是 multipass
• 性能预算
• 是否允许使用纹理
• 输出是 2D、3D 还是 screen-space
• 动效应当是轻微、可循环还是可交互的

这些细节很关键，因为很多 shader 失败不是视觉层面的失败，而是管线不匹配。

从基线迭代，不要直接追求最终精修

对于 shader-dev for UI Design，先让它输出最简单版本，再逐步细化。一个稳妥的改进循环是：基础形状 → 动画 → 光照 → 抗锯齿 → 配色 → 后期处理。若第一次输出偏离预期，先修正渲染方式或场景结构，再要求风格化调整。

用技术语言反馈失败点

如果结果太吵、太慢、太平或太杂，直接说出来，并把问题和症状对应起来。比如：“减少时间闪烁并简化 SDF 细节”就比“做得更干净”更有用。这样技能就能调整采样、形状复杂度、着色方式或颜色处理，而不是随机重做整个场景风格。