Mr. Jamie Leduc's profile

Character Animation Unit - Animation Course

Cover:
-Reflect theme of Course
-Art Cover image 404 X 316
-Text "Character Animation Unit "
 
Settings:
Creative Fields:
-Apply 3 project theme-related  "Creative Fields"
 
Tags:
- 15 theme generated tags (use key concepts)
 
Project Description:
- "this is my character animation portfolio"
 
Extra Information:
-Brand: Animation and SislerIDM
-Agency: Winnipeg School Division
-School: Sisler High School
 
Credits:
-Add the cast and crew with roles
 
Tools Used:
-Identify all tools used in this unit:  Adobe Flash CS6, Adobe Audition CS6, Behance, paper, pencils, light-table
 
Content:
-Embed all Unit components 
-Title each activity
-Use the portfolio Text styles appropriately

Activities:

               Lip Sync Activity
             Walk Cycle Activity
             Rotoscope Activity
             Cel Shading Animation Activity
             Moving & Cameras Activity

Lip sync, lip-sync, lip-synch (short for lip synchronization) is a technical term for matching lip movements with sung or spoken vocals. The term can refer to any of a number of different techniques and processes, in the context of live performances and recordings.  Matching dialogue to a character’s mouth in order to create the illusion of speech is known as lip-syncing. This effort often consumes more time than any other animation task because you need to make adjustments on nearly every frame. In fact, lip-syncing short animations (even only 1–2 minutes long) can involve hours of tedious labor.

This article explains how to make lip-syncing in Adobe Flash Professional CS5 as painless as possible by utilizing the SmartMouth extension to automatically analyze audio content and assign corresponding mouth shapes. That’s right: you can sit back and relax your hands, back, neck, and eyes while SmartMouth processes the audio in the time that it takes the audio to play back, and then matches each frame using a speech algorithm. You’ll also learn how use the free FrameSync extension to quickly make manual adjustments and tweaks to your character animation.

Introduction to lip-syncing in Flash
The basic unit of speech is known as a phoneme. The mouth shape and facial contortions that correspond to phonemes are known as visemes. Animators generally refer to phonemes and visemes interchangeably, even though they are technically different concepts. The standard set of about seven phonemes/visemes (mouth shapes)—not including a closed mouth—are sufficient to create the illusion of speech on an animated character. The SmartMouth Flash extension includes a sample set of those shapes.

This small set of phonemes corresponds to a wide array of spoken sounds. The full range of sounds that are covered by this small set of mouth shapes are listed in Table 1.

Animation elements for successful lip syncing:

- Body language (eyes, eye broughs, gestures, body positioning)
- Dialoque
- Tracking audio wave frequency and matching mouth symbols
Tips:  keep it simple, elaborate, restrained and exaggerated



Warm Up Activity - Developing Reference and Getting into Character:

In groups of 3, research the assigned provided characters.  Identify & record the 2-3 famous "sayings" by your character.  Each student will voice act as the assigned character and record (using a smart device or laptop) the warm up activity. Post reference video to Behance under an Activity 1 Title.  Using the caption feature, record the following info:
    - Character name
    - the saying
    - phonetic breakdown

Character Lines:

A - Sponge Bob
B - Mickey Mouse
C - Bart Simpson
D - Daffy Duck
E - Arthur
F - Bugs Bunny
G - Charlie Brown
H - Scooby Doo
I -  Minnie Mouse
J -  Fred Flintstone
K - D W
L - Porky Pig
M - 1960s Batman
N - Shaggy
O - Ariel

 
Part 1:

Task:
-  Set up rulers as directed
-  split stage into front & SIde Profile
-  Label front & Side Profiles
-  Identify quote under bottom ruler
-  write out 2-3 second script 
-  RecORD 2-3 second script
-  Create 10-16 mouth instances symbols
-  create 3-6 eye instances symbols
-  Animate lip sync on both front & side profiles
THEME:
-  An animated Halloween

- Using a sound recording program (Audacity, Audition, Sound Recorder or Pro Tools) record a character sound bite.  The recording must be at least 5 seconds in length.   Students could use a sound clip online,   Keep the speech clip school appropriate.  
- Import sound clip into the Flash Library.
- Create a new layer titled "Mouth,"  This layer should be above your character layer(s).
- Create 10 (9 sounds plus a closed mouth) Lip Sync instances for both Front and side characters.  Convert each to a "graphic" symbol.  Name each symbol the sound they represent.
- Create a new layer titled "eyes."  This layer should be above your character layer(s).
- Create at least 3 eye instances and convert each to a "graphic" symbol.  Name each symbol the position they represent (i.e., Open, squinting, etc).

Part 2:
- Use the step by step instructions in the presentation below (except the document set up).
Part 3:

Saving:
Save as: firstname_LipSync.fla
Export as:  firstname_ LipSync.mov
Export as:  firstname_LipSync.swf

Posting:
Now upload your  video to your Behance Account/Unit 1 Project

