DLM 03 Developing print-based Learner’s Guide including all related documents

Notes Format of Learner’s Guide

Course: 2D Animation NC - III

Unit of competency: Produce key drawings
Module: 1
Learning outcomes: At the end of the session, learners should be able to:
1. Identify animation requirements
2. Produce key drawings
3. Edit/revise and complete key drawings
Duration: 320 hours
Situating Learning: You are to undergo two closely-related processes training; as 2D digital
animation can be started and completed by using all-digital processes and
procedures or begin with traditional animation procedure then scan all
cleaned-up drawings on animation paper to make it digital and then finished
it the digital way - just like what many animation studios are practicing until
today.

You are to view a video clip about a hotdog company manager

transacting with Yong World Studio’s chief creative director to produce a 20-
seconder advertisement (using 2D Digital Animation) that depict all the
relevant animation requirements and some of its process.

In this course, you will be in a situation of a key drawing artist or an

animator to produce key drawings for animation.

Assessment Criteria: • All relevant animation requirements are identified

• Principles and techniques in animation production are explained
• Timing and spacing are applied
• Sound breakdown is identified and performed lip-synch
• 2D animation’s equipment & materials are identified and
prepared
• Creative concepts are interpreted and applied life drawing
• Positions of figure along a path that marks important visual
transitions/extremes of intermediate action are identified &
calculated.
• Key drawings for animation are flipped, line tested, produced and
completed
• Defective drawings as reviewed by the appropriate personnel are
fixed and completed.
• Completed key drawings are checked, and stored safely and
securely in accordance with company procedures

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 1
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
1 • All relevant 1.1 Identify all relevant • Read info sheet
Identify animation animation animation 1.1.1
requirements requirements are requirements • Answer Work Sheet
identified and 1.1.1
explained correctly.
• Contents of the
storyboard to the x-
sheet are Identified
& matched correctly
• Selected model
sheet of the mascot
are on-model in any
of its view (not off-
model in any angle)
• Each principle of
animation are
identified and 1.2 Explain the • Read information
explained correctly principles and Sheet 1.1.2
• Relevant materials techniques of (principles of
used in pre- animation animation)
production, production • Read Information
production and post- Sheet 1.1.3 (stages
production are of animation
categorized correctly production)
• Read Information
Sheet 1.1.4 (current
animation methods
and techniques)
• complete Work
Sheet 1.1.2
(animation
• Key drawings and principles &
Identify principles &
breakdowns are techniques)
techniques of animation
identified correctly &
on timings and spacing 1.3 Identify principles &
marked accordingly • Read Information
with its correct techniques of Sheet 1.1.5 (timing
symbols animation on & animation
• Timing chart is timings breakdowns)
1.4 Identify timings and
correct, key • Carry out Operation
drawings and soundtrack
Sheet 1.1.1
breakdowns are breakdown
(Mark/label
marked according to 1.5 Explain lip-synch &
drawings according
action required in mouth chart
to timing chart)
1.6 Perform lip-synch
the given scene • Read Information
with given voice
• animation Sheet 1.1.6 (timing
track
requirements from & soundtrack
the timings and breakdown)

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 2
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
soundtrack • Complete Work
breakdown are Sheet 1.1.3 (timing,
identified correctly. soundtrack
• Mouth patterns are breakdown & lip-
identified correctly synch)
according to the • Read Information
given words Sheet 1.1.7 (Lip
• Voice and sound synch & Mouth
tracks are Chart)
synchronized • Read information
correctly Sheet 1.1.8 (2D
traditional materials
Familiarize all 1.7 Identify all & equipment and
necessary materials necessary 2D digital material
materials and & equipment)
equipment to be • Perform Job Sheet
used and prepared 1.1. 1(Perform
according to the lip-synch with given
task to be voice track)
undertaken

2: • At least five 2.1 Visualize and • Read Information

Produce key drawings meanings of the interpret creative Sheet 2.1.1
shown image are concepts (creative designs
interpreted /design 2.2 Draw own design and interpretation)
(as to color and interpret • Read Information
symbolism or idea) 2.3 Analyze design Sheet 2.1.2
• At least three inconsistencies (animated styles:
meanings/interpretat 2.4 Draw model drawings, digital
ions of drawn object according to imaging, broad
are explained description range of graphic
• At least five styles and
inconsistencies of techniques)
the shown design • Interpret Work
are identified in Sheet 2.1.1
terms of props, (interpreting shown
materials and styles design)
• Key drawings are • Perform Job Sheet
produced with 2.1.1 (drawing a
relevant details from design to be
material and styles interpreted)
basing on the given • Analyze Work
model & descriptions Sheet 2.1.2
with 95% minimum 2.5 Apply life drawing, (analyzing
accuracy dynamic poses, inconsistencies of
• Ball, triangle (or facial expression shown design)
cone) or a and translation to • Perform Job Sheet

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 3
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
combination a ball animated characters 2.1.3 (drawing
and a cone are used 2.6 Draw the mascot model according to
in the initial stage of model in dynamic descriptions on
drawing the pose using line of materials & design)
character (the action, stick • Read Information
mascot). drawing, basic Sheet 2.1.3 (Apply
• Drawn mascot is on- shapes and cylinder life drawing
model at its initial sketches principles)
• The mascot in 2.7 Copy (by drawing) a • Perform job sheet
dynamic pose is live model 2.1.4 (Draw the
initially drawn with mascot model in
line of action, stick dynamic pose)
drawing, basic • Perform job sheet
shapes to cylinder 2.1.5 (copying live
and in proportion model by drawing)
• Performed live
drawing is done in at
least 85% accuracy.
• All the necessary 2.8 Draw a walk cycle • Read Information
materials and 2.9 Identify & prepare Sheet 2.1.4 (walk
all necessary cycle)
equipment in
materials and • Complete Work
drawing the mascot equipment in
in walk cycle are Sheet 2.1.3
drawing the
identified and (equipment and
mascot in walk
materials in drawing
prepared cycle (by group)
2.10 Draw a mascot in walk cycle)
walk cycle • Perform Job Sheet
(individual) 2.1.6 (walk cycle-
individual)
• Predetermined 2.11 Read the sample • Read Information
errors in x-sheet are x-sheet to identify Sheet 2.1.5 (sound
found the instruction on reading in x-sheet)
drawings and •
• Appropriate soundtrack to
Complete Work
drawings that Sheet 2.1.4 (practice
comply
complied with the sound reading in x-
2.12 Practice sound
sheet)
soundtrack reading to check
x-sheet • Perform Job Sheet
breakdown are
consistency 2.1.7 (produce key
produced
2.13 Produce drawings drawings with
complied with soundtrack w x-sheet)
soundtrack
breakdown
• The number of 2.14 Identify mouth • Carry-out Operation
drawings of the patterns of the Sheet 2.1.1 (How to
character talking is words uttered by use Toon Boom Auto
the mascot Lip-Synch)
completely drawn.
through mouth • Complete Work
chart or use toon
• Lip-synch of the Sheet 2.1.5 (identify
boom software to
mascot’s mouth chart
identify it.

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 4
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
character’s dialogue 2.15 Draw key in toon boom 2D
is synchronized drawings of the digital animation)
correctly with the mascot uttering • Perform Job Sheet
the dialogue with 2.1.8 (Draw key
voice track
correct mouth drawings-mouth chart
breakdown in correct patterns according according to voice
mouth patterns of to the voice track track and synchronize
the mouth chart given background sound 2D
2.16 Check if given digital animation)
• Background sound background
breakdown is soundtrack is
appropriate with
synchronized
the timeline
appropriately in the 2.17 Trainer to
timeline. summarize the key
learning points.

• Point of breakdowns 2.18 In group, point out • Answer Work Sheet

of the given action breakdown of 2.1.6 (Identify &
that been affected action of the given calculate how many
animation scene breakdown/s and key
by the position of drawings in the given
affected by path
figure along a path that marks scenes of action)
that marks important important visual
visual transition is transition.
Identified 2.19 Calculate how
• Breakdown/s and many breakdowns
or keyframes the
keyframes/drawings
action needs.
needed by the action 2.20 Identify
are calculated movements that
• Movement that need need straight-
straight-ahead ahead action.
action is identified
• All slugging or 2.21 Check and • Read Information
director’s notes implement Sheet 2.1.6 (Check
slugging notes in and implement
found in the x-sheet
the x-sheet slugging notes in x-
are implemented
sheet)
correctly
• Perform Job Sheet
2.1.9 (Check and
implement slugging
notes in x-sheet)
• At least three 2.22 Label & mark each • Perform Job Sheet
significant reasons animation paper 2.1.10 (Label & mark
why labeling & per scene drawings / arrange
accurately shuffled flash frame
marking each
(traditional by frame .fla files
animation accurately animation) / Type accurately)
per scene (in appropriate
traditional animation) filename of scene
/ Shuffled flash vis-à-vis to all
frame by frame .fla scenes in the

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 5
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
file is accurately production (2D
arranged according digital animation)
to the animation clip
shown.
• Given video clips are
typed with correct
filenames according
to sequence
• Types of animation 2.23 Identify popular • Complete Work
production are animation Sheet 2.1.7 (identify
classified correctly production types in & categorize
terms of
• Reason why more movement/action
production types and
cost)
fluid animation fluidity like Walt
production means Disney standard
big budget is and Anime
explained correctly standard.
• demo reels are 2.24 Reason out why
types of
categorize according
production vary in
to type the cost of
production
2.25 From among the
shown animation
demo reels, the
learners will
categorize its
types

• Importance of doing 2.26 Distribute • Perform Job Sheet

flipping before worksheet 2.1.11 (check
subjecting drawings 2.27 Learners will drawing deficiencies
enumerate what by performing
to line testing is
are steps in flipping)
explained correctly flipping • Perform Job Sheet
• Steps in flipping 2.28 Check drawing
2.1.12 (fix deficient
drawings on deficiency of the
2.29 Fix deficient drawings based on
animation paper are
drawings flipping analysis)
executed correctly
• Deficiencies of the
given drawings are
Identified correctly
through flipping
• Deficient drawings
are fixed
• Advantages of line 2.30 Prepare and • Perform Job Sheet
tester in checking undertake line test 2.1.13 (prepare line
the smoothness of to ensure smooth tester and check
flow of movement timing & drawing
animation /
of the given set of deficiencies through
movement over drawings in line testing)
flipping are identified

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 6
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
correctly animation paper. • Perform Job Sheet
• Line tester is 2.31 Identify what 2.1.14 (Finalize
prepared and actual caused why the drawings and timing
given drawings by rechecking it
line testing is
unable to result a through line test)
performed to ensure smooth flow of
smooth flow of movement.
movement
• Lacking drawings or
frames of the given
set of drawings that
foiled smooth flow of
movement are
Identified through
line tester / preview
in 2D digital
animation
3 • Checker, animation 3.1 Identify who are the • Read Information
director, technical relevant personnel Sheet 3.1.1
director and to review animated (animation personnel
elements and structure)
production manager
images (by group)
are identified as the
relevant personnel
that have the rights
to review animated
elements and
images

• At least three 3.2 Distribute work • Perform Job Sheet

deficiencies of sheet 3.1.1 (role playing;
images or key 3.3 Act as director that director & key
will review and find drawing artist /
drawings are
deficiencies on key animator to scrutinize
Identified and fixed / drawings and drawings and
redrawn or add more animated elements animation)
drawings to the the other will revise
given set of key of and fix the
drawings to achieve deficiencies then
smooth movement reverse their roles.
and consistency of
the animated
elements

• All fixed / final key 3.4 Check the accuracy • Perform Job Sheet
drawings with of sequence of the 3.1.2 (Check &
breakdown/s are completed corrected secure completed
drawings drawings)
labeled again
3.5 Label and check
accordingly to the markings of each
scene, sequence drawing

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 7
DLM 03 Developing print-based Learner’s Guide including all related documents
Notes Format of Learner’s Guide

Learning chunk Performance Criteria Learning Activities Learning documents

(Brief description of (Documents
strategies, sequence referenced by each
of lesson, evaluation) learning activity)
number & artist 3.6 Place the checked,
name and other labeled and
necessary completed drawings
inside an animator’s
documentations
folder labeled with
according to the correct number
animation production of scene sequence,
and place in an production name,
animator’s folder and name of the
• Animator’s folder is animator.
labeled correctly

• The fact that simple 3.7 Distribute job • Read Information

error in the sheet Sheet 3.1.2
sequencing of 3.8 Let learners (arranging & stacking
simulate the read completed drawing
drawings could
procedures of the according to
cause a domino company company’s
effect that entailed 3.9 Trainer to procedure)
cost and delay in the summarize the key
• Perform Job Sheet
animation production learning points.
3.1.3 (arrange &
is explained
stack completed
correctly drawing according to
• Apple pie company’s
arrangement / procedure)
sequencing and
cataloguing of
drawings will give
swift and accurate
way in finding
particular drawing
when circumstance
dictates is explained
• Simulation of
accurate
arrangement and
storing of completed
drawings according
to the sample
company procedure
is implemented
correctly.

Pedagogical Training in Instructional Design & Delivery for TVET

© 2010, Institute of Technical Education, Singapore Page 8
Information Sheet 1.1.1 : Identifying animation requirements
 
Learning outcomes:
1. Identify animation requirements
Learning Activity:
1.1 Identify animation requirements

Though animation techniques of today have evolved tremendously compared to its inception in
the early 19th century nevertheless, the processes and principles of starting an animation
production remain the same.

Animation always starts from acquiring animation requirements; e.g. begins from a script
derived from a concept, and then script will be transposed to a storyboard. The storyboard will
be the springboard in creating the lay-out drawings and model sheet which will be distributed
to all the departments of the animation studio. All of the detailed instructions coming from the
director and other relevant personnel in animating the characters and backgrounds are
integrated in the exposure sheet (x-sheet). It is to be noted that all the processes undertaken
will be subjected to the review and approval or the relevant personnel of the animation studio.

