Stickman Tutorial (Experimental)

Introduction

In this tutorial, we will go through the making of a nice animated stickman.  The stickman we will make should be able to do three differentes actions. 

1. It should be able to stand still;
2. It should be able to walk;
3. It should be able to punch

This is yet another easy tutorial.  I assume you are already confortable with Sprite Kinematics Workbench  v1.0. If not, you might want to go through the Clock Tutorial first.

1. Preparations

1.1 Draft

Before we start Sprite Kinematics Workbench. It is always a good idea to prepare ourself so let's draw a little draft of our stick man.

1.2 Anchors

We want the stickman to walk an punch. This mean it must be able to move the legs and the arms. Here are the motion points that I think can be usefull.

1.3 Identifications

Let's give name so we can following this tutorial with easiness.

1.4 Drawing and Packing

Once again. I provide no informations for the drawing and the packaging of images.  They are already available in ./image/

2. Using Sprite Kinematics Workbench

2.1 Creating the first frame

Let’s create a new canvas.

    File -> new

Then let’s create an animation to work with.

    Kinematics -> add

In the Dialog, enter the name of the animation in the ID field and click the “add animation” button.

    For this tutorial we will use id = Standing

2.2 Creating the anchor tree

You should know by now how to add anchors to a frame. Here's a list of all the informations you need to create the stickman. (If you don't want to enter all this anchors, you can simply open ./save/stickman.2.2.skw)

2.3 Prepare all the animations

We want to make three differents states of animation. The first one is "Standing" the second one is "Walking" and the third one is "Punching".  An easy way to keep consistant the transition between two states, we can simply clone the "standing" animation and begin all other animation with it.

Let's create the Standing animation.  We are already in the right animation and in the right frame. All we have to do is transform the anchors.  Here is a list of transformation you must apply to all anchors.

Now that we have ours stickman in his standing position, let's create two more animation

    Kinematics -> Add

2.4 Animation: Walking

We are getting close to something interesting here.  Now our stickman is finally ready to be part of an animation.  Let's begin the walking animation Make sure you are editing the Walking animation. 

Here is a list of transformation you can enter to get the animation of a walking man.  You might wan to try your own transformation.  The basic idea is to transform the current frame, then clone it and transform the new frame, then clone it once again, and keep going until you have the full motion.

2.5 Animation: Punching

Make sure you are editing the Punching animation.  Then try to make a nice punching move. It's all up to you now ;)

2.6 The end

Now that your stickman is acting just like you want. It's time to export your work to png.

    File -> Save As png