'''Animation Tutorial'''

It can take a lot of time to move a character idea from base frame to full animation. This rough guide is a compilation of quick and easy tricks to help bring the animator's creations to life.

Learn how to take a standing base frame: http://img15.imageshack.us/img15/1500/ghast.png

To full animation: http://img808.imageshack.us/img808/2486/ghastattack7.gif

'''For this tutorial, you will need:'''

A base frame of the unit -> (http://wiki.wesnoth.org/Creating_a_scratch_built_sprite)

A graphics editing program -> http://www.gimp.org/

'''Lets get started'''

When I begin to animate a character, I first divide the subject's moving parts into easy to distinguish colors. Here, I have modified Zerovirus's base frame of the Ghast into a mess of colors based on the monster's different limbs.
http://img15.imageshack.us/img15/1500/ghast.png http://img440.imageshack.us/img440/4742/ghast1.png

This part of the animation is called "Blocking." It allows you to quickly animate and perfect the full movement of your character without having to constantly re-adjust every little detail.

'''Kinematics'''

Building on concepts from Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial, your character is comprised of a "network" of many parts which are all hooked together. So when one of part of your character moves, the entire rest of the character must move in response. The magic of animation is "capturing" how your character moves and reacts through a series of frames.

'''The Network'''

It can be quite daunting to figure out where to start animating if the position of any one part of the character is dependent with respect to all of the others parts. Therefore it is valuable to understand the linkages throughout the anatomy of your character. For example, here is the baseframe of my Goblin Trumpeter and an edited version.

http://img88.imageshack.us/img88/4724/goblintrumpeter2.png

http://img23.imageshack.us/img23/3458/goblintrumpeterjoints.png

The character's core is colored green, the joints are outlined in red, and the "bones" are highlighted in blue.

The position of each of the Goblin Trumpeter's joints is dependent upon the core of the character. By animating the core and head of the character first in your frames, it is easy to imagine where the feet and knee joints would have to be in order to support the character throughout its motion.

'''Animation Script'''

Just like any good blockbuster movie, your character should have a written script or description of what it will be doing throughout its frames. I usually write a brief description of what I want to portray throughout a character's 6-7 frame attack animation. In addition, I also doodle stick figures on scratch paper to illustrate what I want my character to portray throughout the animation.

For example, heres a script for my Goblin Trumpeter's attack animation and corresponding blocking frames.

http://img716.imageshack.us/img716/8687/goblintrumpeter.png

Base Frame: Character is at rest.

http://img51.imageshack.us/img51/4969/goblintrumpeter1.png

Frame 1: Character is charging up for the attack, Begins to raise spear and begins shifting bodyweight backwards.

http://img526.imageshack.us/img526/4724/goblintrumpeter2.png

Frame 2: Character is fully charged up for the attack. Bodyweight is fully shifted back and spear is fully raised.

http://img573.imageshack.us/img573/3017/goblintrumpeter3.png

Frame 3: Character initiates attack. Lowers spear while bringing body weight forward.

http://img585.imageshack.us/img585/6604/goblintrumpeter4.png

Frame 4: Character is in full swing. Spear impacts target.

http://img824.imageshack.us/img824/5089/goblintrumpeter5.png

Frame 5: Character follows through, Weapon reaches full extention. Ends in a "lunge" stance.

http://img24.imageshack.us/img24/5775/goblintrumpeter6.png

Frame 6: Character pauses to regain balance. Withdraws spear.

http://img823.imageshack.us/img823/3536/goblintrumpeter7.png

Frame 7: Character regains balance and steps back to rest position.

http://img696.imageshack.us/img696/3996/goblintrumpeter11.gif

By using the stick figure drawings and following the written script, I created the finished blocking animation of the Goblin Trumpeter. Through the iterative process of moving the character's core and all of the corresponding joints frame by frame, little by little, you will soon have the blocking for a full animation.

'''Fine Tuning'''

To finely tune the blocking animation, continually observe the effects that your changes have upon the entire blocking animation. It is a good idea to be on the look out for the animation issues discussed in Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial.

* Moving only the active element
* Misaligned frames
* Hidden and turned surfaces not redrawn

For feedback from the Wesnoth Community it is valuable to discuss the development of your animation via the Wesnoth Art Workshop: http://forums.wesnoth.org/viewforum.php?f=23&sid=a976661f1c0a02092e50c643980d7eb0.

'''Character Coloring'''

If you are happy with how the movement of your character is throughout your "blocking" animation, it is time to finish by coloring your character. My preferred method is to trace an outline around each of the character's moving parts and apply an appropiate base color.

For example:

http://img510.imageshack.us/img510/5412/ghastwalk11blocking.png

http://img46.imageshack.us/img46/5516/ghastse11.png

'''Credits'''

http://img510.imageshack.us/img510/3489/goblintrumpeter24.gif
Zerovirus for Ghast baseframe.

User:Stern

2010-12-13T00:21:13Z

Stern:

'''Animation Tutorial'''

It can take a lot of time to move a character idea from base frame to full animation. This rough guide is a compilation of quick and easy tricks to help bring the animator's creations to life.

Learn how to take a standing base frame: http://img15.imageshack.us/img15/1500/ghast.png

To full animation: http://img808.imageshack.us/img808/2486/ghastattack7.gif

'''For this tutorial, you will need:'''

A base frame of the unit -> (http://wiki.wesnoth.org/Creating_a_scratch_built_sprite)

A graphics editing program -> http://www.gimp.org/

'''Lets get started'''

When I begin to animate a character, I first divide the subject's moving parts into easy to distinguish colors. Here, I have modified Zerovirus's base frame of the Ghast into a mess of colors based on the monster's different limbs.
http://img15.imageshack.us/img15/1500/ghast.png http://img440.imageshack.us/img440/4742/ghast1.png

This part of the animation is called "Blocking." It allows you to quickly animate and perfect the full movement of your character without having to constantly re-adjust every little detail.

'''Kinematics'''

Building on concepts from Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial, your character is comprised of a "network" of many parts which are all hooked together. So when one of part of your character moves, the entire rest of the character must move in response. The magic of animation is "capturing" how your character moves and reacts through a series of frames.

'''The Network'''

It can be quite daunting to figure out where to start animating if the position of any one part of the character is dependent with respect to all of the others parts. Therefore it is valuable to understand the linkages throughout the anatomy of your character. For example, here is the baseframe of my Goblin Trumpeter and an edited version.

http://img88.imageshack.us/img88/4724/goblintrumpeter2.png

http://img23.imageshack.us/img23/3458/goblintrumpeterjoints.png

The character's core is colored green, the joints are outlined in red, and the "bones" are highlighted in blue.

The position of each of the Goblin Trumpeter's joints is dependent upon the core of the character. By animating the core and head of the character first in your frames, it is easy to imagine where the feet and knee joints would have to be in order to support the character throughout its motion.

'''Animation Script'''

Just like any good blockbuster movie, your character should have a written script or description of what it will be doing throughout its frames. I usually write a brief description of what I want to portray throughout a character's 6-7 frame attack animation. In addition, I also doodle stick figures on scratch paper to illustrate what I want my character to portray throughout the animation.

For example, heres a script for my Goblin Trumpeter's attack animation and corresponding blocking frames.

http://img716.imageshack.us/img716/8687/goblintrumpeter.png

Base Frame: Character is at rest.

http://img51.imageshack.us/img51/4969/goblintrumpeter1.png

Frame 1: Character is charging up for the attack, Begins to raise spear and begins shifting bodyweight backwards.

http://img526.imageshack.us/img526/4724/goblintrumpeter2.png

Frame 2: Character is fully charged up for the attack. Bodyweight is fully shifted back and spear is fully raised.

http://img573.imageshack.us/img573/3017/goblintrumpeter3.png

Frame 3: Character initiates attack. Lowers spear while bringing body weight forward.

http://img585.imageshack.us/img585/6604/goblintrumpeter4.png

Frame 4: Character is in full swing. Spear impacts target.

http://img824.imageshack.us/img824/5089/goblintrumpeter5.png

Frame 5: Character follows through, Weapon reaches full extention. Ends in a "lunge" stance.

http://img24.imageshack.us/img24/5775/goblintrumpeter6.png

Frame 6: Character pauses to regain balance. Withdraws spear.

http://img823.imageshack.us/img823/3536/goblintrumpeter7.png

Frame 7: Character regains balance and steps back to rest position.

http://img696.imageshack.us/img696/3996/goblintrumpeter11.gif

By using the stick figure drawings and following the written script, I created the finished blocking animation of the Goblin Trumpeter. Through the iterative process of moving the character's core and all of the corresponding joints frame by frame, little by little, you will soon have the blocking for a full animation.

'''Fine Tuning'''

To finely tune the blocking animation, continually observe the effects that your changes have upon the entire blocking animation. It is a good idea to be on the look out for the animation issues discussed in Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial.

* Moving only the active element
* Misaligned frames
* Hidden and turned surfaces not redrawn

For feedback from the Wesnoth Community it is valuable to discuss the development of your animation via the Wesnoth Art Workshop: http://forums.wesnoth.org/viewforum.php?f=23&sid=a976661f1c0a02092e50c643980d7eb0.

'''Character Coloring'''

If you are happy with how the movement of your character is throughout your "blocking" animation, it is time to finish coloring your character.

'''Credits'''

http://img510.imageshack.us/img510/3489/goblintrumpeter24.gif
Zerovirus for Ghast baseframe.

User:Stern

2010-12-13T00:17:40Z

Stern:

'''Animation Tutorial'''

It can take a lot of time to move a character idea from base frame to full animation. This rough guide is a compilation of quick and easy tricks to help bring the animator's creations to life.

Learn how to take a standing base frame: http://img15.imageshack.us/img15/1500/ghast.png

To full animation: http://img808.imageshack.us/img808/2486/ghastattack7.gif

'''For this tutorial, you will need:'''

A base frame of the unit -> (http://wiki.wesnoth.org/Creating_a_scratch_built_sprite)

A graphics editing program -> http://www.gimp.org/

'''Lets get started'''

When I begin to animate a character, I first divide the subject's moving parts into easy to distinguish colors. Here, I have modified Zerovirus's base frame of the Ghast into a mess of colors based on the monster's different limbs.
http://img15.imageshack.us/img15/1500/ghast.png http://img440.imageshack.us/img440/4742/ghast1.png

This part of the animation is called "Blocking." It allows you to quickly animate and perfect the full movement of your character without having to constantly re-adjust every little detail.

'''Kinematics'''

Building on concepts from Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial, your character is comprised of a "network" of many parts which are all hooked together. So when one of part of your character moves, the entire rest of the character must move in response. The magic of animation is "capturing" how your character moves and reacts through a series of frames.

'''The Network'''

It can be quite daunting to figure out where to start animating if the position of any one part of the character is dependent with respect to all of the others parts. Therefore it is valuable to understand the linkages throughout the anatomy of your character. For example, here is the baseframe of my Goblin Trumpeter and an edited version.

http://img88.imageshack.us/img88/4724/goblintrumpeter2.png

http://img23.imageshack.us/img23/3458/goblintrumpeterjoints.png

The character's core is colored green, the joints are outlined in red, and the "bones" are highlighted in blue.

The position of each of the Goblin Trumpeter's joints is dependent upon the core of the character. By animating the core and head of the character first in your frames, it is easy to imagine where the feet and knee joints would have to be in order to support the character throughout its motion.

'''Animation Script'''

Just like any good blockbuster movie, your character should have a written script or description of what it will be doing throughout its frames. I usually write a brief description of what I want to portray throughout a character's 6-7 frame attack animation. In addition, I also doodle stick figures on scratch paper to illustrate what I want my character to portray throughout the animation.

For example, heres a script for my Goblin Trumpeter's attack animation and corresponding blocking frames.

http://img716.imageshack.us/img716/8687/goblintrumpeter.png

Base Frame: Character is at rest.

http://img51.imageshack.us/img51/4969/goblintrumpeter1.png

Frame 1: Character is charging up for the attack, Begins to raise spear and begins shifting bodyweight backwards.

http://img526.imageshack.us/img526/4724/goblintrumpeter2.png

Frame 2: Character is fully charged up for the attack. Bodyweight is fully shifted back and spear is fully raised.

http://img573.imageshack.us/img573/3017/goblintrumpeter3.png

Frame 3: Character initiates attack. Lowers spear while bringing body weight forward.

http://img585.imageshack.us/img585/6604/goblintrumpeter4.png

Frame 4: Character is in full swing. Spear impacts target.

http://img824.imageshack.us/img824/5089/goblintrumpeter5.png

Frame 5: Character follows through, Weapon reaches full extention. Ends in a "lunge" stance.

http://img24.imageshack.us/img24/5775/goblintrumpeter6.png

Frame 6: Character pauses to regain balance. Withdraws spear.

http://img823.imageshack.us/img823/3536/goblintrumpeter7.png

Frame 7: Character regains balance and steps back to rest position.

http://img696.imageshack.us/img696/3996/goblintrumpeter11.gif

By using the stick figure drawings and following the written script, I created the finished blocking animation of the Goblin Trumpeter. Through the iterative process of moving the character's core and all of the corresponding joints frame by frame, little by little, you will soon have the blocking for a full animation.

'''Fine Tuning'''

To finely tune the blocking animation, continually observe the effects that your changes have upon the entire blocking animation. It is a good idea to be on the look out for the animation issues discussed in Jetryl's Basic Animation Tutorial: http://wiki.wesnoth.org/Basic_Animation_Tutorial.

* Moving only the active element
* Misaligned frames
* Hidden and turned surfaces not redrawn

For feedback from the Wesnoth Community it is valuable to discuss the development of your animation via the Wesnoth Art Workshop: http://forums.wesnoth.org/viewforum.php?f=23&sid=a976661f1c0a02092e50c643980d7eb0.

'''Credits'''

http://img510.imageshack.us/img510/3489/goblintrumpeter24.gif
Zerovirus for Ghast baseframe.