← 全部标签
# 程序化
7 篇页面
页面
图形学二维 SDF 形状2D SDF Shapes在片元着色器里画形，不是发三角形图元，而是对每个像素问「我在形的里面还是外面」。矩形用 step/smoothstep 做轴对齐边界；圆与更复杂形用距离场 (distance field)——到特征点的距离再阈值。这是 2D SDF 程序化造型的入门路径。图形学噪声函数Noise FunctionsKen Perlin 为电影《电子世界争霸战》(Tron) 设计的噪声，解决「看起来随机却不像电视雪花」的程序纹理问题。入门路径是值噪声 (value noise)：格子角点取伪随机，格内用平滑曲线插值；进阶有梯度噪声 (gradient noise)、五次插值改进版，以及用单纯形网格降复杂度的 Simplex Noise。图形学塑形函数Shaping Functions塑形函数把归一化到 [0,1] 的一维输入弯成可控制的曲线，是片元着色器里混合颜色、画边、做动画缓动的「基本功」。GLSL 的 pow/step/smoothstep/sin 等多为硬件加速；掌握一维再扩展到二维空间。图形学片元着色器与 GLSL 基础Fragment Shaders & GLSL Basics片元着色器（fragment shader）是在每个像素（片元）上并行执行的小程序：输入位置等信息，输出颜色。GLSL 是 OpenGL / OpenGL ES / WebGL 共用的着色语言；本书用全屏 billboard 上的像素着色练习，建立程序化图形的基础心智模型。图形学着色器伪随机Shader Pseudorandom片元着色器里没有真正的「每次调用都不同」的随机：rand(x) 必须是确定性伪随机——同一输入永远同一输出。常用手法是 fract(sin(x)大数)；二维则用 dot 把 vec2 压成标量再喂给同一套路。把空间 floor 成格子后，格子共享一个随机值，就能在秩序与混沌之间做生成设计。图形学程序化图案Procedural Patterns片元着色器按像素执行：形状重复多少次，计算量几乎不变，因此特别适合平铺图案。核心手法是放大 st 再 fract 得到重复的 [0,1] 子空间，再在格子内画形、做矩阵变换，或按奇偶行错位、按格子旋转拼 Truchet。图形学细胞噪声Cellular NoiseSteven Worley（1996）《A Cellular Texture Basis Function》——书中注明约在 Perlin 原始噪声发表十六年之后、其 Simplex Noise（2001）五年之前——把程序纹理建立在「到最近特征点的距离」上，即细胞噪声 / Worley 噪声。GPU 上用格子 + 邻域搜索代替「对全体点求最小距离」；再多存最近特征点身份即可得到 Voronoi 图。后续有 2×2 邻域加速、精确边界与「voro-noise」等变体。