Sprite Stacking

31 Oct 2019

I came across this cool sprite rendering technique a few months ago and I recently decided I would have a go at implementing it. It turned out not to be as hard as I thought it was, although I am a long way from perfecting it.

Overview

The underlying idea for this technique is actually quite simple. The 2D sprites can rendered in 3d and layered on top of one another, and then the result is pixelized.

This is what the model looks like before the pixelization shader is run:
before

And this is what it looks like after:

Problems

From the final result, you can see the separation between the layers on certain angles. To fix this, I tried using rounded edges on the corners of my sprites, like this:
layers

When blown up in scale, the separation is still clearly visible, like this:
fragment

I haven’t come up with a good fix for this yet, but for the project I have in mind keeping the models small should help enough in making the visual separation disappear.

Conclusion

I don’t write enough posts so I still have no idea how to end them (not that anyone reads it anyways). I didn’t realize I had so little to say so this post turned out a bit short. I guess let me know if this was helpful and be on the lookout as I post new things :D (also follow me on twitter I am very lonely)