技能介绍

着色器上手真正的门槛

渲染问题往往不在概念，而在细节：一个描边特效在桌面端正常，换到移动端就变成一片糊；网上的教程代码在 A 引擎能跑，搬到 B 引擎就只剩报错。着色器的坑大多来自三件事——坐标空间没对齐、GLSL 和 HLSL 的差异被忽略、移动端精度差异被当成逻辑 bug 排查半天。这个技能要解决的就是把这些可移植的底层知识一次性讲清楚。

内容与工作流

技能以 GLSL 为主线，同时给出 HLSL 对照，覆盖顶点/片元两个阶段的分工：顶点着色器把顶点变换到裁剪空间并向片元阶段传递数据，片元着色器逐像素输出颜色，大多数游戏特效就活在这个阶段。

核心工作流分六步，按顺序推进：

先确认自己站在流水线的哪一段，再决定代码写在哪
盯住坐标空间：位置走 model → world → view → clip，法线要么世界系要么视图系，混用是最高频的 bug 来源
用 UV 和时间驱动特效：UV 是 0 到 1 的纹理坐标，通过偏移、缩放、扭曲配合 time uniform 做滚动、溶解之类的动画
片元阶段尽量用 mix、step、smoothstep、clamp 代替 if 分支，GPU 喜欢同质线程
数据通过 uniform（每次绘制常量）和 varyings（顶点插值到片元）传递，纹理采样次数要克制，它主导成本
在目标硬件上肉眼验证，桌面正确不代表移动端正确

技能还收录常见特效：染色/改色、滚动纹理、溶解（阈值 + 边缘发光）、描边、菲涅尔边缘光、暗角、色彩分级，完整代码与 HLSL 对照在 references/effects.md。

适用边界

它不替代引擎文档。Godot 的 canvas_item/spatial 着色器、Unity 的 ShaderLab、Unreal 的材质节点各有自己的内置变量和语法；完整的粒子 VFX 系统应参考 Niagara 类资源；后处理栈直接交给引擎渲染器设置。

写的时候记住这些高频坑：光照方向、法线、视图向量必须在同一坐标空间下运算；插值后的法线要重新 normalize()，否则 dot() 结果会漂移；不同引擎的 UV V 轴方向可能相反，贴图上下颠倒先查这里；discard 会破坏 early-Z，在移动端 tile-based GPU 上代价明显；移动端 highp 和 mediump 的选择会直接表现为闪烁；mix 对应 HLSL 的 lerp，texture() 对应 .Sample()，矩阵还有列主序/行主序的差异。