24 essential terms — from pipeline fundamentals to advanced rendering concepts.
Fragment Shader
Runs once per pixel during rasterization. Outputs a final color vec4(r,g,b,a). The primary arena for all shader art — a pure function from position to color.
Vertex Shader
Executes once per vertex. Transforms 3D positions to screen space. In fullscreen shader art, operates on a simple 2-triangle quad covering the viewport.
GLSL
OpenGL Shading Language. C-like language for writing GPU programs. Built-in vector types (vec2, vec3, vec4), math functions (sin, cos, mix, smoothstep). Runs on the GPU.
UV Coordinates
Normalized 2D space (0.0–1.0) mapping texture to surface. The fundamental coordinate system for shader art. Often remapped to (-1, +1) for centered math.
SDF (Signed Distance Function)
f(p) returns signed distance to a shape surface — negative inside, zero on surface, positive outside. Enables precise shapes, boolean ops, and smooth blending.
FBM (Fractional Brownian Motion)
Summed noise octaves: Σ amplitude×noise(p×frequency^i). Decreasing amplitude, increasing frequency creates natural-looking terrain, clouds, turbulence.
Voronoi
Diagram partitioning space into regions by nearest seed point. Distance to nearest point creates cellular textures — stone, soap bubbles, organic surfaces.
Noise
Pseudo-random continuous function — unlike hash(), noise has spatial coherence. Every shader noise (Perlin, Simplex, Worley) builds on this concept.
Perlin Noise
Ken Perlin's 1985 gradient noise. Smooth, controllable, continuous. Foundation of procedural texture generation for 40 years.
Simplex Noise
Perlin's 2001 improvement. Triangular simplex grid — fewer directional artifacts, lower complexity in higher dimensions. Preferred for most applications.
Worley Noise
Steven Worley's cellular noise (1996). Distance to nearest random point produces cells. Used for stone, reptile scales, cells, biological surfaces.
Smoothstep
GLSL built-in: smooth cubic Hermite between two values. smoothstep(a,b,x) → 0 below a, 1 above b, smooth S-curve between. Fundamental for shape anti-aliasing.
Mix
Linear interpolation: mix(a,b,t) = a*(1-t)+b*t. The most-used GLSL function. Blending colors, values, and entire visual systems.
Uniform
CPU→GPU variable, constant across all fragments in a draw call. Common: u_time (animation), u_resolution, u_mouse. The interface between app and shader.
Varying
Data interpolated from vertex shader to fragment shader. UV coordinates are varyings — smoothly interpolated across each triangle's surface.
WebGL
Browser GPU API based on OpenGL ES 2.0. Exposes GLSL shader programming to JavaScript. Powers Shadertoy, Three.js, and all browser-based shader art.
GLSL ES
GLSL Embedded Systems — the subset used in WebGL. No geometry shaders, limited texture types. Version 1.00 for WebGL 1; version 3.00 for WebGL 2.
Raymarching
Rendering by advancing rays through SDF space. Step forward by f(p) each iteration — the SDF guarantees no geometry within that distance. Enables 3D in a fragment shader.
Feedback Loop
Reading the previous frame's render as input to the current frame. Creates decay, echo, trails, and complex temporal dynamics. Core of analog video synthesis.
Ping-Pong Buffer
Two framebuffers alternating roles as source and target. Enables feedback loops and multi-pass rendering in WebGL without sampling the render target.
Texture Sampler
GLSL uniform for reading texture data: texture2D(sampler, uv). Can sample images, noise textures, or previous frame renders. Foundation of multi-pass effects.
Normal Map
Encodes surface orientation in an RGB texture. In raymarching: computed as gradient of the SDF — normal = normalize(∇f(p)). Enables lighting without geometry.
Occlusion
Ambient occlusion: surfaces near other surfaces receive less ambient light. In SDF scenes: computed by sampling the SDF along the surface normal at multiple distances.
Procedural
Generated entirely from mathematical functions rather than sampled assets. No resolution limit, infinite variety, fully parameterizable. The defining characteristic of shader art.