vec4 vector; vector = vector.r = vector.x = vector.s; vector = vector.g = vector.y = vector.t; vector = vector.b = vector.z = vector.p; vector = vector.a = vector.w = vector.q;
Changing the position of vector properties to create new values. E.g.
vec3 green = vec3(1.0, 1.0, 0.0); vec3 magenta = green.rbg;
GLSL is deterministic, doesn't have memory management and operates on every
pixel of the canvas. In order for dynamic behavior to happen, shaders have a
be any value, though common values to transmit are
globalTime. Uniforms are commonly prepended with
i. Here's an overview of
commonly defined uniforms:
float iGlobalTime Time in milliseconds, increments linearly vec3 iResolution Canvas size in xyz, where z is always 0
GLSL has built-in functions and built-in variables.
vec4 gl_FragCoord Location of the pixel on the screen, has an xyzw component
glslify brings NPM to GLSL; the hot sauce to the steam buns. Instead of copy-and-pasting large snippets of code, it enables you to import those snippets as modules instead. This allows for more focused user-facing code, that can be understood by more people than just the author. Imports are defined and consumed in pragmas, so the glslify specific code is neatly tucked away in a single location.
Shaping functions are the corner stone of algorithmic drawing. Essential to generate anything with WebGL.
- curl noise: used for particle motion, particular useful for smoke and other similar effects
- perlin noise: kind of like photoshop's cloud filter
- simplex noise: similar to perlin noise, but a hella lot faster
- shadertoy - graphics playground & demo room
- glslb.in - modular graphics playground
- the book of shaders - damn good tutorial
- Inigo Quilez - hub of everything you'll ever need to know about graphics
- geeks3d - articles on 3d stuff
- learningwebgl - articles on WebGL stuff
- webglplayground - nice urt
- Essential Mathematics for Games and Interactive Applications - neat book
- lwjgl essentials - LibGDX/LWJGL tutorials and examples
- drawing lines is hard
- gpgpu utils for three.js
- retro shaders rayman legends
- on generative algorithms
- fake and cheap metaballs