Sub-Pixel animation for Retro Sprites

anim1

So, I love pixelly graphics. It’s pretty obvious from my games that not only is it the only thing I can draw it’s also the main thing I like to use. I always scale them up 3 or 4 times and get that big clunky retro feel.

However, I’ve never really been happy with the movement in the sprites – specially how long it takes me to do animations. I was looking at Cube World and thinking about the difference in resolution of the character voxels to the rest of the world. Just because you’re working in a theme doesn’t mean you can’t bend it to suit what you want!!!

At that point I’m starting to think above my pixel creations, what if I applied the same logic there. When I scale up my sprites each pixel has 3×3 actual pixels so in the animation there’s room to move parts of the sprite at a higher resolution – neato! Hmm, but how to do I allow myself one resolution for animation and one resolution for pixels? (I want to clamp myself to the right retro feel). Skeletal Animation!

So I rapidly take my existing sprites, rip them into separate limbs and body parts and re-spritesheet them up. A little bit of coding later and I have a skeletal model that allows me to rig them all together!

cast1

 

So now I’m back to my original sprites only with them being built out of smaller pieces. That in itself is awesome since it means I can create lots of variations for a game I’m planning on writing shortly.

Next, what about animation? Once the links between bones are defined and the skins attached all I need to do is apply transforms. Excellent! I can even rotate tiny pixelly weapons to give nice stylistic effects! Me being me, the next think I do is build a Java Swing based tool to support test out different configurations and animations:

anim1

 

So, having defined animations against the bones, I try out a few skin combinations and what do I end up with? Well, awesomeness thats what!

Check out my current cast:

7 comments

  1. The animation looks very fancy. The movement is smooth as hell o.O

  2. titoasty says:

    oh this is very cool !
    exactly what I was looking for..
    is there any little chance you release the source ?
    good job !

  3. Kevin says:

    Love the animation! I’m trying to find a good way to make smooth pixel animations myself. Did you make that Animation Builder or is that a program anyone can download?

  4. Jarek James says:

    Water levels are always the hardest

  5. Joshua Wood says:

    Nice work as always Kevin, I was really interested in trying to do a similar implementation myself. Took awhile, mostly because I’ve lacked freetime, but after some work and a total rewrite or two I managed this:
    https://www.youtube.com/watch&v=mybZzxa6Rzc

    Credits go to you for the Wizard sprite and inspiration of course! ^^

Leave a Reply

Your email address will not be published. Required fields are marked *


+ six = 8