Animated GIF

WEEK 2

Walk Cycle

In the first week of 2D animation we were just introduced to the course, the software was not yet installed properly so we could not really start anything anway.

So in week two we were given our first tutorial to follow, it was very simple and a good way to start off the course. It was to create a simple walk cycle and then cpnvert it into a GIF file that could be displayed on a web page.

Key things learnt:

• Creating parent/child relationships
• Adjusting pivot points.

Here is the tutorial:

http://mojo.csd.anglia.ac.uk/moodle/mod/resource/view.php?id=693

NOTES:

• Frame rate is the number of frames per second that your cartoon will play at. Most online cartoons play at a rate of 12 frames per second, but they recommend a rate of 15 frames per second for increased detail and smoothness. I tend to use a frame rate of 30 fps, but not for this GIF, I used the Default of 12 fps.
• Toon Boom uses layers to keep the elements of your cartoon organized.
• Layers allow you to manipulate individual elements of the animation without disrupting everything around it.
• Use +/- buttons to add or remove frames.
• Simply drag and drop to parent layers.
• "Crtl" + "G" combines elements.
• Green circle = pivot point.
• "R" increase exposure of frame by one.
• You can hold shift and select all frames and extend them at the same time, if you right click you can click extend exposure and then choose which frame you wish to extend the frames to.

Steps:

1. First draw you simple person you want to walk.
2. Then on each layer trace over each body part using a different colour.
3. Delete the original sketch because you don't need it anymore.
4. Make the torso the parent of the limbs.
5. Once created the children layers will mimic the movement of the parent layer, in this case the arms and legs will now move however the torso moves. Notice that the appendage layers are now indented in the Timeline window to indicate that they are now children.
6. The next step is to adjust the pivot point of each of our elements so that they move where they’re supposed to. A pivot point is the specific place where an element is rotated and transformed around. For example, the pivot point for your forearm is your elbow. The pivot point for your leg is your hip. We need to change the default pivot points for our 5 layers so that the elements behave as expected.
7. Extend exposure of every layer to 11 frames.
8. Select the Transform tool from the Scene Planning tools and then choose the first frame of the torso layer in the Timeline window. Right click and select Add Keyframe. This will set the starting point of the element. You’ll see an icon appear in the frame representing that you’ve set the keyframe.
9. Add a key frame to the 12th frame this will extend the exposure of the 11th frame.
10. Select the torso layer and in the Camera window drag the element up on the 3rd and 8th frame and down on the 5th and 10th frame.
11. To improve the realism also animate the arms and bend all the limbs.
12. Use the same movement for both arms but offset the key frames for more realism.

Once finished I exported the animation into a video format (avi) and use Microsoft GIF Animator to save the animation as a GIF image.

This video doesn't loop because it's not a GIF its an animation embedded into this post.