Glossary

Animation – a simulation of movement created by displaying a series of pictures, or frames.

Cartoons on television are one example of animation. Animation on computers is one of the
chief ingredients of multimedia presentations. There are many software applications that
enable you to create animations that you can display on a computer monitor. (2D Animation NC III
TESDA Training Regulations, July 27, 2007)

2D Animation – the creation of moving pictures in a two-dimensional environment, such as

through "traditional" cel animation or in computerized animation software. This is done by
sequencing consecutive images, or "frames", that simulate motion by each image showing the
next in a gradual progression of steps. (2D Animation NC III TESDA Training Regulations, July 27, 2007)
Concept - Our creative mental faculty is called imagination. It is the ability to dream up ideas
of one's own and ability to create in your own mind an interpretation of other people's ideas.
(en.wikipedia.org/wiki/Animation)

Script – the printed version of a stage play, movie screenplay, or radio o television broadcast,
including the words to be spoken and often also technical directions. (MS Encarta Dictionaries 2009)
Storyboard- a set of sketches arranged in sequence on panels, outlining the scenes that will
make up something to be filmed, e.g. a motion picture, television show, or advertisement. (MS
Encarta Dictionaries 2009)

Lay-out drawing- The primary reference for background/s and character/s which the lay-out
artist is responsible.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.1 : Identifying animation requirements
 
Model Sheet – A set of front, side views, ¾ views, rear view drawings of a character that being
distributed to all the departments of the animation studio after the approval of the relevant
personnel that serves as reference in drawing any pose of that certain character.
Exposure Sheet (x-sheet) – Integrating document that contains the director’s instructions /
notes, layers, number of frames, sound track, mouth patterns for dialogue necessary to all
personnel in the animation production in executing their respective responsibilities.
2D Animation materials and equipment – (please see page 5. Details on how to use them
will be discussed later – in video tutorials)

Sample pictures of animation requirements:

Figure 1.1.1 

Sample of script format

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.1 : Identifying animation requirements
 

Figure 1.1.2 
A part of a storyboard

Figure 1.1.3 
Sample of a model sheet (part of the lay‐out drawings) 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.1 : Identifying animation requirements
 

Figure 1.1.4 

Sample background lay‐out (part of the lay‐out drawings) 

Figure 1.1.5 
Sample of exposure sheet (x‐sheet) 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.1 : Identifying animation requirements
 

Figure 1.1.6 
Pictures of 2D traditional animation materials and equipment 

Pen
Pen Tablet Display

Toon Boom 2D Animation Software

Figure 1.1.7 
Flash 2D Animation Software

Pictures of 2D digital animation materials and equipment 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.1: Identifying animation requirements
 
Learning outcomes:
1. Identify animation requirements
Learning Activity:
1.1 Identify the meaning of each animation requirements by matching column A with column B
based on the watched video
1.2 Identify each picture of animation requirements with its correct term / name

Activity 1.1: Read column A carefully (description) and match it with column B (animation
requirement’s nomenclature). Write the letter only.

Column A Column B
a. It came from a script. It visually tells the story
of an animation panel by panel, kind of like a
1. Exposure sheet or x-sheet____
comic book and it is being pitched.
b. Drawing of background/s and poses
c. A set of front, side views, ¾ views, rear view
2. Script________
drawings of a character that being distributed
to all the departments of the animation studio 3. Lay-out drawing__________
after the approval of the relevant personnel
that serves as reference in drawing any pose
of that certain character. 4. Model Sheet_________
d. 2D digital animation equipment
e. Director’s instruction/notes, layers, number of 5. Storyboard__________
frames, sound track, mouth patterns for
dialogue are found in this sheet
f. The whole story and all the descriptions / 6. Pen tablet/display _________
details are written in this animation
requirement including the words to be spoken
7. Field size_________
and often also technical directions.
g. The measurement of screen that serves as
the boundary of all drawings.
h. It is the ability to dream up ideas of one's own  
and ability to create in your own mind an
interpretation of other people's ideas.
i. A simulation of movement created by
displaying a series of pictures, or frames.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.1: Identifying animation requirements
 
Activity 1.2: Identify each animation picture /image with its correct term. Write its name in box
provided for.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.1: Identifying animation requirements
 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.1: Identifying animation requirements
 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 
Learning outcomes:
1 Explain the principles and techniques of animation and animation production
Learning Activity:
1.1 Explain the principles and techniques of animation and animation production

Even though the hard work and cumbersome techniques of animation of yesterday have been
revolutionized by digital media of today, “the pioneering work in ‘traditional’ film animation done
by Walt Disney and Disney Studios on how to animate characters in a lifelike way still holds
good today”. (Walt Disney’s The Illusion of Life as reviewed by Natalya Kulishenk & Tito A. Belgrave)

Today’s animators still practice the following principles of animation introduced by Walt Disney
Studios decades ago.

• Squash and stretch – classic example is a bouncing ball that squashes when it hits the
ground and stretches just before and after. The stretching, while not realistic, makes the
ball appear to be moving faster right before and after it hits the ground.

Figure 1.1 (From: The Illusion of Life Disney Animation by Frank Thomas and Ollie Johnston, 1981)

Squash and stretch is useful in animating dialogue and doing facial expressions. It is used in
all forms of character animation from a bouncing ball to the body weight of a person walking.
This is the most important element nature-like animation requires

Figure 1.2

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 

• Anticipation – Is the preparation for the action, because each action consists of
preparation to the action, action itself and the termination of the action. A motion is
preceded by a motion in the opposite direction, as it is shown on the figure 1.3, before
hitting a ball you have to lift your arm in opposite direction.

Figure 1.3 Anticipating

for hitting a ball.

• Staging – refers the set - or setting of the scene, and the way in which it is portrayed.
Staging deals with 3 aspects: readability, personality and mood. Readability is a clear
representation of the idea in completely clear and unmistakable way. To create
personality animator should use characteristics that clearly define the character. And to
tell about the mood set of consistence characteristics should be used. They are similar
to personality set, but they are temporal.

Figure 1.4. Clear staging keeps Minnie feminine even in broad reactions. There is no attempt at realism, but
considerable caricature of the attitude. (From: The Illusion of Life Disney Animation by Frank
Thomas and Ollie Johnston, 1981)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 
• Straight Ahead Action and Pose to Pose – Straight ahead animation starts at the first
drawing and works drawing to drawing to the end of a scene. Pose to pose refers to the
key frame technique of animation, in which certain key frames, or poses, are drawn first,
and then in-between frames are added that “move” all the elements from one pose to
the next.

Figure 1.4. Straight ahead animation

• Follow Through and Overlapping action– When the main body of the character stops
all other parts continue to catch up to the main mass of the character. The secondary
part could be arms, long hair, clothing, coat tails or a dress. Nothing stops all at once.
This is main rule of follow through principle.

Figure 1.5. In walking, the hip leads, followed by the leg and then the foot. As the lead part stops, the lagging
parts continue in motion.

• Slow In and Slow Out (aka Ease in, Ease Out, or Acceleration, Deceleration) – deals
with the spacing of the in-between drawings between the extreme poses. As action
starts, we have more drawings near the starting pose, one or two in the middle, and
more drawings near the next pose. Fewer drawings make the action faster and more

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 
drawings make the action slower. Slow-ins and slow-outs soften the action, making it
more life-like.

• Arcs - Most things don’t move in straight lines. If you throw a ball, it doesn’t fly
horizontally for a bit, and then drop vertically down. Gravity acts on it all the time, pulling
it in a downward arc. For body parts, if you swing your arm round, your hand doesn’t
describe a square shape - it follows a circle, an arc, centered on your shoulder.

Figure 1.6.
The action of a hand gesture with a
pointing finger follows a circular path. The
animator charts the position of his
drawing along this arc. (From: The
Illusion of Life Disney Animation by Frank
Thomas and Ollie Johnston, 1981)

• Secondary Action - This action adds to and enriches the main action and adds more
dimension to the character animation. Secondary actions are important in heightening
interest and adding a realistic complexity to the animation. Examples are: the twitch of
an ear, a foot tapping, hands rubbing together nervously. A sad figure wipes a tear as
he turns away.

Figure 1.7 (From: The Illusion of Life Disney Animation by Frank Thomas and Ollie Johnston, 1981)

• Timing - In its simplest form, timing refers to the choice of when an action is started and
how long it takes to perform. Timing is important because it gives the meaning to the
movement. Timing defines what the idea behind the action is. It reflects the weight and
Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 
size of an object. For example, a giant has much more weight than normal person, so
its movement will be slower. It is possible also to express the emotion of the movement
varying the number of in-between frames. More drawings between poses slow and
smooth the action

Figure 1.7

• Exaggeration - Exaggeration amplifies the expression in characters. The entire pose

should express a thought and the facial expression should support, not contradict, the
body. Exaggeration explores the essence of the action or idea, understanding the
reason for it, so that the audience will also understand it. “If a character is sad, make
him sadder; if he is bright, make him shine; worried, make him fret. If he is angry make
him furious.

Figure 1.8 from angry to furious

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.2: Explain the principles and techniques of animation and
animation production
 
• Solid Drawing - The basic principles of drawing form weight, volume solidity and the
illusion of three dimensions apply to animation as it does to academic drawing (always
think of depth, weight & balance). Pencil academic drawings are transformed into color
and movement giving the characters the illusion of three-and four-dimensional life.

Figure 1.9 “We needed a shape that was a living form, ready to move – in contrast with the static form. We used
term “plastic,” and just the definition of the word seemed to convey the feeling of potential activity in the drawing;
“Capacity of being shaped or formed, pliable.” – quoted from The Illusion of Life Disney Animation by Frank
Thomas and Ollie Johnston, 1981

• Appeal and Character Personality - Appealing animation does not mean just being
cute. Appeal, includes an easy to read design, clear drawing, and personality
development that will capture and involve the audience’s interest.

Figure 1.10 - a villainess, even though

chilling and dramatic, should have appeal;
otherwise, you will not want to watch what
she is doing. (The Illusion of Life Disney
Animation by Frank Thomas and Ollie
Johnston, 1981)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 6
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 1.1.1: Perform lip-synch with given voice track
 
Learning outcomes:
1. Perform lip-synch with given voice track
Learning Activity:
1.1 Identify all the necessary equipment & materials to the task to be undertaken
1.2 Perform lip-synch with given voice track

Equipment / Resources
• Computer set with pen tab, installed with Toon Boom, Flash, video and audio editors.
• Voice track
• Mouth chart
• Traditional animation X-sheet (optional)

You are given two (4) hours to perform the activity.

At the end of this activity you should be able to produce a demo reel of a talking character
(minimum is basic shapes / sketches only) which synchronizes with the given voice track.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.2: Explain the principles and techniques of animation production
 
Learning outcomes:
1. Explain the principles and techniques of animation production
Learning Activity:
1.1 Identify the principles and techniques of animation
1.2 Categorize animation production stages
1.3 Explain the principles and techniques of animation production

Activity 1.1: Identify the principles and techniques of animation.

Direction: Fill in the blanks with the correct principle / technique of animation.
1. The principle of animation used in all forms of character animation from a bouncing ball

to the body weight of a person walking ___________________.

2. It is the principle of animation that starts at the first drawing and works drawing to

drawing to the end of a scene__________________.

3. The principle of animation that states most things don’t move in straight lines. If you

throw a ball, it doesn’t fly horizontally for a bit, and then drop vertically down

______________________.

4. This principle of animation refers to the choice of when an action is started and how

long it takes to perform. It is important because it gives the meaning to the movement

and defines what the idea behind the action is______________________.

5. The principle of animation that says, when the main body of the character stops all other

parts continue to catch up to the main mass of the character___________________.

6. The basic principles of drawing form weight, volume solidity and the illusion of three

dimensions apply to animation_______________________.

7. We remember this principle of animation when it refers to the set - or setting of the

scene, and the way in which it is portrayed_____________________.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.2: Explain the principles and techniques of animation production
 
8. A technique of animation used when live action actors wear special suits that allow

computers to copy their movements into CG characters______________________.

9. It is a simplified Disney animation-technique to reduce costs and to limit the number of

frames in productions originated by manga artist and animator Osamu Tezuka - a

temporary measure to produce material on a tight schedule with inexperienced

animation-staff_______________________.

10. A type of animation that is digitally modeled and manipulated by an animator. After the

model is done, you can readily rotate the model 360 degrees.

Activity 1.2: Categorize animation production stages: (5 pts)

Direction: Fill-in the boxes with correct steps according to stages of animation production.
Please refer box A for your answers.

PRE PRODUCTION  PRE PRODUCTION

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.2: Explain the principles and techniques of animation production
 
POST PRODUCTION  BOX A 
 
review of the movement smoothness by
relevant personnel, rendering, flipping and
line testing, concept, storyboard, model
sheets, recording voice tracks,
compositing, defining the type of animation
production, exposure sheet, sound reading
on x-sheet, key drawings, labeling and
marking, in-between drawing, lay-out
drawings, breaking down of the voice /
sound tracks, animatics, fixing / redrawing
clean-up drawing, script 

Activity 1.3: Explain the principles and techniques of animation (3 pts each)
Direction: In your own words explain the following principles of animation. (You can use
separate paper if your answers go beyond the space provided.)
1. Anticipation
2. Secondary action

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.3: Identify stages of animation production 
Learning outcomes:
1 Identify stages of animation production
Learning Activity:
1.1 Identify stages of animation production

Animation production has three (3) stages procedure namely:

1. Pre-production stage
2. Production stage
3. Post-production stage.

The sample below is an ideal flow of animation production in bigger studios. In contrast, the
procedures of outsourcing animation business in the Philippines may vary as they serve only
as one remote department of a bigger animation studio abroad. In view of this, they become
more dependent in terms of the script, model sheet, lay-out, sound tracks and other
descriptions / instructions. Mostly, the animatics, the animation and compositing are what they
are concentrating at the approval of the main studio or client. But the bottom-line is, either
remote or in-house, the animation procedure flow and processes are closely resemble.

