athena fung

intro to shaders

I'm currently working through The Book of Shaders. Here are some demos playing with concepts I learned from the introductory chapters.

Let's just get a colour going. I'm aiming for Barbie™ pink, which according to Encycolorpedia is comprised of 87.84% red, 12.94% green and 54.12% blue.

	gl_FragColor = vec4(0.8784,0.1294,0.5412,1.0);

Playing around with time.

	gl_FragColor = vec4(abs(cos(u_time)),abs(sin(u_time)),abs(atan(u_time)),1.0);

Playing around with the mouse position.

  vec2 mouse = gl_FragCoord.xy/u_mouse;
  gl_FragColor = vec4(mouse.x, mouse.y, 0.5, 1.0);

Playing around with mouse and time.

  gl_FragColor = vec4(abs(cos(mouse.x)), abs(sin(u_time)), 0.5, 1.0);

Nolan had a nice demo for better understanding the canvas coordinates. This is using the step interpolation to specify the edges.

  float green = step(0.7, st.x);
  float red = step(0.7, st.y);
  gl_FragColor = vec4(red, green, 0.5, 1.0);

This is using the smoothstep function to specify lower and upper bounds for a smooooth transition.

  float red = smoothstep(0.65, 0.75, st.y);
  float green = smoothstep(0.65, 0.75, st.x);
  gl_FragColor = vec4(red, green, 0.5, 1.0);