• Register

Devader is an intense 90's-style twin-stick shooter, complete with crazy old-school bosses, powerful strategic abilities and multiple endings. Upgrade your robot with nukes, shields, turrets and more to exterminate the relentless invaders. The game allows for different play styles and will reward players who chose different paths with multiple endings.

Post news Report RSS Devader: Progress since Gamescom

Talking about splattering, framebuffers, black stuff and glowing bullets.

Posted by on

After Gamescom I was very much aware that I had some pretty bad performance issues. I was using the GPU heavily with all the splatter effects that were left lying around. A few thousand at a time using alpha-blending was astonishingly taxing on lower level graphic cards. I had a simple idea, that proved to be a lot more efficient. Instead of drawing the splatter polygons every frame, I now only draw them once onto a framebuffer. This framebuffer is painted to a second framebuffer with a shader to slowly fade out the splattering over time. Works nicely, but I no longer have control of how long the splattering is visible.

splatter effects on the new framebuffer

After discovering the framebuffer a few new ideas popped into my head. So far I had created a storm like effect by drawing many images with specs of dust and moving them across the screen, with a bit of scaling/rotating. It looked ok, but was not really pretty. It was also very bad for performance, as in the splatter case many large textures with alpha blending were used. I decided to use the double framebuffer technique as in the previous case. The results were pretty nice. I added some parameters for storm center, randomness and color of the generated dust. For testing purposes I used the mouse cursor to define the storms center, the result can be seen in the following gif.


One thing that was missing from the storm was some kind of interaction with the world. As my storm shader was already self-referring I decided to simply paint everything I was painting to the storms framebuffer as well. This looked pretty chaotic, but you can tell how the storm interacts with the rendered images.

With a little tweaking I made the storm effect a bit weaker. The storm now only interacts with explosions and I am pretty happy with the result.

webgl storm using two framebuffers


The other thing I tested was a new background. So far I was mixing two textures in the shader. Now I have a background texture stored in a framebuffer, that can be changed over time. Much prettier and it will also allow me to create a more interesting background. In this image you can see the background, as all the sand was blown away.

I noticed my shaders were not allowing me to create proper black. I had always been wondering why my screenshots looked a little muddy. If you check out the image above, you will see the towers are actually never really black. This was an easy fix, when I finally noticed it was my fault all along. I had actually started blaming my image editor.

big black tentacles

I redid nearly all enemy shots. They now have a black core and glow on the outside. At the same time I made a pretty big improvement for performance. I was painting nearly all shots with 2 images. One basic image and another larger one, slightly transparent with additive blending. I merged these two images and with a bit of shader code managed to get a similar effect (its actually better). So I halved the polygons required for the shot. Less polygons to paint and to calculate seems like a good thing.

the new glowing black shots

I'm currently working on a new demo, that I would like to release at the end of this month for Windows, OSX and Linux. I'm currently having some trouble creating the Linux build. I've installed Linux via Virtualbox on my Windows system and it's horribly slow. I haven't managed to transfer any files so far either. Not much fun. But somehow I will get there.

Stay tuned!

Post a comment

Your comment will be anonymous unless you join the community. Or sign in with your social account: