Snake o.S. has no sprites or effects at all (there were some 2D sprites, though --did you clear the game?), but recently I've been playing around and adding some sprites to the engine.

I found this paper, Weighted Blender Order-Independent Transparency, and I decided to give it a try. The idea behind it is quite simple, but powerful. All the alpha-geometry is rendered in any order, and given a weight per pixel. In a final compositing pass, the weighted color sum is normalized by the alpha sum.

This is very attractive, since it means I don't have to sort the sprites on the CPU, plus the blending is per-pixel, so it gives more detailed and consistent results. The only problem is finding an appropriate weighting function. In my case, because the distances are very short (50 is the farthest), I've used a simpler function than that of the paper. It's a simple Gaussian, with a maximum value of 100, and with a tail starting around z=50.

Here are 3 unsorted sprites, being the blue one the closest to the camera, and the red one the farthest one,

And here's the result using OIT,

They look a bit blurrier because I'm rendering them at half resolution in a separate buffer. For comparison, here are the sprites using normal alpha-blending again, after sorting the sprites back to front,

I took a couple of videos of something that pretends to be a cloud... The one below is using normal alpha-blending. Of course if the sprites were sorted, it would look better, but there are always popping artifacts

And this is the result of using the Weighted Blended OIT

I think the result is quite impressive for the simplicity of the algorithm. The problem is that I need MRT and float buffers, so it's going to be OpenGL ES3.0 only. For ES 2.0 I should consider sorting the sprites and go for a traditional method, but since I'm doing this engine as a hobby, I think I'd rather keep improving it for ES 3.0 devices, and keep just a small subset of features in ES 2.0

Tweet