The Pre-Production stage:

1. Starts from the concept.

2. Writing of the script at the approval of the director.
3. Production Designer inputs his creative idea for the whole production.
4. Creation of Storyboard and the Animatics by the storyboard artist.
5. Pitching the storyboard / Animatics to the relevant members of the studio.
6. Drawing of the Model Sheets at the approval of the director.
7. Drawing of the lay-out drawings (background and poses) by the lay-out artist at the
approval of the director.
8. Recording voice tracks by voice talents (voice actors / actresses)
9. Breaking down of the voice / sound tracks.
10. Defining the type of animation production the project will have.
11. Production manager arranges and set-up all the needs of the production.
12. Organization of the Exposure Sheet by the director & other relevant personnel and the
identification of the field size of the drawings, likewise, the output format of production
(for TV, film, games, web, or cell phone and other mobile multimedia players).

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.3: Identify stages of animation production 

The Production stage:

1. Distribution of lay-out drawings in animator’s folder by scene (Storyboard, model sheets,

background drawings and poses, field size, camera instruction, and the exposure sheet)
to all departments.
2. Reckoning timings and soundtrack breakdown by the key animators from the x-sheet.
3. Sound reading on x-sheet.
4. Identification of points of breakdowns of the given action that been affected by the
position of figure along a path that marks important visual transition.
5. Sketching of the key drawings or key frames by the key animator or key framers in
reference with voice breakdowns if exist in the timeline (model sheet/s, lay-out, and x-
sheet are always referred for consistency).
6. Checking the smoothness of movements / action including mouth patterns by flipping
and line testing by the key animators / key framers (preview in direct 2D digital
animation).
7. Labeling and marking of the drawings (accurate file naming of scene in direct 2D digital
animation).
8. Review of the movement smoothness of key drawing sketches by the animation
checker and other relevant personnel like the animation director, technical director and
production manager (depending to company’s standards).
9. Fixing / redrawing of deficient key drawings or adding more key drawing if needed to
ensure the smoothness of movements / fluidity of animation.
10. Checking the accuracy of labeling and markings of the final key drawings
11. Stacking and storing securely of final key drawing according the company’s standards.
12. Forwarding the final key drawings to the in-between artist.
13. Drawing of the in-betweens of the key drawings to complete and ensure the
smoothness of animation in reference with the exposure sheet, storyboard, background
and model sheet/s.
14. Checking the smoothness of movements / action including mouth patterns by flipping
and line testing by the in-between artist (preview in direct 2D digital animation).
15. Review of the movement smoothness of in-betweens in relation with the key drawings
by the animation checker and other relevant personnel like the animation director,
technical director and production manager (depending to company’s standards).
16. Fixing / redrawing of deficient in-between drawings or adding more in-between drawings
if needed to ensure the smoothness of movements / fluidity of animation.
17. Checking the accuracy of labeling and markings of the final in-between drawings

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.3: Identify stages of animation production 
18. Stacking and storing securely of final in-between drawings according the company’s
standards.
19. Forwarding the final in-between drawings to the clean-up artist.
20. Tracing and doing clean-up steps to finalize all the key and in-between (IB) drawings.
(Integrity of line, model sheet consistency, and mouthing are critical in this stage).
21. Checking the smoothness of movements / action including mouth patterns by flipping
and line testing by the in-between artist (preview in direct 2D digital animation).
22. Labeling and marking of the drawings (accurate file naming of scene in direct 2D digital
animation).
23. Review of the movement smoothness and accuracy / consistency of all key and IB
cleaned-up drawings with the model/s and integrity of lines by the key animator,
animation checker and other relevant personnel like the animation director, technical
director and production manager (depending to company’s standards).
24. Fixing / redrawing of deficient cleaned-up drawings.
25. Stacking and storing securely of cleaned-up drawings according the company’s
standards.
26. In traditional animation, all cleaned-up drawings will be scanned to convert it to digital.
27. Inking and painting of the digitized drawings.
28. All digitized drawing will be forwarded to the compositing artist and will be organized by
scene accordingly.

The Post-Production stage:

1. Compositing artist will collect and check all the scene folders and all the voice and
sound breakdowns.
2. By using a video editing software / compositing software, the compositing artist will
compose all the characters and backgrounds as described by the scene in the
storyboard and guidance of the x-sheet.
3. Compositing artist will then synchronize all sound/video tracks with its corresponding
digitized animated elements scene by scene with the guidance of storyboard and
exposure sheet.
4. The director will check the compositing outputs scene by scene. If there’s something
wrong the compositing artist fixes it. If he cannot do it, he will ask the assistance of the
technical director.
5. After scenes are being approved by the director and all relevant personnel, the
compositing artist will insert background sound, effects (sound and visual effects) and
appropriate transition of the scenes.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.3: Identify stages of animation production 
6. Finally, the compositing artist will integrate everything by rendering it to a format agreed
upon.
7. Approval of the director / client.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.3: Identify timing, soundtrack breakdown, & lip-synch
 
Learning outcomes:
1. Identify timing, soundtrack breakdown, & lip-synch
Learning Activity:
1.1 Identify timing, soundtrack breakdown, & lip-synch

Activity 1.1: Identify timing, soundtrack breakdown, & lip-synch.

a) Direction: Label the boxes with correct nomenclature of the timing chart

What does this timing chart means in 
animation principle? (Write your answer 
inside this box) 

b) Direction: Encircle the correct answer.

1. A drawing that defines the beginning or the end of an action.
A) in-between drawing
B) key drawing
C) clean-up drawing
D) rough drawing

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 1.1.3: Identify timing, soundtrack breakdown, & lip-synch
 

2. A drawing that is created in the midst of two other drawings.

A) in-between drawing
B) key drawing
C) clean-up drawing
D) rough drawing

3. An animated sequences that will break the "keys" and "inbetween" two element rules.
A) Animation breakdown
B) straight ahead animation
C) ease in – ease out animation
D) Action breakdown

4. Soundtrack breakdown is done at what stage of animation production?

A) pre-production
B) production
C) post-production
D) extra-production

5. The art of providing voices for animated characters

A) voice culture
B) voice-character
C) voice acting
D) voice-over

6. A1 to A7 means what rate of motion compared to A7 to A10?

A) faster than
B) slower than
C) has same rate
D) cannot be compared because of the breakdown

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.4: Identify current animation methods and techniques 
Learning outcomes:
1 Identify current animation methods and techniques
Learning Activity:
1.1 Identify current animation methods and techniques

The 20th century animation methods and techniques are ruled by the use of computer.
Although traditional animation was not eradicated, yet it is being blended with computer
applications. Computer animation encompasses a variety of techniques, the unifying factor
being that the animation is created digitally on a computer

Jeffrey Katzenberg believes that Disney would approve of the changes in the way cartoons
are made today. He has coined a term for the blending of computer animation with classical
cell animation techniques — "tradigital." And he says that the style, which burst on the scene
with such films as Toy Story, Antz, Shrek and Ice Age, is here to stay.—Roger Moore, "The
'Spirit' of Jeffrey Katzenberg," The Orlando Sentinel, May 24, 2002. Tradigital art most
commonly refers to art (including animation) that combines both traditional and computer-
based techniques to implicate an image. It is related to digital art, traditional art, information
art, new media art, video art, interactive art, and internet art. (en.wikipedia.org/wiki/Animation)
1. 2D animation - 2D animation figures are created and/or edited on the computer using
2D bitmap graphics or created and edited using 2D vector graphics. This includes
automated computerized versions of traditional animation techniques such as of
tweening, morphing, onion skinning and interpolated rotoscoping. (Flash animation and
Toon Boom are the most common 2D digital animation software used today.)

Flash Animation (www.larkinheather.com) Toon Boom Animation (www.computerarts.co.uk)

2. 3D animation - are digitally modeled and manipulated by an animator. In order to

manipulate a mesh, it is given a digital skeletal structure that can be used to control the
mesh. This process is called rigging. Various other techniques can be applied, such as
mathematical functions (ex. gravity, particle simulations), simulated fur or hair, effects
such as fire and water and the use of Motion capture to name but a few, these

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.4: Identify current animation methods and techniques 
techniques fall under the category of 3d dynamics. Many 3D animations are very
believable and are commonly used as Visual effects for recent movies.

A Maya 3D software environment

3D animation created in Blender free software (edwardsnyder.com) (www.utdallas.edu).

3. Motion capture - is used when live action actors wear special suits that allow
computers to copy their movements into CG characters (3D Computer-Generated
characters). Examples include Polar Express (2004, USA), Beowulf, 2007), Avatar
(2009, USA).

4. Computer-generated imagery (CGI) - is the application of the field of computer

graphics (or more specifically, 3D computer graphics) to special effects. CGI is used in
films, television programs and commercials, and in printed media. Video games most
often use real-time computer graphics (rarely referred to as CGI), but may also include
pre-rendered "cut scenes" and intro movies
that would be typical CGI applications.
These are referred to as FMV. Since the
1990s, computer generated imagery (CGI)
has come to the forefront of special effects
technologies. CGI gives film-makers greater
control, and allows many effects to be
accomplished more safely and convincingly
– and even, as technology marches on, at
lower costs. As a result, many optical and

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.4: Identify current animation methods and techniques 
mechanical effects techniques have been superseded by CGI.
(http://en.wikipedia.org/wiki/Special_effects_animation)
5. Anime – a simplified Disney animation-techniques to reduce costs and to limit the
number of frames in productions originated by manga artist and animator Osamu
Tezuka - a temporary measure to produce material on a tight schedule with
inexperienced animation-staff. (en.wikipedia.org/wiki/Anime)

6. Avar (animation variable) - or hinge is a variable controlling the position of part of an

animated object, such as a character. The character "Woody" in Pixar's movie Toy Story
uses 712 avars (with 212 in the face alone). Successive sets of avars control all
movement of the character from frame to frame. In development, they are used to
define the junctions of a stick model. Later, they are incorporated into a full wire frame
model or a model built of polygons. Finally, surfaces are added, requiring a lengthy
process of rendering to produce the final scene.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.4: Identify current animation methods and techniques 
Other animation techniques:
• Paint-on-glass animation is a technique for making animated films by manipulating
slow-drying oil paints on sheets of glass. Gouache mixed with glycerine is sometimes
used instead. The most well-known practitioner of the technique is Russian animator
Aleksandr Petrov; he has used it in seven films, all of which have won numerous
awards.

Aleksandr Petrov's 1999 The Old Man and the Sea (Academy Award for Animated Short Film) 

• PowerPoint animation - is a form of animation which uses Microsoft PowerPoint and

similar programs to create a game or movie.

Old animation techniques:

• Stop-motion animation - used to describe animation created by physically
manipulating real-world objects and photographing them one frame of film at a time to
create the illusion of movement. There are many different types of stop-motion
animation, usually named after the type of media used to create the animation.
• Clay animation - often abbreviated as claymation, uses figures made of clay or a
similar malleable material to create stop-motion animation.
• Graphic animation - uses non-drawn flat visual graphic material (photographs,
newspaper clippings, magazines, etc.) which are sometimes manipulated frame-by-
frame to create movement. At other times, the graphics remain stationary, while the
stop-motion camera is moved to create on-screen action.
• Model animation - refers to stop-motion animation created to interact with and exist as
a part of a live-action world. Intercutting, matte effects, and split screens are often
employed to blend stop-motion characters or objects with live actors and settings.
Examples include the work of Ray Harryhausen, as seen in films such Jason and the
Argonauts (1961), and the work of Willis O'Brien on films such as King Kong (1933
film).
• Go motion - is a variant of model animation which uses various techniques to create
motion blur between frames of film, which is not present in traditional stop-motion. The
technique was invented by Industrial Light and Magic and Phil Tippett to create special
effects scenes for the film The Empire Strikes Back (1980).
• Object animation - refers to the use of regular inanimate objects in stop-motion
animation, as opposed to specially created items.
Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
1.1 Information Sheet 1.1.4: Identify current animation methods and techniques 
• Pixilation - involves the use of live humans as stop motion characters. This allows for a
number of surreal effects, including disappearances and reappearances, allowing
people to appear to slide across the ground, and other such effects.
• Puppet animation - typically involves stop-motion puppet figures interacting with each
other in a constructed environment, in contrast to the real-world interaction in model
animation. The puppets generally have an armature inside of them to keep them still
and steady as well as constraining them to move at particular joints.
• Traditional animation, also referred to as classical animation, cel animation, or
hand-drawn animation, is the oldest and historically the most popular form of
animation. In a traditionally-animated cartoon, each frame is drawn by hand. The term
"traditional animation" is often used in contrast with the now more commonly used
computer animation.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.5: Identify principles and techniques of animation on timings  
Learning outcomes:
1.1 Identify principles & techniques of animation on timings
Learning Activity:
1.1 Identify key, in-betweens, and breakdowns
1.2 Explain timing techniques

Activity 1.1.1: Identify key, in-betweens, and breakdowns (en.wikipedia.org/wiki/Animation)

1. What is a key drawing? - A drawing that defines the beginning or the end of an action.

2. What is between? - A drawing that is created between two other drawings. Whether
these drawings are keys or other inbetweens. Consider for example, a ball rolling from
A to C. The two key drawings in this case are "A" and "C".

