Rendering without meshes

Posted by on Jun 16, 2010 | 3 comments

Well, I’m actually showing off some work that was done a while back – but it’s still nice.

What you see here is an early version of one of our game creatures (aka Gummy) jumping around on a small part of a test level. The interesting thing here, is that no meshes (you know vertices, polygons and all that stuff) are used for rendering – it’s all done with sprites and some shading tricks.

Why I like particles?

To explain how it’s done I need to provide some additional background first. Our game-play is 2D in nature and is fully physics based. I have done plenty of physically based simulations for non-game applications, so when we decided to start developing Confetti Carnival it was a natural to ‘tap’ into that experience and to create our creatures from a set of particles (all particles have masses associated, embedded force elements and so on).  I won’t go into the simulation part right now, although there are interesting stuff there too.

The common practice in these cases is to create a mesh that can be ‘skinned’ over the elastic creatures. However, in this case, our creatures are made of a liquid/gel like substance, so I decided to explore ways to render them using liquid-like techniques.

Creating a surface using particles

Instead of generating a mesh, I render sprite particles with color and depth information onto a render target. The particles are created to cover the entire creature and depth is accumulated into the render-target. Each sprite uses a simple soft sphere-like 2D texture and the accumulated spheres gives the final shape. In the final pass, the render target is sampled to provide depth, color and normal at each pixel, which gives enough information to visualize it.

There are several great benefits from using this technique, especially in the context of what we are trying to achieve. But the most important and immediate benefit is that even when the creature is severely deformed, the resulting shape remains totally smooth.

What you don’t see in the video (but is already implemented and working), is the ability to use textures to give the Gummy a not-so-smooth look and also to add local creature details such as eyes, face and any other features the Gummy might have…

Hope you enjoyed this,

Niv

3 Comments

  1. Helpful blog, bookmarked the website with hopes to read more!

  2. Cool! We did exactly the same on Goo!. More or less the entire genesis of the design Goo! was based around the possibilities of that effect. Took a while for Tommy to figure out how to pack the height data with enough precision to keep smooth heightmaps, but he got there in the end.

    I think you’ve managed to really nail a very cool visual style, while we were just programmer arting it up :). I am really looking forward to this one.

    I did, at one point, do a pretty cool refraction effect on the goo… and actually split how the separate RGB values were distorted to give that strange “prism” effect. Ended up with something that looked very close to an amoeba. Was very pleased with that one.

    • Thanks!

      I did have Sagi around to keep telling me to go back and fix things (visually) – otherwise I might have ended up with something ‘programmer artish’ as well.

      There are so many ways to play around with this effect you just have to stop at some point and finish it up. But still I find myself coming back to the shaders just to play around with colors/normals/reflections/refractions – just so much fun to play with!

      Take care

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>