Be sure to:
Title the videos “Activity - lip sync ”
describe each video as:
Character Animation Unit, Lip Sync Activity 
lip sync
Animation properties (frames and fps)
add 3-5 tags
Teacher Tutorials:
In animation, a walk cycle is a series of frames or illustrations drawn in sequence that loop to create an animation of a walking character. The walk cycle is looped over and over, thus having to avoid animating each step again.
 
Walk cycles can be broken up into 4 key frames, namely Forward Contact Point, Passing Pose1, Back Contact Point and Passing Pose 2. Frames that are drawn between these key poses (traditionally known as in-betweens/Inbetweening) are either hand-drawn or using computer software to interpolate them.  Besides the apparent move of the legs, many more details are necessary for a convincing walk cycle, like animation timing, movement of the arms, head and torsion of the whole body.    - wikipedia
Part 1 - Walk Cycle
- create a new A3 document with a stage properties of 1080 pixels (w) by 720 pixels (h) @ 24 fps
- create a full walk-cycle using your activity 3 character or a new paint brushed character
        - character will move "x, Y" position, 
        - must demonstrate the following ports: 
- Read pages 147-152 of the "How to cheat in Flash" on-line resource,
- Research and post reference images on a "ref" layer
- create a 2-3 second animation @ 24 fps
- create a new rough character "movie-clip symbol" and add your character symbol (or multiple layers for a new character) in library and place on layer 2 of timeline.  Be sure to jot down the walk cycle state on each frame (i.e., contact, passing, up and down"
- create a new final character "movie-clip symbol" and add your character symbol (or multiple layers for a new character) in library and place on layer 3 of timeline. 
- Save, export and post on Behance
Part 2 - Run Cycle
- create a new A3 document with a stage properties of 1080 pixels (w) by 720 pixels (h) @ 24 fps
- 3 second animation
- Animate on the 6s
- Use Reference
- Create 3 different background layers.  Move at different speeds 
- Create 1 overlay layer (i.e., Street posts)
- Add a Perspective shadow
           - Read pages 97-101 of the "How to cheat in Flash" on-line resource,
           - create a new shadow level
           - apply a shadow to the character throughout the entire animation
- Reference (uploaded or links to video to behance)
- Background movement of choice (X,Y or move across)
- Save, export and post on Behance

Part 3 - Walk to Run back to Walk
- create a new A3 document with a stage properties of 1080 pixels (w) by 720 pixels (h) @ 24 fps
- Box character (3Dish)
- 5 second animation
      1 second walk (start off screen, walk to first-third)
      2 second run (explode into run & slow into walk)
      2 second walk (walk off the screen)
- simple moving back for run
- Reference (uploaded or links to video to behance)
- Background movement of choice (X,Y or move across)
- Save, export and post on Behance
Rotoscoping is an animation technique used by animators to trace over motion picture footage, frame by frame, when realistic action is required. Originally, photographed live-action movie images were projected onto a glass panel and re-drawn by an animator. This projection equipment is referred to as a rotoscope, developed by Polish-American animator Max Fleischer. Although this device was eventually replaced by computers, the process is still referred to as rotoscoping.

In the visual effects industry, rotoscoping is the technique of manually creating a matte for an element on a live-action plate so it may be composited over another background. - wikipedia

Part 1:
1. Students are to film a 4 second (landscape format) video of a human body in action.  Upload video to computer and convert to FLV format using Adobe media Encoder.
2. Animation properties:  1080 p X 720 p @ 24 fps
3. Students are to import FLV video into library and embed into a new flash layer.  Do not use player mode. Lock layer once embedded.
4. Add a light grey rectangle (alpha of atlas 80%).  Lock layer.
5. Rotoscope the contour of the human body in motion on a new layer.  Animate on the twos (ones if necessary).
6. Fill each character with one of the non-solid colour fill (create bitmap in photoshop, or linear gradient or radial gradient).  Consider using alpha.
7. Rotoscope any background (new layer).  Fill each object with one of the non-solid colour fill (create bitmap in photoshop, or linear gradient or radial gradient).  Consider using alpha.
8. Save as: firstlastname_activityname.fla
9. Export as:  firstlastname_activityname.swf
10. Export as: firstlastname_activityname.mov

Part 2:
ROTOSC

1. Upload video to Behance under an Activity Name TItle (Header)
2. Word-process a description of the skills explored in the activity and post under animated video
In this activity, students will learn about:
- apply simplicity yet powerful animation techniques to character design,
- create a 3D illusion in a 2D animation (2.5 D animation technique)
- applying spatial relationships between objects through skewing and scaling 
Part 1:
1. Students are to add celshading to their rotoscope activity..
2.  
3. Save as: firstlastname_activityname.fla
4. Export as:  firstlastname_activityname.swf
5. Export as: firstlastname_activityname.mov

Part 2:
1. Upload video to Behance under an Activity Name TItle (Header)
2. Word-process a description of the skills explored in the activity and post under animated video
templates 
Character Animation Unit - Animation Course
Published:

Character Animation Unit - Animation Course

Character Animation Unit, Sisler High School Grade 11 Animation course

Published: