Category Archives: WebGL

Modified lambert in webgl

i wrote a little demo with a modified lambert function in webgl:

You can clamp the illumination into the “brighter” colors that is expanded into the (usually unlit) back areas and thus allows you lit the whole object. The light can be toggled between a (fixed) lightsource and the camera-position. This is usefull if you (cheaply) don’t want to show “dark parts” of 3d-models while still showing the structure. It can be further tweaked (not implemented yet!) by adding gamma or a two-tone mapping.

WebGL-Paccer (more three.js)

Here’s a little simplified version of a rather known game I’d like to call “WebGL-Paccer”. You play as a yellow ball, trying to eat all the dots before the enemy gets you. Yeah, that one.


Even though it has a distinct “retro” look, I added an FXAA-aliasing and a bloom-filter to it. I tried doing some dynamic cube-map for floor-reflections, but it didn’t fit the theme.

Maybe in an extended version could not only add more enemies (Blinky, Inky, Pinky, Clyde) but also some more fx. I loved Geometry wars, maybe some effects from them could fit in here…

WebGL: three.js & dat.gui.js

I’ve uploaded an updated WebGL demo I wrote some time ago. It shows a vertex displacement shader on simple models and applies some screen-space image filter (=fragment shaders) to it:

Here are selected screenshots:

Screen Shot 2013-05-17 at 7.03Screen Shot 2013-05-17 at 7.07

Screen Shot 2013-05-17 at 7.04Screen Shot 2013-05-17 at 7.06

The effects implemented are:

  • Vertex shader displacement
  • TwoTone shading
  • CEL-Shading
  • Gaussian Blur
  • Image Enhancement by unsharp masking the depthbuffer
  • Gamma/Contrast/Brightness adjustment