My game's characters are made up of different parts (head/body/legs/etc), and whatever items they have equipped. As I'm creating the animation system for my game, I want to try to anticipate a large number of combinations for different pieces for each character. Originally, I had planned on having a frame-by frame animation for each piece for each animation, and then layer them to combine them into a character, but this seems like it would be a lot of work for my artist, and that the memory/disk size would start to add up as well since we would need a sprite for every frame, of every customization of every piece, in every animation, for every character.

What efficient ways are there to create/implement these animations as we add more and more configurations to our game?

Edit: I'll also point out that my artist is using flash to make the graphics and animations, but the game is in Java (libgdx, but I can also hard code OpenGL if I need to).


You could create a structure of points where you can "attach" images. Then you could set these points according to the current frame. For example a simple hero character which can have different helmets and different melee weapons and has the animations "move" and "strike", for these animations you have a sprite sheet with everything except the weapon and the helmet, now you can take these sprite sheet and a text editor and note for each frame where the helmet and the weapon is, including rotation and maybe size too. Using this data you can dynamically compose the character.

Example code for better understanding:


int[] coordinatesX={4, 5, 6,  7, [...]};
int[] coordinatesY={8, 9, 10, 9, [...]};
int[] rotation={10, 15, 20, 15, [...]};
weaponSprite.setPosition(coordinatesX[curFrame], coordinatesY[curFrame]);

  • \$\begingroup\$ I've thought of doing this, but how would my artist be able to create these keyframes? \$\endgroup\$ – Nick Badal Jun 30 '12 at 4:02
  • \$\begingroup\$ Reading coordinates and writing them down :) That doesn't sound very artistic but it works. Point is this way you will only need coordinates once for every animation, instead of for every item making it very unproblematic. Definitely a lot less work for the artist. \$\endgroup\$ – API-Beast Jun 30 '12 at 4:09
  • \$\begingroup\$ Problem is: in Flash, which my artist uses, you cant see the required numbers. Flash uses a combination of skewing and scaling to mimic rotation. \$\endgroup\$ – Nick Badal Jun 30 '12 at 4:19
  • \$\begingroup\$ Well, at some point it has to be exported. If Flash itself doesn't allow it then pick those coordinates from the exported images. \$\endgroup\$ – API-Beast Jun 30 '12 at 7:18
  • 4
    \$\begingroup\$ Pseudocode is simply code that isn't intended for being compiled or run and thus might simplify things, leave some language specific stuff out, etc. It can look pretty much any way. Still pseudocode. \$\endgroup\$ – API-Beast Jun 30 '12 at 15:10

Have your artist create template animations using generic parts that can be swapped out.

If possible with libgdx, find each generic part (eg, with an instance name), and set visible=false for the generic part and addChild() the replacement part with copied position/rotation from the generic part.

Alternatively, have the artist save the generic animation with Choose File > Save As > Save as Type > uncompressed XFL. The XFL file format is a way to represent a Flash Professional document as an XML-based, open folder of files.

From the XFL folder, look at the positions and rotations in XML to build the tables as suggested by Mr. Beast. After you figure out the format, you could write a tool to do this automatically so that when animations are updated, you can quickly get them into the game.

  • 1
    \$\begingroup\$ addChild(), as far as I could find (correct me if I'm wrong), is used for 2d scene layout, specifically, a table layout. This would make it inappropriate for use in animations. I would not do it this way. \$\endgroup\$ – Amplify91 Oct 4 '12 at 8:03

I'd never found an answer to this question until recently with the Kickstarter project Spine.

It looks like it will do exactly what I'm asking :)


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.