Read me About Demoscene? Links Contact

Shader fiddling

Once in a while you just want to get away from big projects or major design choices  and get back to basics. In my case this means plotting simple pixels on a blank screen.

However, I am a modern person and plotting simple pixels on a blank screen no longer means direct access to VGA memory at 0A000h. In these days of GPUs and modern APIs there is no such concept as a simple pixel (well there is, but it is “so last season”).

Instead I’ve started fiddling with fragment shaders or pixel shaders. These doesn’t allow you to plot pixels straight away. What they do allow, is programming of what color the GPU should assign to a given pixel at a given (u,v)-texture coordinate.

So, to be able to plot a simple pixel you must setup your OpenGL code to ortho-projection of a square taking up the whole screen and apply your fragment shader to this.

In pseudo code it looks like this:

  1. Initialize OpenGL
  2. Setup orthogonal projection (-1,-1)x(1,1)
  3. Load and compile fragment shader
  4. Loop step 5-8
  5. Parse information about resolution, time, etc. to fragment shader
  6. Attach fragment shader
  7. Draw a square (-1,-1)x(1,1)
  8. Detach fragment shader

Most of the steps above are straight forward. Actually they all are.

Anyways, as I’m a lazy person I also enjoy doing rapid development of this shaders. Which where my demo-friend Inigio Quilez comes into the picture. He has made a web-page where one can find sample fragment shaders (some more impressive than others) and in return write shader fragments directly in the browser. To be able to run the Shader Toy you must have a WebGL enabled browser (such as Google Chrome in development build)

You can find Iq’s Shader Toy from by clicking this link!