The Animation System of Velocity 2X
Subscribe:  iCal  |  Google Calendar
Marina Del Rey US   10, Dec — 13, Dec
Las Vegas US   8, Jan — 12, Jan
Zürich CH   31, Jan — 4, Feb
Leamington Spa GB   31, Jan — 3, Feb
Bradford GB   6, Feb — 11, Feb
Latest comments
by Duacan
14 hours ago

hello Alexander, I really loved your these draw works. I loved cathedrals too.I started 3ds Max new. And I really really want to meet you, if you wanna to do. By the way, my name is Duacan, from Turkey. also Im working for learning and speaking German. Cause Deutschland is the my first country for living. Whatever, take care yourself, Tschüss. insta: 06optimusprime06

by Asadullah Sanusi
2 days ago

nice blog but here is the thing, what is wrong with overlaping uv's and mirroring them, what are the cons of overlapping them and why is this method better in the case of uv? thanks

Thank you @Fcardoso The volumetric light is available in the latest 2018.3 beta. In the visual environment setting, there is a new option to select Volumetric light fog. The screen I shared is from 2018.2 during that time I was using a script to enable it :)

The Animation System of Velocity 2X
6 July, 2017

James Marsden from FuturLab allowed us to repost his article on the animation principles behind fast-paced 2D game called Velocity 2X. It appears that the project is based on traditional hand drawn sprite animations. Find out the reasons for this decision in the article below.

The beauty of 2D

The animation system for Velocity 2X is based on traditional hand drawn sprite animations to give the artists full control over style and fluidity. Given the wide range of actions performed by Kai, it meant that we needed to tackle potentially thousands of frames of animation.

For instance consider 360° shooting; we have 64 frames for Kai firing in all directions. Now consider all the different situations in which Kai can fire in 360°: standing, running, jumping, falling and sliding.


Rotating knees FTW!

Let’s just take a look at Kai’s run animation, which consists of 30 frames. For each one of those 30 frames, she can be firing in any direction that requires one of the 64 shooting frames.

This means we would need 64*30 = 1,920 frames of animation just for Kai’s running and 360° shooting. That is almost 2,000 frames of animation just for one set of actions!

If we multiply that by 5 (to consider all the cases above where she can fire in 360°) we end up with an art requirement for OVER 9000 (frames of animation)…

Obviously this was impractical from both a production and physical memory point of view, so to get around this issue we split each frame of Kai’s animation into two halves. We have the bottom half (waist and legs) independent of the top half (torso, head and arms). The following image shows the actual in-game sprite sheet for Kai:

Kai Tana Split

In the game we render the bottom and top halves of these sprites with the appropriate scale, offset and overlap values so that Kai appears as a single seamless sprite:


Factoid: This is the same technique James used for his early Flash game, PRISM.

This means that we just have the 30 frames of animation for her running, and the 64 frames for her 360° shooting. The system works as long as the frames are authored in a way that they can be stitched together. Kudos to our artists for figuring out they needed to draw her back arm so it never overlaps her waist…

For those keeping stats, we have over 1000 hand-drawn frames of Kai’s animation that are stitched together at run time to give us over 10,000 total frames of motion.

Bob’s your (slightly irritating) uncle

One last note, even though this system worked for us, it was the most complicated section of code in the game. Not because of the complexity of the system, but because the human body bobs up and down as it runs. Therefore we needed offset values for the top halves to match the action of the legs in the bottom halves. These offset values needed to be hard coded for each and every frame to make sure the animation of her bobbing up and down as she runs remains fluid and seamless no matter what the player decides to do in the game.

Needless to say, this is one aspect of our codebase that I’m happy to never look at again!

It was all worth it. Check out the smooth animation in the trailer below:

 P.S. Ever wondered why Kai’s metal head plate changes sides? You can probably work it out now…

James Marsden, the team of Velocity 2X

Source: FuturLab

Leave a Reply

Be the First to Comment!