visit tracker on tumblr

Introduction to Procedural Texturing

A while ago I gave an introductory guest lecture about procedural texturing at the university of oldenburg. The slides of the lecture are now available on slideshare:


WebGL, Shadertoy & Co

WebGL is an API specification for hardware accelerated 3D graphics on the web. It is a low-level API that is based on OpenGL ES 2.0 and JavaScript and works on top of HTML5's newly introduced canvas element.

UPDATE (Posted on Jun 27th, 2013):
Even Microsoft who first considered WebGL harmful now confirmed that IE11 will ship with WebGL. It seems they finally realized (two years after all the other major browser developers started to support WebGL tho') that WebGL is a de facto standard for 3D on the web and they probably will end in an uncompetitive position if they don't start to support it.

The Code

To get WebGL up and running you first need to place a canvas element inside your HTML script:

With WebGL supported it is possible to request a WebGLContext for the canvas element.

function initWebGL() {
	canvas = document.getElementById("canvas");
	try {
		gl = canvas.getContext("experimental-webgl");
	} catch(e) {}

Through this context you can directly render into the canvas element using low level WebGL API calls. Since WebGL is based on OpenGL ES 2.0 it does not support the fixed function transformation and fragment pipeline of OpenGL ES 1.x. There are quite good resources on the internet that teach you WebGL (see the reference section of this post).

My Experiments

Below is a small selection of my WebGL experiments. All of them apply real-time sphere tracing in the fragment shader (click the thumbs to watch them in real-time directly in your browser).

In case your web browser does not support WebGL you can watch the videos of my experiments on youtube here, here, here, here and here. In case you want to play around with the code it is also available on Shadertoy right here.


Harmonic Potential Field Path Planning

The last few days I have been quite busy developing a test bed for harmonic potential field path planning focussing on the needs of the 2D simulation league of the RoboCup. The test bed applys GPGPU techniques to construct a discrete configuration space representation using implicite surfaces through distance fields and solves laplace's equation on the free configuration space using Jacobi method on the GPU. To solve laplace's equation it applys emulated double precision to improve accuracy.

I gave a short talk about the test bed within the scope of my bachelor thesis. The slides of the talk are now available here and as usual on slideshare:

There is also a capture of the test bed available here and the bachelor thesis itself here. The test bed code is written in java and makes use of the Java Bindings for OpenGL (available on The source code will be released after a clean-up.