Therefore an accurate inbetween (set precisely in the middle) of "A" to "C" is "B".
Occasionally, there are animated sequences that will break the "keys" and
"inbetween" two element rules. For example, "straight ahead" animation is where there
are no keys but the animator creates a "drawing one" then moves on to drawing "two",
drawing "three", drawing "four", etc… successively adding a slight change of movement
each time until an entire moving sequence is built up. Alternatively, a sequence of
movement might involve additional indirect elements such as "extreme" drawings, which
essentially define the extent of a moment within two key positions but are not
necessarily linked to either. (A perfect example of "straight ahead" animation is where
the fingers of a hand tap impatiently on a desk. It is virtually impossible to "key" and
"inbetween" such an action, therefore it needing to be animated frame-by-frame (i.e.
using a "straight ahead" technique).

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.5: Identify principles and techniques of animation on timings  

In terms of actual animation, this action would be impossibly and unrealistically

fast (actually "one-eighth of a second" only... if viewed at 24fps) with each drawing
being shot for one frame of film each.

(This is known as animation on "1s"). Therefore, to slow this action down, the
animator will need to add extra inbetweens... say for example, two more... as well as
maybe shooting each drawing for two frames of film each. (Known as animating on
"2s".) Therefore, in the case of our rolling ball, the typical key drawings would be "1" and
"9" and the required inbetween drawings would be "3", "5" and "7".

Note: When animating on 2's the animation numbering will always reflect the
accurate frame numbers wherever possible… i.e. "1", "3", "5", "7", "9", etc., rather than
"1", "2", "3", "4", "5" etc. when animating on 1's.

3. What is breakdown? - … the next most important transition point between those key
actions, and will often require shifting and fine tuning (e.g. anticipation principle).
Breakdown is not always placed at the perfect middle point between the two key
frames. (www.ehow.com)
Figure 1 Marking symbols

Other markings 
for breakdown: 
• (number) 
• B/D 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.5: Identify principles and techniques of animation on timings  
Activity 1.1.2: Explain timing techniques
Charts and Breakdown Drawings: To make sure that the animator's wishes are
adhered to accurately by the assistant there has to be a clear system of rapport and
communication between them both.
It is clearly not desirable, nor even possible in many situations, for the animator to
verbally communicate his wishes to the assistant on a key-by-key basis. Therefore, to help the
assistant understanding the intention, an animator will draw a "chart" on the first of two key
drawings to illustrate where the inbetween placements are to be. This chart will usually be
drawn on the first key drawing of two keys. Therefore, in the earlier example of the rolling ball,
the chart below will be drafted onto key "1". This chart indicates that the animator first wants an
inbetween "(5)" to be placed between keys "1" and "9" and then two further inbetweens be
added... "3" between "1" and "(5)" and "7" between "(5)" and "9". This will give three evenly
spaced inbetween drawings between the two keys.

Figure 2. Timing chart sample 1 

Note that drawing "(5)" is indicated in parentheses. This is because it indicates the first
inbetween the animator requires the assistant to do "I" and "9 ". Because of its special
significance, this inbetween drawing is actually referred to as the "breakdown" drawing. Key
drawings are always charted as circled.

Figure 3. Timing chart sample 2 

Studying the chart further, we can deduce that when the breakdown "(5)" drawing is
completed, the assistant must then put in the two other inbetween drawings... "3" in the middle
of "1" and "(5)", then "7" in the middle of "(5)" and "9". There can of course be more (or less)
inbetweens between two key drawings but it is the animator's chart on the lead key drawing
that defines just what the animator requires the assistant to do.
Slowing In and Slowing Out: It is very rare that an animator will want to have evenly
placed inbetween drawings between two keys.
Nothing in life, except maybe machines, moves at a consistent, even speed and
animation that moves well will have to reflect this fact. Most action involves a movement either
slowing down or speeding up. Check it out... observe people moving and doing things and you
will see this is true. Therefore, to achieve this naturalness of movement, an animator will draw

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.5: Identify principles and techniques of animation on timings  
a chart differently from key to key. Ever aware of the enduring principle that the more drawings
there are between two keys the slower it will be... and the less drawings there are the faster is
it... an animator will devise a chart that arranges inbetweens in a way that the action will either
slow down, or speed up. Therefore, if the animator wants an action to slow down at the end,
their chart will indicate that there are more inbetweens towards the end of the action than at
the beginning.This setup is known as a "slow-in", because there are more drawings and the
end of the action, causing it to slow into the final key position.

Figure 4. slow in timing chart 

Note that the breakdown drawing is number "(3)" in this chart, due to the parenthesis around it.
If, on the other hand, the animator places most of the inbetweens at the beginning of the
movement, emphasizing a speeding up of the action as it moves, then this is known as "slow
out". Note too that on this chart the breakdown drawing has changed to number "(7)".

Occasionally, with longer and larger movements, the animator may require that the
action speed up, then slow down, between the two keys. This is known as a "slowing-
out/slowing-in" movement. In such a case and depending on the nature of what the action is,
the animator would probably draw the breakdown drawing, in addition to the two key drawings,
simply to remove the heavy inbetweening burden from the assistant, if the action is complex.
Remember that the key drawings are always circled, and the breakdown drawing is always
indicated in parentheses or a triangle (B/D in some studios).

Figure 5. slow in / slow out

timing chart 

The exposure sheet and timing: As exposure contains all the details of the animation
process specially the timing, key drawing artist and the assistant animators should consider x-
sheet with prudence.
Frame rate should also be considered in timing. Frame rate is the frequency (rate) at
which an imaging device produces unique consecutive images called frames. The term applies
equally well to computer graphics, video cameras, film cameras, and motion capture systems.
Frame rate is most often expressed in frames per second (FPS) and in progressive scan
monitors as hertz (Hz). (en.wikipedia.org/wiki/Frame_rate )

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.5: Identify principles and techniques of animation on timings  
24 frames per second (fps) is a non-interlaced format, and is now widely adopted. When
transferred to NTSC television, the rate is effectively slowed to 23.976 frame/s, and when
transferred to PAL or SECAM it is sped up to 25 frame/s.
Flash has 12 fps. It is the reason why if one is intending to export flash movie to AVI or
MPEG he should change its frame rate to 24 fps.
In the x-sheet, it is general information that in 1 foot, there are 16 frames. 

Figure 6. Traditional animation 
exposure sheet 

Figure 7. Toon Boom exposure sheet 
16 frames 
In 1 foot 
24 frames 
In 1 
second 

designer‐info.com 
Desktopacademy.com 

Figure 8. Toki exposure sheet 

www.macupdate.com 

NOTE: Traditional artist uses animation paper while 2D digital artist uses pen
tablet/display on software in drawing key, inbetween and breakdown drawings likewise slow
in and slow out control can be manipulated directly in the software. The principle remains the
same.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.6: Identify timings and soundtrack breakdown  
Learning outcomes:
1.1 Identify timings and soundtrack breakdown
Learning Activity:
1.1 Identify timings and soundtrack breakdown

Activity 1.1 Identify timings and soundtrack breakdown (en.wikipedia.org)

Before true animation begins, a preliminary soundtrack or "scratch track" is recorded, so
that the animation may be more precisely synchronized to the soundtrack. …it is almost
always easier to synchronize animation to a pre-existing soundtrack than it is to synchronize a
soundtrack to pre-existing animation. A completed cartoon soundtrack will feature music,
sound effects, and dialogue performed by voice actors. However, the scratch track used during
animation typically contains just the voices; any vocal songs that the characters must sing
along to, and temporary musical score tracks; the final score and sound effects are added in
post-production.
Voice acting - is the art of providing voices for animated characters. Performers are
called voice actors, voice actresses or voice artists, and may also involve singing, although a
second voice actor is sometimes cast as the character's singing voice. Voice artists record
their individual samples played back by a computer.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.6: Identify timings and soundtrack breakdown  

Layer with 
Sound 
breakdown 

Once you have your soundtrack recorded, edited, and properly timed out you can then
go about the process of breakdown. The voice track or soundtrack breakdown (in seconds) will
then be the reference of the animator in synchronizing the action and the lip-synchronization of
the character with the timelime. Breakdown simply put is finding out exactly what sound is
being made on every frame. To do this properly you need to have the soundtrack opened in
something like Premier or similar software. (www.natmax.com/ART292/Lip Sync Soundtrack
Breakdown).

Note: Please refer operation sheet #1.1.1 for your hands-on

Preliminary Slugging
Slugging is indicating the start and stop times of dialogue and relevant actions. It refers
to the editorial process of laying in blank footage (slugs) between lines of dialogue on a
soundtrack, accounting for action between lines so that you can come up with a continuous
length of footage for individual scenes or the entire cartoon. (Assigning times to scenes is
called "outside timing"; assigning times to slugs and dialogue within the scene is called "inside
timing.") The director "slugs" the storyboard by assigning those times; then those boards are
used as instructions for assembling the complete soundtrack.
Once the dialogue has been slugged and read, you get the tracks back from editorial
and actually begin the process of writing timing instructions into the action column on the
exposure sheets or, as they are sometimes called, "dope" sheets. Hence, that process was
called "doping." According to "The Illusion of Life," bar sheets (used by Disney and other

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.6: Identify timings and soundtrack breakdown  
studios to treat timing of action as a form of musical notation) were also called "dope sheets"
because they contained all the "dope" (slang for information) about the scene. That seems
plausible enough.
That info includes things like when and where the character should do things, cuts,
where camera moves should go etc. The far right column is the camera column. This is where
the technical information for the camera moves is located (this includes all of the information
written out as well as marks indicating where moves occur, tapers, and ends etc...) The
camera info is usually filled out by the animator or the assistant (depending on where you are
working).

The slugs - or the spaces between the dialogue. This is a necessary job done prior to an
animatic, track reading, and x-sheets. It can be as simple as generating basic footages
numbers or as complicated as writing in most of the details prior to sheet timing.

Slugging in the storyboard. Slugging in the x-sheet

(toonboom.com) 
To slug a storyboard is to time
the cartoon on the storyboard. 
(johnkstuff.blogspot.com)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.7: Explain mouth chart  
Learning outcomes:
1.1 Explain lip synch & mouth chart
Learning Activity:
1.1 Explain lip synch & mouth chart

Activity 1.1 Explain lip synch & mouth chart (en.wikipedia.org)

Lip Synching Creating sequential drawings that simulate what a character looks like
when they are talking.

Lip Synching is a powerful part of the Toon Boom tool set. It can be approached in a
few different ways, with different consequences in the final result and the amount of time put
into it.

While Toon Boom does have automatic lip-synching capabilities, it looses effectiveness
in longer clips. If your sound clip is longer than about thirty seconds, the lip synching may get
jumbled further along in the clip. One solution to this is to use separate sound elements, each
containing a portion of the overall sound clip. Now when you run the Lip Synching on the clip,
you'll have fewer adjustments to make.

The adjustments to lip synching can be made in a number of ways. The first way is to
make changes in the Sound Editor itself. This is the fastest place to do the work because it has
the fastest reaction and the quickest user interface, due to the simplicity of the design (this part
uses buttons) and the proximity of the parts of the interface used.

Using this process, the user can run the lip synching process on a sound clip, then
make any changes to the reading quickly in the Sound Element Editor.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.7: Explain mouth chart  
The limitation to this method is that it lacks the ability to include any user defined
visemes. However, it is the fastest place to make initial changes to any errors made by Toon
Boom in reading the lip synching.

Once the initial read is handled in the Sound Element Editor, the user can then use the
Modify Lip Synch Mapping to apply the synching to a drawing element. The drawing element in
question must be prepared ahead of time with frame names that match the A-G, X frames
used by the lip synching editor, It is possible to include additional drawings in this element, but
these basic eight lip synching drawings must be included.

Now the user can drag through the timeline and make further corrections using the Cells
tab in Properties. It may be tempting for the user to make all corrections with this method
instead of using the Sound Element Editor, but using the Cells Tab is actually slower, and
should be used only for fine tuning and including additional visemes not recognized by Toon
Boom, like L/D/Th.

A very useful tutorial can be found at Manual Lip Synch Toon Boom Tutorial. It gives
some very helpful info on basic approach to lip synching manually which is helpful for either
doing it by hand or fixing up the lip synching done automatically. 

Mouth chart: It can be a difficult task to know how to draw a characters mouth so that it
matches the sound at the right frame. To help you solve this problem Toon Boom Studio
provides you with the lip sync feature which analyses the contents of a sound clip element and
generates a lip chart based on the eight animation phonemes (A, B, C, D, E, F, G, and X,
which represents silence). You can refer to the lip chart positions as you draw the shape of
your character’s mouth. Basically sounds can be broken-up phonetically. You don't want to try
to match your mouth positions to each letter in a word but rather to the sounds being made.
The letters represent phonetic sounds. So as you listen to dialog, listen for the sounds and
begin to relate your facial muscles to how you make those sounds you don't speak in letters
you speak in sounds. You spell with letters.

Lips charts have to be approached based on the orientation of the character speaking. If
the character is in profile that will require a different set of mouth positions than if the character
is face forward or in 3/4 perspective. The TBS lip sync functionality is a great tool to help you
with your lip sync animation but you also need to look at it as just a great starting point. The
final work is up to your own artistic skill. Many artists use in-betweening techniques to blend
the mouth movements as the character speaks as opposed to "snapping" the characters
mouth from position to position. Like any animation you want to first establish your keys and

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.7: Explain mouth chart  
then you can apply in-betweens to smooth out the motions. Another important observation is
that facial muscles distort as a character speaks but teeth do not.
(toonboomcartooning.wetpaint.com / www.brighthub.com Avionne Akanbi &  Michele Mc Donough) 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.8: Identify all necessary materials and equipment to be used and
prepared according to the task to be undertaken
Learning outcomes:
1.1 Identify all necessary materials and equipment to be used and prepared according to the
task to be undertaken
Learning Activity:
1.1 Identify all necessary materials and equipment to be used and prepared according to the
task to be undertaken

Activity 1.1 Identify all necessary materials and equipment to be used and prepared
according to the task to be undertaken (www.characteranimationin3d.com 2D skills for better 3D)

Traditional animation equipment and materials

Figure 1. Traditional Animation Equipments and materials

Light Box - In its most basic form, a light box is a flat sheet of opal Perspex over a light.
Professional light boxes use a rotating disk. They should also have the ability to change the
angle of the drawing surface. This makes drawing easier both on the wrist and on the back.
Simple light boxes are relatively straightforward to make. You could use a wooden storage box
with the top part cut off at an angle and mount a neon bulb inside. Then fasten a piece of 6mm
opal Perspex to the top with screws.

Animation Disc - A drawing disc is placed on a lightbox and used to work out camera moves
and panning walk cycles. It has two sliding peg bars at the top and bottom.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.8: Identify all necessary materials and equipment to be used and
prepared according to the task to be undertaken
Peg Bar Professional peg bars are a strip of steel or plastic with three pins. These are industry
standard and are used with professional animation paper. These are used to register each
piece of animation paper against the next.

Figure 2. Pegbar attached on animation disc where animation paper is lock through it holes matched
up with peg bar’s pins / dowels.

Pencils - When doing drawn animation it's always best to work in rough with a col-erase blue
pencil and then "clean up" your drawings afterwards with a graphite pencil. This means you
can define the correct lines of the character and add details in graphite pencil on top of the
rough col-erase lines. (Also when you line test your animation the graphite line will show up
more distinctly than the blue lies underneath. An HB or B pencil is needed for the 'clean'
drawing whilst a coloured pencil is used for roughing out the animation. Sold under the trade
name of 'col-erase', these are coloured pencils that can be easily erased and are great for
drawing with. You can work rough with a graphite pencil but it can look get very confusing
when it comes to "cleaning up" the drawings.

Erasers – Generally ordinary eraser with good quality is used in time to time drawing while
auto eraser is used for erasing constricted part of a drawing especially in clean-up drawings.

Animation paper- When animating, you often find that you are working with four or more
layers of paper. A level of translucency is necessary to see all the drawings. Professional
animation paper is made with this in mind.

It also comes in different sizes. These are referred to as field sizes. 12 field and 15 field are the
most popular. 15 field is 15 inches wide, 12 field being 12 inches wide. Most professional
animation paper comes with 3 punched holes. Used with a peg bar, the holes allow accurate
placing of each piece of paper with the next. This is important, as the slightest movement in a
drawing will show when the sequence is shot.

Folder and bull clip – Use to stack all drawings by scene. The folder is labeled according to
the scenes sequence of the production and the drawings inside are marked in succession.

Line tester - is a device that captures your drawings and plays them back. It is a quick and
easy way to see if the roughly drawn sequence works. There are a number of ways to set up a
line tester. You could use a film camera, a video recorder that can record single frames or a
line testing software program and a computer. The movie examples on the CD ROM were
produced using a program like Toki, CTP etc.

Scanner – Used in scanning cleaned-up drawings to convert it digitally. (printer & photocopier
uses are self explanatory)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 1.1.8: Identify all necessary materials and equipment to be used and
prepared according to the task to be undertaken
Electric / automatic pencil sharpener - Great for helping speed up your work.

Feather duster / paint brush – Used in clean-up drawing and the whole animation disc.

Animator’s glove – prevent numbness and dirt caused by hand perspiration that could
damage drawing. 

2D digital animation equipment

Pen tablet / pen display – integrates the uses of color / graphite pencils and animation paper
of the traditional animation. Its strokes are already digital and vector drawings. Its stroke is
variable and can be changed as brush and or other capabilities that mouse can do like
invoking commands.

Computer set – Computer with high computer hardware specifications and big LCD monitor is
ideal for 2D digital animation.

2D Animation software – Flash / Toon Boom / Director, etc.

Graphic software – Photoshop / Illustrator / Corel Draw / PhotoPaint / PaintShop, etc.

Compositing software – After Effects / any video editing software, any audio editing software.

Figure 3. Some of the 2D 
digital animation equipment 
and software. 

Pen tablet and pen display. Pictures from wacom.com

Flash software. Picture from
designer‐info.com 

Toon Boom software. Picture from
www.computerarts.co.uk 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
Learning outcomes:
1.1 Interpret creative concepts
Learning Activity:
1.1 Interpret creative concepts

Activity 1.1 Interpret creative concepts

What is creative thinking or concept?

Creative thinking/Concept - Our creative mental faculty is called
imagination. It is the ability to dream up ideas of one's own and
ability to create in your own mind an interpretation of other people's
ideas. (en.wikipedia.org) Figure‐1 a creative design 

Imagination – The ability to create new things or ideas, or to combine old ones into new
forms; It is sometimes given the other name, synthetic memory, ‘synthetic’ being synonymous
to productive. (Learning Excellence by Philip T. Torres, 2009)

Art - is often intended to appeal and connect with human emotion. It can arouse aesthetic or
moral feelings, and can be understood as a way of communicating these feelings. Effective art
often brings about some new insight concerning the human condition either singly or en-mass,
which is not necessarily always positive, or necessarily widens the boundaries of collective
human ability. The degree of skill that the artist has, will affect their ability to trigger an
emotional response and thereby provide new insights, the ability to manipulate them at will
shows exemplary skill and determination. (en.wikipedia.org)

Visualization (graphic) - any technique for creating images, diagrams, or animations to

communicate any message. (www.answers.com)

Visual Arts/Graphics - are art forms that create works which are primarily visual in nature,
such as ceramics, drawing, painting, sculpture, architecture, printmaking, modern visual arts
(photography, video, and filmmaking), design and crafts. These definitions should not be taken
too strictly as many artistic disciplines (performing arts, conceptual art, textile arts) involve
aspects of the visual arts as well as arts of other types. Also included within the visual arts [1]
are the applied arts [2] such as industrial design, graphic design, fashion design, interior
design and decorative art. [3]. (www.answers.com)

Graphic design - can refer to a number of artistic and professional disciplines that focus on
visual communication and presentation. The field is also often referred to as Visual
Communication or Communication Design. (en.wikipedia.org)
Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts

Figure‐2  
Pictographs 
created by 
graphic 
designers 

Graphic symbols are often functionalist and anonymous, [1] as 
these pictographs from the US National Park Service illustrate. 

Radim Malinic

David Mascha | Showcase 2008

Figure‐3 Creative designs by graphic artists 

What designers need to know?

(Edited by Sharon Helmer Poggenpohl Copyright 1993. The American Institute of Graphic Arts)

Perception, visual organization, aesthetics

Designers think about visual forms and how they are put together to convey meaning. These
forms are a kind of visual language. Points, lines, planes, volumes, spaces, areas, textures
and colors, as well as how they are used to create symmetry, proportion and rhythm, are basic
aspects of the designer’s visual vocabulary.

Form and structure analyzes positive and negative forms.

Form analysis examines how two- and three-dimensional forms create a feeling of space.

Structure and system consider various ways to create order in space. For example, grid
system is one way to create a sense of harmony and order.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
Visual phenomena explore the intuitive response of the audience to form, color and texture.

Composition and visual framing involves deciding what to include in an image and how
elements of an image contrast with one another.

Visual abstraction identifies the key features of an object and simplifies them.

Unity of form looks at relationships among design elements, such as proportion, scale,
symmetry and contrast.

Visualizing techniques
Designers need to be familiar with basic tools, techniques and processes to produce images,
sketches, models and finished work. They need to use tools with skill and sensitivity. Students
learn photography, various kinds of drawing, model making and diagramming as ways to
develop their ideas.

Photography, although often regarded as a “truthful” rendering of the world, may convey
realism or emotion, as demonstrated in these examples.

Visual translation is the process by which the essence of an image is abstracted in a drawing.

Model making explores three-dimensional forms in order to plan and prototype an exhibition or
a new product.

Drawing teaches the student to look and to see as well as to put down meaningful marks on
paper.

Materials, tools and technology

Technology always plays a role in the process of designing and in communicating information
visually. Designers create ideas in two and three dimensions using various materials such as
paper and film. They use tools such as computers, camera and airbrushes and work with the
technologies of letterpress and video. The designer’s selection of materials and tools can
change what an image looks like and what it says.

Blending ideas and production techniques

Designers create solutions to design problems. A part of every solution includes
Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
communicating how to get the job done technically: how to get the poster printed or how to
create the mechanicals for the package design. The designer must learn to clearly express
and transmit ideas and instructions as well as to receive and evaluate feedback. To this end,
the student learns to specify technical instructions; to write objectives, briefs and reports; to
present ideas verbally, graphically and with audiovisual support; and to listen carefully.

Message and content

Designers address communication problems. They interpret ideas and represent them with
images and words. Skill in thinking about and creating meaning with images, type and symbols
is essential. The ability to put a persuasive or informational perspective on an idea is also
important.

Semantics is the study of how people understand words and images.

Visual metaphor studies symbols. For example, a torch can signal the abstract ideas of victory
or freedom.

Persuasion and information examines how to create a memorable visual statement.

Image, symbol and sign explores the ways in which graphic marks, such as handprint or a
target, communicate.

Methods, planning and management

These Bill of Rights broadsides demonstrate design planning. Seminars with legal experts
helped the students study the judicial processes of the Supreme Court and specific legal
decisions. Students then did additional research and experimented with typography, historical
imagery and the “re-presentation” of photojournalism to determine how to present their ideas
visually to a high school audience. The broadsides communicate difficult concepts by
identifying specific elements in the Bill of Rights and the landmark Supreme Court decisions
that anchor them.

Design methodology provides a path for the designer in the search for solutions to
communication problems.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
Design evaluation judges reaction to a design through a testing procedure. For example,
observing a child’s reaction to a book might answer the questions: Is the book easy to read? Is
it appealing? Is meaning communicated effectively?

Design management involves an overview of the process of design, including managing

creativity, costs, schedules and quality.

History and criticism

Designers are part of a visual culture that includes art, architecture and design. It is not only
interesting but also important to know what has gone before. Designers study the past for
inspiration and to understand its themes, styles and technical developments. It is possible to
trace how certain ideas, developments in the art and technological advances have influenced
particular designers. Criticism helps the designer evaluate the usefulness or beauty of a
design.

Design theory
Design theory explores the principles underlying what communicates and why. For example,
why does one color communicate happiness to you and fear to someone from another
society? What are the ways culture affects the designer and the audience? Design theory
seeks to find the unifying principles—which might be intuitive or deliberate—that are the basis
for all graphic design. It is where education and practice meet.

Graphic design subjects

Letterform investigations look at the forms of logotypes and letterform found in everyday
objects and in typefaces.

Typography examines text messages created for information or expression.

Type and image explores the relationship between the two and the power of each to
communicate in relation to the other. Type also becomes images in some applications.

Design systems serve to unify appearance and coordinate production. Visual characteristics,
such as the 45-degree angle, the square on its tip, the color and the torn paper, are played out
over many pieces to guarantee an easily recognizable relationship.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
Symbol and identity systems seek to specifically identify an object for the public and to use that
identity in all communications.

Information design clarifies data, helps orient the viewer and guides the search for what is
important by establishing a clear visual hierarchy. These qualities are particularly useful in
computer interface design.

Diagrams, graphs and maps distill information to make it easily understood. For instance, a
three-dimensional form can show the relationships of solid, liquid and gas.

Publication and print design explores the overall structure—pacing, sequence and hierarchy of
information—as well as the particular use of text and image found, for example, in the editorial
material of magazines and newspapers.

Book design is concerned with both the exterior package of the book (the cover) and its interior
contents (the pages).

Poster design combines words and images in a powerful public announcement, whether for an
art exhibit, an election campaign, or a circus.

Film and video graphics organize ideas dynamically in time. They communicate by using
images in sequence with narration, music and text.

Computer graphics explores the digital world of highly manipulated imagery.

Package design serves multiple functions: to protect, display, dispense, store and announce
the identity and qualities of a product.

Environmental signage and graphics helps people find their way through streets and buildings
and gives clues to the nature of the environment people find themselves in.

Exhibition and display design seeks to involve an audience in exploring an idea in space and
time through the use of graphics, objects, text, sound effects and participatory opportunities.

Advertising design is calculated to attract attention, make a compelling pitch to an audience

and create a desire for the product.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 6
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts

Color Meanings/symbolism: (www.color-wheel-pro.com)

• Red is the color of fire and blood, so it is associated with energy, war, danger, strength,
power, determination as well as passion, desire, and love.
• Orange combines the energy of red and the happiness of yellow. It is associated with
joy, sunshine, and the tropics. Orange represents enthusiasm, fascination, happiness,
creativity, determination, attraction, success, encouragement, and stimulation. It also
symbolizes danger.
• Yellow is the color of sunshine. It's associated with joy, happiness, intellect, and
energy.
• Green is the color of nature. It symbolizes growth, harmony, freshness, and fertility.
Green has strong emotional correspondence with safety. Dark green is also commonly
associated with money.
• Blue is the color of the sky and sea. It is often associated with depth and stability. It
symbolizes trust, loyalty, wisdom, confidence, intelligence, faith, truth, and heaven.
• Purple combines the stability of blue and the energy of red. Purple is associated with
royalty. It symbolizes power, nobility, luxury, and ambition. It conveys wealth and
extravagance. Purple is associated with wisdom, dignity, independence, creativity,
mystery, and magic.
• White is associated with light, goodness, innocence, purity, and virginity. It is
considered to be the color of perfection.
• Black is associated with power, elegance, formality, death, evil, and mystery.

NOTE: Color meaning/symbolism varies in the context of cultural interpretation of different

countries. Branches of science may have their own respective color interpretations.

Object symbolism: (symbolism.wikia.com)

• The key is an object symbolic of opening and closing powers. It represents knowledge,
mystery, initiation, and curiosity.
• Pandora's Box was introduced in the myth about Pandora. She was not supposed to
open the box, but curiosity got the best of her. She opened the box and out flew all
theevils, luckily she slammed it shut again before the last evil flew out and destroyed
hope.
• Roses often symbolize love and beauty; therefore, they represent ladies.
• Gold, both the color and object, symbolizes justice. Gold symbolizes power, strength,
and perfection.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 7
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
• Ring is a symbol of love and affection. That is because it is a circle unbroken, unending,
without beginning.
• Sun symbolizes God in a Christian perspective. It can also represent a king or emperor.
It is sometimes used in Christianity to symbolize resurrection.
• Broom is a simple object that has multiple different potential meanings. It can represent
home and hearth, cleanliness, witchcraft, marriage.
• Skull is as a representation of death and mortality, but such a reading varies with
changing cultural contexts.
• Lightning is symbol of loss of ignorance. It also represents the punishment of humans
from the Gods. In dreams, lightning is a symbol of a terrible event and negativity.
• Olive branch is a branch of an olive tree. In Western culture, derived from the customs
of Ancient Greece, it symbolizes peace or goodwill.

How to Evaluate the Work of Graphic Designers (www.howtodothings.com) 

Its aesthetic appeal. This is probably the most basic; it's the factor that you would observe
once you come into visual contact with the design. Factors that are included are the font (its
type and size), colors, images, the layout, and the medium. One tip is to remember what your
impression is of a design the first moment you viewed it. Did the colors strike you as too
intense? Did the color combinations produce an effect that suggested weakness or
feebleness? Was the layout too confusing, or much too organized so as to be branded as
unimaginative? More often than not, first impressions produce the most lasting effect, so it's
important to note the design's first impression on you.

Its effectiveness to fulfill its purpose. What is the purpose of the design? Let's say it's for
marketing. If this were the case, you'd need to evaluate the design based on its effectiveness
as a marketing tool. Does it appeal to its target audience (for example, does it use words,
images, colors that the target audience commonly relates to)? Does it effectively reflect what
the product stands for - or in other words, is there consistency between product and design? If
you were a consumer, would you be moved to purchase the product because of the design?

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 8
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.1: Interpret creative concepts
Remember, there are many questions you may ask yourself when you're analyzing the design,
based on its ability to fulfill its given purpose. The surest way here is to hold a brainstorming
session with trusted people, so you could list pertinent questions and criteria.

Its medium of presentation. Usually, when a designer submits his work, it's printed on the
best quality paper and in high quality ink. What if the design is intended to be enlarged to
billboard size? You have to supervise the construction of the final, final product to make sure
that it still maintains the highest level quality possible. Using the billboard example, you
wouldn't want it to come out all pixelated or bland-looking because it turned out that the design
isn't appropriate aesthetically for larger-than-life recreations. Also, check it out for minor errors
in printing (if there are spots in some areas, or some fine lines where there shouldn't be).

Other practical aspects. For example, if the design is meant to be mobile, it shouldn't have
heavy oak weighing 20 pounds as part of its components. Be sure to clearly state how the
design is to be used and presented, so the designer would be able to work with proper media.
Also, you may analyze the designer based on his ability to work within the given budget and
the given time frame. Of course, for your part, you'd have to be very clear about your
expectations and the guidelines that he has to follow. Remember, just because a graphic
designer is results-oriented, as he is hired in a professional capacity he is expected to
demonstrate proper work ethics and to comply with the specified instructions, as well.

These are just some guidelines to help you evaluate a graphic designer's work. As a final
word, be sure always to keep an open mind and to use your sound judgment.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 9
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.1: Draw and interpret design
 
Learning outcomes:
1. Draw and interpret design
Learning Activity:
1.1 Draw and interpret design

Equipment / Resources
• White cartolina
• Drawing materials
• Masking tape

Each group is given four (4) hours to perform the activity.

At the end of this activity your group should be able to draw your own design and interpret it
before the class.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Operation Sheet 2.1.1: Use Toon Boom Auto Lip-Synch
Learning outcomes:
1.1 Use Toon Boom Auto Lip-Synch
Learning Activity:
1.1 Use Toon Boom Auto Lip-Synch

Activity 1.1 Use Toon Boom Auto Lip-Synch

After learning previous lessons about sound reading and x-sheet (traditional animation),you
are now to use a 2D digital animation software (Toon Boom) for you to compare and relate
these two processes.

Steps:
1. Open Toon Boom software
2. At the “Exposure Sheet” window, click sound. You will notice that the default “Drawing
Tab” will go after a new “Sound tab”
Sound tab

Sound icon

3. Right click on the sound frame mouse over on “Import Sound” then click “From File…”

4. Select the desired voice track, then click “Open”.

5. Automatically on sound frame 1 the filename of

the selected voice track will appear and the next
frames will be consequently numbered.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Operation Sheet 2.1.1: Use Toon Boom Auto Lip-Synch

6. Right click on sound frame 1 when menu appears, click “Show Lip-sync”

7. Automatically Toon Boom will compute

Lip-sync data and produce the map for
mouth positions.

“x” corresponds mouth position

closed for consonants B,M, & P

8. If you created a layer where the mouth chart of your character is set, you can now
assign that mouth drawing layer to the sound layer so that Toon Boom will automatically
synchronizes.
Please watch video tutorial on YouTube
http://www.youtube.com/watch?v=cu46CYbhsRU for more comprehensive learning.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.2: Identify animated styles and graphic styles & techniques
Learning outcomes:
1.1 Identify animated styles and graphic styles & techniques
Learning Activity:
1.1 Identify animated styles and graphic styles & techniques

Activity 1.1 Identify animated styles (King Bee Animation)

The following are the common animated styles:

Style: quirky silly angular men

Style: simple iconic
by Mark Culmer
By Petra Stefankova

Style: traditional Style: Futuristic

By Petra Stefankova by Tony Mines & Tim Drage

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.2: Identify animated styles and graphic styles & techniques

Style: Funky 3D Style: Cute Textured Flat Vector

by Jamie Niman Animation by Petra Stefankova

Style: Funky animation

psychedellic tonal vectorized human Style: model surreal animation
by Jaiyeola Bamwo by Tim Drage

Drawing Styles (how-to-draw.org)

Much of the drawing in early times was done as part of the embellished artwork that was
attached to manuscripts. These 'illuminated' manuscripts are beautiful examples of
drawing, with gilt and scarlet, as well as other colors forming part of the decoration.

Today, another type of drawing is replacing much of the earlier types. Sophisticated
software allows you to draw pictures during the information developed through your own
artistic endeavors but translated by the computer. Of course, this means mastering a
much different set of controls and processes.

Drawing styles were adopted in traditional animation, stop motion, computer animation
(2D & 3D), even in Japanese anime in creating animated cartoons or animated films.
(Today we have flash charts animated styles, DC animated-style hero machine etc.
Buttons in web pages, games, software & even kids doing there works in computer are

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.2: Identify animated styles and graphic styles & techniques
Digital imaging or digital image
Digital imaging or digital image acquisition is the creation of digital images, typically from a
physical scene. The term is often assumed to imply or include the processing, compression,
storage, printing, and display of such images.

A digital image may be created directly from a physical scene by a camera or similar devices.
Alternatively, it may be obtained from another image in an analog medium, such as
photographs, photographic film, or printed paper, by an image scanner or similar device. Many
technical images—such as those acquired with tomographic equipment, side-scan sonar, or
radio telescopes—are actually obtained by complex processing of non-image data. This
digitalization of analog real-world data is known as digitizing, and involves sampling
(discretization) and quantization.

Finally, a digital image can also be computed from a geometric model or mathematical
formula. In this case the name image synthesis is more appropriate, and it is more often known
as rendering.

Digital image authentication is an emerging issue [citation needed] for the providers and
producers of high resolution digital images such as health care organizations, law enforcement
agencies and insurance companies. There are methods emerging in forensic science to
analyze a digital image and determine if it has been altered. (en.wikipedia.org)

www.pdngallery.com www.carletonsportsmed.com

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.2: Identify animated styles and graphic styles & techniques

Broad range of graphic styles and techniques (en.wikipedia.org)

Graphic design - can refer to a number of artistic and professional disciplines that focus on
visual communication and presentation. The field is also often referred to as Visual
Communication or Communication Design.
Graphics design applies to road signs, product ads, logos, packaging, publication lay-outs,
(print media) entertainment (film to TV broadcasting), and interactive design, games, or
multimedia design, including motion graphics (web-based or presentation).

The most current, industry-standard software for graphic design is Adobe Creative Suite CS5.
Adobe Creative Suite 5 (Adobe CS5) is a collection of graphic design, video editing, and web
development applications made by Adobe Systems (Dream weaver). The collection consists of
Adobes applications (e.g., Photoshop CS5, Acrobat, InDesign CS5, Illustrator CS5, Flash CS5)

Corel is one of the world's top graphic design software companies with more than 100 million
active users in over 75 countries. (www.corel.com)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
Learning outcomes:
1.1 Apply life drawing principles
Learning Activity:
1.1 Identify life drawing principles

Activity 1.1 Identify life drawing principles (www.zebtoonz.com)

Drawing human body:

Drawing human body is full of challenges it could require line and tone, perspective and
composition. Parental guidance is advised as some of these lessons depict nudity.

Standard ideal proportions. (drawinglab.evansville.edu,

www.realcolorwheel.com/human.htm)
• The human figure is an average of 71/2 or 8 heads high.
• The width from shoulder to shoulder is 3 heads width.
• The distance from the hip to the toes is 4 heads.
• The distance from the top of the head to the bottom of the chest is 2 heads.
• The distance from the wrist to the end of the outstretched fingers of the hand is 1 head.
• The length from top to bottom of the buttocks is 1 head.
• The distance from the elbow to the end of outstretched fingers is 2 heads

This drawing is a
male; the width
of the shoulders
is two heads
high. A female’s
shoulders are
narrower at two
heads wide
Accurate 8-
head-high adult
male human
figure, adjusted
for artists.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
The Skeletal Structure:
• The skull - has the same proportions as the head. One can find the eye sockets
halfway between the top of the head and the chin.
• The collar bone (clavicle) protrudes enough that it is easy to see when drawing the
figure.
• The shoulder blades (scapulae) are also easy to discern in the upper half of the back.
The shoulder blades are important to activate and add interest to the back which has
very subtle variations.
• The top edge of the pelvic bone (iliac crest) shows up to give an indication of the
placement of the legs and lower torso.
• The knee (patella) and ankle bone (inferior extremity of the tibia) both protrude enough
for careful observation.

Character Drawing:
Starts with Basic Shapes
Human stick figures and basic shapes:

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
Let us draw characters in pose using stick figure (basing on the skeletal structure) and add
volume of the body through basic shapes.

In this example you will note that you do not need to draw the cylinders like actual cylinders.
Instead, you can just 'connect the joints'.

Here’s another example from “foxprints.com by Tracy J. Butler”. Cylinders look like actual
cylinders.

1 2

3 4

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
Drawing the human face
Standard Facial Proportion The eyes
are halfway between the top of the
head and the chin.
The bottom of the nose is halfway
between the eyes and the chin.
The mouth is halfway between the
nose and the chin.
The corners of the mouth line up with
the centers of the eyes.
The top of the ears line up above the
eyes, on the eyebrows.
The bottom of the ears line up with the
bottom of the nose.

Drawing the Head (www.artyfactory.com)

Although the If you view a
proportions of a head will vary head from the front,
from person to person and its width is
change slightly with age, there approximately two
are some basic principles you thirds of its height.
can follow to improve your If you view a
drawing. You can use these to head from the side,
check the general size, shape its width is
and position of features in your approximately seven
drawings eighths of its height.

The third quarter contains These

most of the features. At the top proportions will only
of this section the eyes are work if we share the
usually level with the ears, and same eye level as
at the bottom the nose is the subject. They will
roughly level with the ear become distorted if
lobes. we view the head
The final quarter from above or below.
stretches from the base of the
nose to the chin with the
mouth positioned just above
the half way mark.

Drawing the Eyes

Step 1 - The Initial Line Drawing There are two things that you
should carefully observe when starting your drawing of an eye: 1.
The difference in shape between the upper and lower eyelids.
2. How the upper eyelid covers the top of the iris.
(mouse over the image to view this effect
Step 2 - The Eyeball There are two main elements to consider
when drawing the glassy surface of the eye:
1. A glint of reflected light should be left unshaded at the start of
the tonal drawing. This should become the brightest element in
the eye. This reflection is further enhanced by its contrast with the
pupil - the darkest element in the eye.
2. The iris contains a variety of tones and flecks which radiate to
the centre of the pupil. It is usually darker around its outside edge
and lightens towards its centre creating a translucent effect.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 5
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles

Drawing the Nose

1. Start by drawing what you can see, namely the inside and
outside edges of the nostrils. Then try to outline the main areas of
tone that define the planes of the nose.
2. Draw these lightly as you want them to disappear under your
shading at a later stage in the drawing.

Drawing the Mouth

1. Start by drawing the subtle shape of the line that is formed as
the lips meet. This will set a natural expression for the mouth.
2. The top lip has its characteristic bow shape which varies
considerably from person to person. The bottom lip is usually
larger than the top and more creased with vertical stretch lines.

Drawing the Ears

1. You need to organize its irregular shape into some
basic forms that are easier to outline.
2. You can then use this linear framework to gradually
build up its complex form with tone.
3. Areas that are mostly light - Leave these unshaded.
4. Areas that are mostly dark - Shade these with a mid-
tone.
5. Areas that are extremely dark - Shade these with a
dark tone.

Preston Blair a well known Disney animator who wrote Cartoon Animation has his way in
drawing character face that really effective specially in stressing the volume & mass of the
face, that goes like this: Think of a head as a rounded mass. It is either ball-shaped, pear
shaped, or egg-shaped. In animation, the head shape may change perspective and form many
times during a scene. To simplify matters, a framework in proper perspective must be drawn
first, and then the details are constructed over this form.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 6
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
Relatively, it is a fact that the face of woman differs with the man to enforce your learning
please refer eLM - to watch the differences between man and woman face.

Facial Expressions
The Most Important Features (refs: danidraws.com‐facial‐expressions‐and‐how‐to‐draw‐them, 2D‐digital‐ art‐
guide.com, & merrillk.com)

1. The Eyes – Probably the most important feature for evoking a clear emotion. Utilize the
eyelids and eyebrows to create your effect.
2. The Cheeks – The way they squash and stretch will affect the look and position of the
eyes.
3. The Mouth – The shape of the mouth is also very important. It affects how the cheeks
move and the shape of the entire face.

Additional Tips:

Note that when you move the shape and position of one feature, it affects everything else.
Nothing stands completely on its own.

4. For a stronger drawing and character, really push the expression. Instead of simply
drawing a happy person, draw one that is ecstatic; instead of drawing an angry person,
draw a furious one.
5. Have a mirror nearby. When I’m trying to nail down an expression, I often find my own
face making weird movements unconsciously. It can make for good reference.

Sadness Mouth Eyes

and Agony • Corner of lips pulled down • Upper eyelids drop
• Raised cheeks Inner corners of eyebrows raised and
Possibly dropped jaw (for agony brought together
and crying)

Anger Mouth Eyes

• has rectangular shape if • Glaring
teeth exposed • Raised upper eyelids
• Thinning of lips • Possibly tensed lower eye lids
• Jaw tightly clenched Muscle of difficulty
subtle but frequent • Tighten up area around eyes
earliest sign • Mental and physical difficulty cause it

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 7
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles
• Lower jaw can be forward to contract
• Eyebrows lowered and brought
together
Surprise Eyes Mouth
and Fear • Upper eyelids raised as
• Usually gapes (opens) and is very
high as possible still.
• Tensed lower eyelids
• Eyebrows raised and
slightly closer together
• Eyes staring straight
ahead
Happiness Eyes Mouth
• In a squint position • Pushes up on the cheeks
because the cheeks are • muscles expand when laughter
Pushing up against it augments
• Eyebrows are more
relaxed

Drawing a character with dynamic poses

Start from drawing the line of action.
LINE OF ACTION is a tool which can be pushed to create more dynamic poses.
This principle is different than construction in that it is not based on tangible reality.
Everything in real life has construction.
Line of action is an artistic concept
that sometimes by accident
happens in real life but not always.
BUT! It is an important tool for
artists. (www.animationarchive.org) 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 8
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles

Character Construction
Step 1- First begin with a LINE OF ACTION.
The LINE OF ACTION should always be active.
Avoid vertical lines — they are still and can
make your character wooden. Try a sweeping
curve, a diagonal or horizontal LINE OF
ACTION.

Step 2 - Add some simple shapes to the LINE OF ACTION. Think of these
shapes as three dimensional, i.e., as FORMS with
depth.

Step 3 - We now need to build some STRUCTURE in our character.

Draw simple lines for the structure of the arms and legs.
Tip: The hips are always attached across from each other and they are
always opposite each other. If one is forward, the other is back. If one
is up, the other is down

Step 4- Create forms around the line of structure for the arms and legs.
Most of the time you will be using cylinders.
Tip: Experiment with different shapes of cylinders. Curved lines against
curves or, better yet, curved lines against straight lines form more
dynamic and interesting shapes.

Step 5 - Know which direction the cylinders face.

Tip: The neck is always on the front side of the body and not on the
top of the shoulders.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 9
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.3: Apply life drawing principles

Step 6 - Finally, hang the clothes over the forms. The details are the
last elements you add to a character design.
Tip: Work RUFF and LOOSE; it will add more action attitude and
spontaneity to your designs.

Rotating the pose of the character

The easiest and best way to draw out a Rotation is to break down the
character into its simplest forms. Then you just rotate the forms.

Here the model sheet of Matt is distilled into simple forms. (Pads for the hands and feet,
cylinders for the arms and legs, a ball for the body and a ball for the head).

Dynamic poses
(Alex Brax)
Artists push the poses
to the extreme - very
exaggerated. Those
make for the best
dynamic poses.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 10
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.3: Draw a model according to its descriptions
 
Learning outcomes:
1. Draw a model according to its descriptions (group activity)
Learning Activity:
1.1 Draw a model according to its descriptions (group activity)

Equipment / Resources
• Descriptions of the model (found below)
• White cartolina
• Drawing materials
• Masking tape

Your group is given four (4) hours to perform the activity.

At the end of this activity your group should be able to produce a drawing of a model according
to its description (found in the story below) to apply what you had learned from the two
previous exercises in stimulating your creative mind.

The story: (for the Model Descriptions - Situating Learning)

A hotdog company manager was transacting with Yong World Studio’s chief creative
director to produce a 20-seconder advertisement (2D Digital Animation). The manager wanted
to portray a humanized hotdog - mascot (to attract children), with “macho” look
(suggests healthy appearance), and tantalizing eyes (generally appealing). Eventually,
the manager describes the scene he likes to be.

After the dealings, a script came out and storyboard was pitched. However, that very
day the son of the lay-out artist reported that his father suffered a stroke. So, the director
challenged the poll of key drawing artists to create the model sheet of the mascot
accordingly to the description stated by the hotdog company manager and promised
additional remuneration for the one who got his nod. After the contest, Buknoy won and his
Model Sheet became official and distributed to all the studio departments to which all the key
drawings, in-betweened and cleaned-up drawings were basing from his work. Thereafter, the
director requested the background artist to draw the backgrounds and started to craft the
exposure sheet.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 2.1.3: Identify all necessary materials and equipment in drawing the mascot
in walk cycle
 
Learning outcomes:
1. Identify all necessary materials and equipment in drawing the mascot in walk cycle
Learning Activity:
1.1 Identify all necessary materials and equipment in drawing the mascot in walk cycle

Instruction: In 2 hours, your group will identify and acquire all necessary materials and
equipment for each of the member in drawing the mascot in walk cycle. (Identified equipment
and materials will be requested by the group leader to the tool keeper. Please fill-up entries
below).
No. Equipment or material Quantity Remarks

Date: Requested by: Tool keeper: Remarks

At the end of this activity your group should be able to identify all the necessary equipment and
materials needed for the task and distribute it to each member.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.4: Draw a walk cycle

Learning outcomes:
1.1 Draw a walk cycle
Learning Activity:
1.1 Draw a walk cycle

Activity 1.1 Draw a walk cycle (www.idleworm.com)

The process can be broken down into a series of steps which can go some distance in
simplifying the process.

A walk cycle can be described by four distinct poses:

CONTACT, RECOIL, PASSING and HIGH-POINT.

Path of action

These four poses and a couple of inbetween drawings constitute a walk cycle. The single most
important frame of the four is the contact pose. Once you draw it you have already determined
80% of the rest of your walk. If you make a mistake on your contact pose, it can be very
difficult to correct later on. Therefore: pay close attention now and save yourself a world of
pain.

When the right foot is forward, the right arm is back, and vice versa. This is called
"counterpose". This is how nature keeps everything in balance when you move: one side of the
body "opposes" the other. Good animation has these "opposing actions" all the time. If
animation seems weak or unnatural to you, it is frequently because it lack opposing action.
You can think of a walk as a series of "falls". The character propels himself forward by leaning
into the walk as he moves forward. His trailing foot constantly swings forward to catch himself
before he moves on to the next "fall" in the sequence. It shares many attributes with the
bouncing ball…

For more comprehensive walk cycle tutorial visit

http://www.idleworm.com/how/anm/02w/walk1.shtml

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.4 Draw the mascot model in dynamic pose
 
Learning outcomes:
1. Draw the mascot model in dynamic pose
Learning Activity:
1.1 Identify & prepare all necessary materials and equipment to be used according to the task
to be undertaken
1.2 Draw the mascot model in dynamic pose

Equipment / Resources
• Model sheet (the hotdog mascot)
• Drawing paper
• Drawing materials
• Masking tape

You are given four (4) hours to perform the activity.

At the end of the activity you should be able to apply your previous know-how in life drawing
and creativity by drawing the mascot (Job sheet 2.1.3) in dynamic pose.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 2.1.4: Practice sound reading
 
Learning outcomes:
1. Practice sound reading
Learning Activity:
1.1 Practice sound reading

Equipment / Resources:
X-sheet with voice track or dialogue instruction

Table 1 (questionnaire)
No. Question Answer Remarks
1. How many seconds does the x-sheet contains?
Approximately in this x-sheet, what are the
2.
syllables uttered in the 1st and 2nd footage?
How many frames do the syllables “I” and “can’t”
3.
have?
Which uttered longer; the syllable “help” or the
4.
syllable “I’m”?
5. Is there a syllable which has a timing of on “2s”?

You are given 1 hour to answer table 1.

At the end of this activity you should be able to specify the number of frames and seconds
allocated for each syllable in the exposure sheet (x-sheet) by sound reading.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 2.1.4: Practice sound reading
 
X‐Sheet

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.5: Practice sound reading

Learning outcomes:
1.1 Practice sound reading
Learning Activity:
1.1 Practice sound reading

Activity 1.1 Practice sound reading (www.donbluth.com)

Note: Sound reading in x-sheet is necessary practice in traditional animation. Although 2D

digital animation software has already shortcuts in the process especially in lip-synch, this
process is a big help in befitting the voice track to the character’s action, emphasis, and facial
expression.

Below are the common steps in sound reading

1. Report to the Editor for dialogue (dial) to be "sound-read".
2. Run the soundtrack through the sync.
3. You will need to run the dialogue through at a fast enough pace in order to listen to it at
a speed close to the actual recording speed. This takes a little practice, but soon you'll
be able to hear an actor's dialogue clearly and coherently. Run the dialogue through
several times until you understand the entire sentence.
4. You may be asked to break down the dialogue word by word. We call this "word
placement". In such a case, you would go through the dialogue and write the dialogue
words on the upper line of the "greys" (see below). The word being read is printed on
the first line where it starts and a small line is drawn at the bottom where the word ends.
5. Next, run back to the first word in the sentence and go through, slowly, word by word,
deciphering and breaking down the words into their respective vowels, consonants and
phonetics. This is called "close-up reading". You will print what you are reading in the
"greys". Continue to read the dialogue until you have read the whole reel. Then, using
the aforementioned steps, continue onto the next dialogue reels.

METHOD ANALYSIS - TRANSFERRING DIALOGUE ONTO THE GREY SHEETS

After the actor's dialogue is read, broken down and printed on the soundtrack during the sound
reading process, it must then be transferred to a paper log and divided into feet and frames
which are called the "greys"
1. At some point after the dialogue (dial) of a sequence has been read, the Editor will
approach you requesting that the dialogue be transferred onto a "set of greys". The
greys are a paper representation of the film.
2. At the top blank space on the grey sheets print the abbreviation SEQ.(sequence) and
the sequence number. Also fill out the day's date, the person who sound-read the
dialogue, and the type of reading (close-up or word placement).
3. Estimate how long a sequence is (the Supervising Editor will show you how this
estimation is done) and number the grey sheets in the following manner. On the last, or
sixteenth frame, of each foot, number the appropriate footage number in the right hand
corner. Do this for each consecutive sheet until you have the required footage amount.
Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.5: Practice sound reading
In time, when you are used to the grey sheet's footage, you will be able to shorten the
numbering by only writing the first and last footage of each grey sheet page.
NOTE: There 6 frames in the shortest hold.

Exposure Sheet or x-sheet

animaticus.com

There are 16 frames in one footage 

There are 24 frames in one second 
Dialogue to be sound read  

soma‐blogs2.cofa.unsw.edu.au

4. With the numbered pages, return to the editing bench and place the pad to the right of
the synchronizer.
5. Frame one of the gang should now match up with the corresponding frame on the
greys.
6. Follow the counter on the synchronizer while writing the sound reading information from
each frame of mag onto the corresponding frame of the grey sheets. Once the first
sixteen frames have been read, the footage counter should read '1' and its onto the next
sixteen frames.
7. Always be attentive to the exact reading on the footage counter. Often, the counter can
be misread, resulting in a wrong transfer onto the greys. A wrong footage reading can
be aggravating when you consider that the pages and pages of greys are now useless
and need to be retransferred.
8. Along with the transfer of close up reading onto the greys, you should always print the
actual word being transferred to the left of the first frame of the word.
9. Leave enough room on the greys for more than one column of dialogue to be
transferred. Many times, two or even three characters will speak at one time.
10. When you are done transferring all the dialogue in the first reel, have your Supervising
Editor check the reel against the greys and, if all is correct, proceed with the next reel of
the sequence.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.5: Practice sound reading
Click this button to watch a video of Ms. Grace Maranan of Top Peg Animation Studio
regarding sound reading

A 2D digital animation software (Toon Boom) with 
dialog and correspond character  
www.digicelinc.com 

A 2D digital animation software (digicel) with sound  A 2D digital animation software (flash) with voice 
tracks and correspond character and other layers.  track. 
www.digicelinc.com 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.5: Draw a live model
 
Learning outcomes:
1. Draw a live model
Learning Activity:
1.1 Identify & prepare all necessary materials and equipment to be used according to the task to be
undertaken
1.2 Draw a live model

Equipment / Resources
• Drawing paper
• Drawing materials
• Masking tape

At the end of the activity you should be able to apply your previous know-how in life drawing
and drawing skills gift by copying a live model.

You are given four (4) hours to perform the activity.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 2.1.5: Identify mascot’s mouth chart in Toon Boom
 
Learning outcomes:
1. Identify mascot’s mouth chart in Toon Boom
Learning Activity:
1.1 Identify mascot’s mouth chart in Toon Boom

Equipment / Resources:
• PC installed with Toon Boom
• Voice track of the hotdog mascot
• Drawing materials for sketching
• Toon Boom Mouth Position (found below)
• Activity sheet

You can use Information Sheet 1.1.7 and Operation Sheet 2.1.1 as references.

You are given 30 minutes to answer the activity sheet

At the end of this activity you should be able to identify mascot mouth chart / lip chart using
Toon Boom.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Worksheet 2.1.5: Identify mascot’s mouth chart in Toon Boom
 
Table 1 (Activity sheet)
Toon Equivalent
Computed
Boom
Lip Synch Mouth
Frame Mouth
Mapping Chart Remarks
No Position
or Drawing
or
Phonemes (optional)
Viseme
1
2-6
7-9
10-15
16-18
19-20
21-22
23-24
25
26-27
28
29
30
31-38
39
40
41-49
50-53
54-55
56
57-76
68-73

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.6: Check for and implement slugging notes in x-sheet

Learning outcomes:
1.1 Check for and implement slugging notes in x-sheet
Learning Activity:
1.1 Check for slugging notes
1.2 Implement slugging notes

Activity 1.1 Check for slugging notes in x-sheet

What is slugging? (www.animationnation.com)

Slugging is the information on the exposure sheets, X-sheets, Dope sheets - whatever
you want to call. Usually that information (the Dope as called by Disney Studio / Annotation in
some 2D digital animation software) is written on the left side of the sheet in the action column
and is written by a sheet timer or director. It includes things like when and where the character
should do things, cuts, where camera moves should go etc. Slugging is done primarily in the
storyboard then to the x-sheet for finalization.
Slugging refers to the editorial process of laying in blank footage (slugs) between lines
of dialogue on a soundtrack, accounting for action between lines so that you can come up with
a continuous length of footage for individual scenes or the entire cartoon.

Slugging in the x‐sheet  Slugging in the storyboard.

(toonboom.com)  To slug a storyboard is to time
the cartoon on the storyboard. 
(johnkstuff.blogspot.com)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.6: Check for and implement slugging notes in x-sheet

Remember also that when you read a track onto an exposure sheet you are writing the
sounds down (the phonics), not the true spelling. So a line of dialogue like "Howdy YA'LL!"
may look something like

Hh
ow
D
E
ee
Yuh
aw
L
l

There again that gets back to the style thing! As for timing this stuff in feet and frames
just remember this...To get feet-frames from seconds just multiply the seconds by 24 and then
divide by 16. The whole number equals feet and the remainder equals frames.

Example: 53 seconds in feet-frames

53sec x 24fps = 1272
1272frames / 16frames per foot = 79feet 8 frames to go backwards...

79feet x 16frames per foot = 1264 frames

1264frames + 8frames =1272
1272 frames / 24frames per second = 53 seconds

To do the actual slugging of lines etc you need to use an audio editing program so you
can get the exact lengths of the dialogue edits.

Then you would edit the "slugs" in with white leader to create the master. This really
gets to the core of why slugging is important. If you have a set amount of time you need to
know how long the dialogue and open spaces are so you do not go over or under your allotted
time (especially on TV). All of the footage must total up to the correct time so you are neither
over nor under. With digital however, editing audio to the correct length is pretty easy because
it is non-linear. Problems with things like synching the track to the picture shouldn't even be an
issue.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.6: Check for and implement slugging notes in x-sheet

Slug: “says in pose” 

Some slugging pointed‐out against the dialogue (at right of the drawings) 
(frederatorblogs.com)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 2.1.6: Check for and implement slugging notes in x-sheet

Some meanings of x‐sheet symbols; not to confuse the animator or assistant animator with slugging. 
(minyos.its.rmit.edu.au)

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.6: Draw the mascot model in walk cycle
 
Learning outcomes:
1. Draw the mascot model in walk cycle
Learning Activity:
1.1 Draw the mascot model in walk cycle

Equipment / Resources
In this activity it is expected that you were provided with the equipment and materials your
group has identified in worksheet 2.1.3.

You are given four (8) hours to perform the activity.

At the end of this activity you should be able to draw the mascot model in walk cycle. You can
refer Information Sheet 2.1.4

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Work sheet 2.1.6: Identify & calculate how many breakdown/s and key drawings in the
given scenes of action
 
Learning outcomes:
1. Identify & calculate how many breakdown/s and key drawings in the given scenes of action
Learning Activity:
1.1 Identify & calculate how many breakdown/s and key drawings in the given scenes of action

Equipment / Resources
• PC with animation clips (scenes of action)
• Drawing materials (optional)

Instruction:
• Watch carefully the given animation clips (scenes of action) and analyze the action
• You are given the frames / drawings of each animation clip for your reference in this
work sheet.
• You can calculate, sketch and write over the drawings for your answers.
• Identify & calculate how many breakdown/s and key drawings in the given scenes of action.
• Write “straight-ahead action” if no breakdown/s in the animation.

Clip# 1

Clip# 2

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Work sheet 2.1.6: Identify & calculate how many breakdown/s and key drawings in the
given scenes of action
 
Clip# 3

Clip# 4

Clip# 5

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 2.1.7: Draw key drawings according to voice track
 
Learning outcomes:
1. Draw key drawings according to voice track
Learning Activity:
1.1 Draw key drawings according to voice track

Equipment / Resources
• Blank x-sheet
• Voice track / dialogue
• 2D traditional equipment and materials

Note: Exercise in 2D digital animation will be tackled later.

You are given four (8) hours to perform the activity.

At the end of this activity you should be able to use the x-sheet in calculating and
synchronization of your key drawings and voice track.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Work sheet 2.1.7: Identify & categorize production types and cost

Learning outcomes:
1. Identify & categorize production types and cost
Learning Activity:
1.1 Identify & categorize production types and cost

I – Essay (Five points each question):

1. Differentiate Anime and Walt Disney production in terms of its cost and quality.
2. Describe the difference of Motion Capture animation from Anime and Walt Disney
production.
3. Is it possible that the above mentioned types of animation can be fussed in one
production? If yes, why? If no, why?

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 3.1.1: Identify animation personnel

Learning outcomes:
1.1 Identify animation personnel
Learning Activity:
1.1 Identify animation personnel

Activity 1.1 Identify animation personnel (en.wikipedia.org, www.skillset.org, Draw Animation by Paul
Hardman)

Note: The number of personnel depends on the size and level of the animation studio. Below
enumerates the number of personnel in bigger animation studio.

Production Designer – responsible to the overall look of the production. He has key creative
roles in the creation of animation. Working directly with the director and producer, they must
select the settings and style to visually tell the story. `

www.jedfilms.net

Production Manager – Report to producer, supervises the budget, hires the crew, approves
purchase orders & time cards, and generally makes sure all departments are doing their
respective jobs within the parameters of the budget.

Animation Director - is the in charge of all aspects of the animation process during the
production of an animated segment for a production. This may include directing the character
design, background animation, sound track dialogue or lip sync, approve layout and any
changes in it, and any other aspect of animation.
 
 
 
Animation director F. A. 
  Skycat (Rear) instructs an 
  animator on a cartoon 
  production. 
  english.peopledaily.com.cn 
 
 

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 3.1.1: Identify animation personnel
Technical Director - is usually the most senior technical person within a theatrical
company/television/Animation studio. This person usually possesses the highest level of
competence in a specific technical field and may be recognized as an expert in that industry.
The technical director provides technical direction on business decisions and in the execution
of specific projects. He or she may be assigned to a single project, or may oversee a number
of projects with related technologies.

www.wkyc.com 

Layout Artist - plans the action of scenes and is likely to draw both the background and
character elements within a shot. To do this, they take information from the storyboard and
translate it into a format and size that can be utilized by the Animation and Camera
Departments. Experienced Layout Artists will plot the camera moves and give clear technical
instructions.

Storyboard artist / Animatics artist – uses the script and approved designs to make an
accurate comic book style visual of how the production will look within the timeline.

Voice actors/actress – record character voices. Often recorded on their own with a video
taken of their actions to help the animators with their poses and timing (in outsourcing
business sometimes the clients produce their own character voices).

Animator - provides the key poses of a scene, he is also responsible to ensure smoothness of
movement or timing. Like an actor, he sees to it that the action is always according to the x-
sheet.

Head of Clean-up Department / Clean-Up and In-Between Checker – Observe how clean-
up artists finalize, or "clean-up", the Animator's rough drawings, making sure that the
characters are drawn accurately and maintaining consistency of design, style, and line quality.
Its department is broken down into two parts, "Key Clean-Up" and "Character Clean-Up".

In-between artist or in-betweener – an assistant animator who draws the in-between

drawings vis-a-vis to specification of the x-sheet. He makes sure that the drawings are
consistent with the model sheet. Ascertain good line quality of the drawings.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 2
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 3.1.1: Identify animation personnel
Clean-up artist – an assistant animator assigned to clean-up the rough key drawings of the
animator and the rough IBs (in-between drawings). He has to painstakingly follow the model
sheets of the characters.

Musical scorer – composes melodies for the sound track. Often, the music has to describe
mood and the beats be synchronized with the action.

Sound effects artist – adds sound effects sound tracks as bangs and crashes are required in
the scene. These can be recorded in the studio, taken from a library of pre-recorded sounds or
recorded especially from an outside source.

Digital painting artist – uses painting techniques to create the digital painting directly on the
computer. All digital painting programs try to mimic the use of physical media through various
brushes and paint effects. This ability is very important in bridging the gap between traditional
and digital painting.

Compositing artist – edits and composes all the completed scenes, master sound track and
sound effects into a finished master copy. When this master copy is being approved by the
director and producer it is then ready for reproduction and distribution.

Visual Effects
Consultation

Chief Technical Director at

Bloom Animation in
Colorado, Ed is available for
freelance visual effects
consultation to the
inspirational community, as
well as others who can
benefit from the depth of his
expertise.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 3
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 3.1.1: Identify animation personnel

Compositing artist
I have tried with a style with depth, I
think it's because of that. The
rendering is really long, but, when I
make the render by elements, I can
render it (my new picture is made
like that, rendering on several pass,
by elements (character, ship1, ship
far, building near, building far....).

blenderartists.org

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 4
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 3.1.1: Fix or add more drawings to achieve smooth animation and
consistency of animated element
Learning outcomes:
1. Fix or add more drawings to achieve smooth animation and consistency of animated element
Learning Activity:
1.1 Identify the inconsistent drawings or eye irritating movement
1.2 Fix, redraw or add more drawings to achieve smooth animation
1.3 Fix or redraw inconsistent drawings of the animated element

Instruction:
1. Each group will scrutinize a set of drawings for an action (each group will organize a
team simulating animation production personnel) and write their comments in the
provided x- sheet regarding the movement of the animation derived from the given set
of drawings. Likewise, each team will also scrutinize the consistency of the animated
element/character (e.g. appearance, props, etc.)
2. Each group director will put slugging or instruction in the x-sheet basing on their
comment/s on the given set of drawings.
3. Each group animator will fix, redraw, or add drawings to produce a smooth animation.
4. Each group assistant animator will fix or redraw inconsistent drawings based on the
deficiencies found by the group.
5. Each group will reverse the role playing of the members so that the work of the group
will be reviewed without bias.
6. Each group will agree for the final and complete set of drawings to produce.

Equipment / Resources
• Series of drawings
• Animation clip (from the given set of drawings)
• Blank x-sheet
• Model sheet of the animated element/character
• Drawing materials and equipment

You are given 8 hours to accomplish the task.

After the activity, your group is expected to able to identify inconsistent drawings and
eye-irritating movements of the animated element/character. Fix, redraw or add more drawings to
achieve smooth animation. Fix or redraw inconsistent drawings of the animated element.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Information Sheet 3.1.2: Arrange & stack completed drawing according to company’s
procedure
Learning outcomes:
1.1 Arrange & stack completed drawing according to company’s
Learning Activity:
1.1 Arrange & stack completed drawing according to company’s

Activity 1.1 Label and check markings of each drawing (en.wikipedia.org)

Note: The procedures and standard of labeling of drawings may vary depending upon the
animation studio yet; generally it contains common practices.

• The assistant animators must finish a scene and package it for the next department.
• They make sure all drawings are exposed on the camera exposure sheet (x-sheet) and
are written in lead pencil.
• Check all drawings against x-sheet
• Make sure all drawings are labeled with scene and sequence number. All drawings
must have artist's name on upper right-hand corner.
• All drawings must have a number in lower right-hand corner, written with lead pencil.
• All drawings must have reinforcements.
• Blue sketch duplicate background must be in scene and labeled with scene and
sequence number.
• All drawings must be neatly stacked and arranged in order shown above, lowest
number on the bottom.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 3.1.2: Check & secure completed drawings

Learning outcomes:
1. Check & secure completed drawings
Learning Activity:
1.1 Check & secure completed drawings

Instruction:
1. After each group has agreed to the final and complete set of drawings, the group will fix
and finalize each drawing then label and mark each again accurately according to the
sequence of the animation.
2. Completed drawings will be kept in an animator’s folder in apple pie arrangement with
correct number of scene sequence, production name, and name of the animator.
3. Use bull clip to make sure that the arrangement intact.

Equipment / Resources
• Drawing materials and equipment
• Blank x-sheet
• Model sheet of the animated element/character
• Animator’s folder
• Bull clip

You are given 8 hours to accomplish the task.

After the activity, your group is expected to able to check & secure completed drawings.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao

 
Job sheet 3.1.3: Arrange & stack completed drawing according to company’s procedure

Learning outcomes:
1. Arrange & stack completed drawing according to company’s procedure
Learning Activity:
1.1 Arrange & stack completed drawing according to company’s procedure

Instruction:
1. After each group has organized final and completed set of drawings in the animator’s
folder, for the last time it will be checked again, rearranged if necessary and stack
according to company’s procedure. (please refer Information Sheet 3.1.2 as sample of a
company’s procedure).

Equipment / Resources
• Drawing materials and equipment
• X-sheet filled-in with slugging by the group
• Model sheet of the animated element/character
• Animator’s folder
• Bull clip
• Rubber bands
• Card board

You are given 8 hours to accomplish the task.

After the activity, your group is expected to able to arrange & stack completed drawing
according to company’s procedure.

Code No. Produce Key Drawings for Animation Date: Developed Date: Revised Page #
Assigned topic of Mario “Yong” dela Cerna April 27, 2010 1
ICT 313316
TESDA RTC - KorPhil Davao