Lesson 10 of 10 · GLSL for beginners
The tunnel
Everything together. 1/distance. Everything you learned in one output.
This lesson does not teach anything new. It brings everything together: centered coordinates, time, waves, circles, colors that change.
Look at the code. You already know every line:
- →
vec2 p = ...centered coordinates (lesson 06) - →
length(p)distance to center (lesson 09) - →
sin(inv * 3.5 - T * 3.)moving waves (lesson 08) - →
mix(c1, c2, ...)blend two colors (lesson 05)
This is your first piece. Concentric rings that pulse, made with everything you learned in these lessons.
1/distance. Let's travel.
Change
3.5 (tunnel frequency) to 8. for thin rings. To 1.5 for wide rings. Change T * 3. (tunnel speed) to T * 1. and the ride goes hypnotic. Change both colors. This is your piece now. Make it yours.The code
void main(){
vec2 p = (2.*gl_FragCoord.xy - R) / min(R.x, R.y);
float d = length(p);
float inv = 1. / (d + 0.12);
float tunnel = sin(inv * 3.5 - T * 3.) * .5 + .5;
float glow = exp(-d * 2.5) * 0.6;
vec3 bg = vec3(0.015, 0.008, 0.05);
vec3 ring = vec3(0.75, 0.2, 0.9);
vec3 core = vec3(0.95, 0.85, 1.0);
vec3 col = mix(bg, ring, tunnel * (1. - d * 0.4));
col += core * glow;
col += ring * pow(tunnel, 4.) * 0.25;
col *= 0.9 + 0.1 * tunnel;
col = hueShift(col, 0.0);
gl_FragColor = vec4(col, 1.);
}