Lesson 9 of 10 · Noise in GLSL
Force
Noise as displacement. The pattern bends.
Noise does not only color, it can push. Use noise to displace the coordinates of a pattern and that pattern deforms. Straight stripes twist.
Clean broadcast. Noise destroys it.
Noise as forceInstead of
sin(p.x) you use sin(p.x + noise). Noise pushes before evaluating. Preview of what comes in Domain Warp.Change
0.5 to 1.5, extreme deformation. To 0.1, barely noticeable.The code
void main(){
vec2 p = (2.*gl_FragCoord.xy - R) / min(R.x, R.y);
// Broadcast bars, clean signal
float bar = floor(p.x * 7.0 + 3.5) / 7.0;
vec3 signal = vec3(0.0);
signal += vec3(0.9, 0.9, 0.9) * step(0.0, bar) * step(bar, 0.14);
signal += vec3(0.9, 0.9, 0.0) * step(0.14, bar) * step(bar, 0.28);
signal += vec3(0.0, 0.9, 0.9) * step(0.28, bar) * step(bar, 0.42);
signal += vec3(0.0, 0.9, 0.0) * step(0.42, bar) * step(bar, 0.56);
signal += vec3(0.9, 0.0, 0.9) * step(0.56, bar) * step(bar, 0.7);
signal += vec3(0.9, 0.0, 0.0) * step(0.7, bar) * step(bar, 0.84);
signal += vec3(0.0, 0.0, 0.9) * step(0.84, bar);
// Noise destroys the signal
float push = n2(vec2(p.y * 4.0, 0.5)) * 0.5;
float destroy = n2(vec2(p.y * 8.0, 1.5));
float glitch = step(0.7, destroy);
vec2 broken = p + vec2(push * glitch, 0.0);
float bar2 = floor(broken.x * 7.0 + 3.5) / 7.0;
vec3 corrupt = vec3(0.0);
corrupt += vec3(0.9, 0.9, 0.9) * step(0.0, bar2) * step(bar2, 0.14);
corrupt += vec3(0.9, 0.9, 0.0) * step(0.14, bar2) * step(bar2, 0.28);
corrupt += vec3(0.0, 0.9, 0.9) * step(0.28, bar2) * step(bar2, 0.42);
corrupt += vec3(0.0, 0.9, 0.0) * step(0.42, bar2) * step(bar2, 0.56);
corrupt += vec3(0.9, 0.0, 0.9) * step(0.56, bar2) * step(bar2, 0.7);
corrupt += vec3(0.9, 0.0, 0.0) * step(0.7, bar2) * step(bar2, 0.84);
corrupt += vec3(0.0, 0.0, 0.9) * step(0.84, bar2);
vec3 col = mix(signal, corrupt, glitch);
col += vec3(0.9, 0.0, 0.5) * glitch * 0.15;
float scan = step(0.5, sin(gl_FragCoord.y * 2.0) * 0.5 + 0.5) * 0.08;
col *= 1.0 - scan;
col += vec3(0.01);
gl_FragColor = vec4(col, 1.);
}