Vector animation, or the solution: Spriter by BrashMonkey

Task: Make a small crab sprite with a walk animation.

hmm, pixel art animation and me, not so good. So what was the alternative. I searched the great big internet, and found an article telling me that Inkscape was the tool to use. I had tried it before and liked the idea of being able to tweak the image without having to repaint it, just move the vector elements. So I found an image on Google that I could use as a reference image, and started painting.

Ok, maybe, just maybe I should have read some more about how, Inkscape was used to animate.. Ok so you make all the frames in Inkscape, export them one by one and then use Gimp (wonderful tool) to make the spritesheet.. Eeerrr, that was kind of what I didn’t want to do. So back to searching the net.

Success, Synfig! Ok, here was a tool that was vector based and could animate like hell 🙂 Yay! So tried to import my Inkscape crab, as it was in svg format, but no success 🙁 Not a great start, but ok, I could start over. So a new crab was born.. But hell to do, compared to Inkscape. Everything was drawn with the origin at the center of the screen, not the object, and worse, you can’t move the origin! What the ….? Ok, painting the first eye and made a group, everything is to be in groups in Synfig, and wanted to copy and mirror the group. Copy, ok. Mirror…. mirror… hmmm.. No? You can only mirror individual objects, and as the origin was fubar the first place I had to do this via scaling (x=-1.0) and the try to move the new mirrored legs to the right location, and by using the scale function something was off, and the moment was weird. I’t might have been me, but I didn’t have ANY problems in Inkscape. So the thought of having to do animation and rotating (around the center of the selected points only) and moving objects around, just told me to, not go there.

And the crab looked worse in Synfig, as every change was a pain compared to Inkscape.

So what to do… I was thing of using Unity and the new 2d animation support, but I used it before, with success but it felt off, and not completely thought through. So I hit the new for the third and final time. If I didn’t find anything I would just make 3-5 crappy crab frames in Gimp or PyxelEdit (another GREAT tool). But by luck I found what I was looking for, I hope. It’s called Spriter, and if it’s half as good as it looks I’m going to be a very happy guy. You can download the free version at the BrashMonkey site, and try it out for your self. I have played with the free version and the demo project last night, and it just feels right in every way. So I just spend the 25$ for the full version, and is now going to take the parts from the Inkscape crab, I know I have to export all the pieces into separate files (that might be something they will change in time, I have to investigate), and than use the skeleton system will be so easy to use, to do the animation. It might even have some inverse kinematics 🙂

I really believe the Spriter is going to be the solution to a lot of my animation challenges. I will return with my experience with Spriter soon 🙂

Now, go make games 😉

– Henning