Lesson 7 of 10 · Shader patterns
Mirror
abs() reflects. One hexagon becomes four.
Imagine folding a piece of paper in half. What you draw on one side shows up on the other. That is abs().
abs() turns negative numbers into positive ones. If p.x goes from -1 to 1, after abs() it goes from 1 to 0 to 1. The left half becomes a mirror of the right. Instant symmetry.
abs(), fold the space. One shape becomes four.
abs(p)Applied to both coordinates, you fold the paper twice, horizontal and vertical. What you draw in one quadrant shows up in all four. One shape becomes four without writing anything extra.
Remove the
abs and see what it looks like without the mirror. Try just abs(p.x) instead of abs(p) for a single axis of symmetry. Change 0.22 to 0.35 for bigger hexagons. To 0.12 for smaller ones.The code
void main(){
vec2 p = (2.*gl_FragCoord.xy - R) / min(R.x, R.y);
vec2 q = abs(p);
vec2 hc = vec2(0.4, 0.35);
vec2 ap = abs(q - hc);
float hex = max(ap.x*.866+ap.y*.5, ap.y) - 0.22;
float shape = smoothstep(.02,-.02, hex);
float inner = smoothstep(.01,-.01, length(q-hc)-.08);
vec2 sp = abs(q - hc + vec2(.05,-.06));
float shadow = smoothstep(-.02,.2, max(sp.x*.866+sp.y*.5,sp.y)-.22);
float glow = exp(-max(hex,0.)*5.) * .4;
float mirror = max(smoothstep(.025,.0,abs(p.x)), smoothstep(.025,.0,abs(p.y)));
vec3 col = vec3(0.03,0.02,0.08) * shadow;
col += vec3(0.0,0.95,0.65) * shape;
col += vec3(0.95,0.92,0.88) * inner;
col += vec3(0.0,0.5,0.35) * glow;
col += vec3(.2,.15,.35) * mirror * .6;
col *= .8 + .2 * exp(-length(p)*.4);
gl_FragColor = vec4(col, 1.);
}