Embedded Files
Welcome to Animation 11
Instructor email address:
T Linburg: Telinburg@sd43.bc.ca
Wacom driver install / MediBang drawing utility (ignore C ++ option!) Inuos 2015 driver / Wacom One Creative Pen Display
Our key focus in this class is learning the essential skills and techniques required to be a successful animator. Some of the skills that we will be developing include; 2 D sketching, computer drawing, pose to pose animation, motion / shape tweening, soundtracks, voice overs and learning techniques to add 'realism' to your movement cycles. Remember this...."The difference between good animators and great animators lies in the ability to identify and incorporate subtle realism in movement"
The approach for this course will be:
We'll start by developing a comprehensive 'animators tool kit' to allow us to bring our creative ideas to life. Some of the skills covered include tweening, layering, creating moving backgrounds, a study of 'realism', walk cycles, timings (on the two's), sound effects, dope sheets and lip syncing your characters with your story scripts.
Once we have gained some specific animation competencies, we will unleash your full creative talents in more lengthy animation scenes. Students will have access to drawing tablets and will have a specific subscription to Adobe software. We'll also have to figure out software install and how we'll use the tablets for both in class and for remote learning.
Please ensure you have access to my cloud animation resource files.
Drop Box - Animation 11 - (spreadsheet only)
Create a one Drive share link - create an 'on line' spreadsheet for sharing course assignments
Create and Share links in ONE drive - A 'how to' guide
Example - T Linburg - (using Google Sheets - but you could use your Microsoft version of Excel)
T Linburg - grade and assessment link spreadsheet (adjust the share permissions to allow Mr. Linburg to edit)
Instructions:
Download an excel version
Rename the file "Last Name / First Name" - Animation 11 - Block 2
Drop this spreadsheet into the hand in box and then add in One Drive Share links as you complete course assignments.
It is YOUR responsibility to keep this spreadsheet updated as you complete assignments
Please make share links that can be opened JUST by Mr. linburg ONLY.(to find me for sharing - start typing in tel... (and my name should pop up!)
Intro to animation - tell us about your journey...
Tell me about your interest in Animation?
Do you have a background with drawing? Do you animate for fun?
Tell us about the three most treasured animation productions!
(Share clip links – and describe your response in terms of story line – animation techniques incorporated – eg Claymation…)
Assignment # 7 (optional - extending)- Rotoscoping in Animate cc (Complete one)
In our next course segment we will create a 'TRACED' animation SEQUENCE based on a VERY SHORT imported video clip. You should select the clip based on a few specific criteria: it is very short (or can be clipped) AND it represents an action that is very difficult to draw and sketch freehand. Some examples might include a glass smashing on the floor, water pouring into a cup, a sports player executing a unique move.
What is rotoscoping you might ask? Read this link to learn more / another informative link
Rotoscoping allows the creator to trace out a sequence with a piece of source footage. The techique is old but it still has an important role in modern animation work.
Please locate a suitable (short clip 3 to 5 seconds) that you will use for your rotoscoping project. When you have imported this clip you will use this as the basis for creating an animation based on video "realism". Start with a basic clip without too much movement to start! A good choice would be a clip that you would have a difficult time animating yourself. Some good examples might include; a complex facial expression, a dancer's spin, a car crash or an animal leaping.
Resources
Assignment # 6 - Story Telling within an Animation Context
Semester Portfolio Project Feature Presentation
Introduction
Time for your creativity to shine and showcase your growing animation skills. The next course activity will be a feature length portfolio production. Tell us a story....
Here is some great story tell advice from Pixar studios - " telling a story" without words"....
Would you like to upgrade your tool suite for drawing and background sketch work? Then please try Adobe Fresco - a dramatic improvement in drawing tip and painting brush options. You can also easily stylize your projects to give your work a specific 'look and feel'.
Adobe Fresco - intro 'how to' video guide
Instructions
Part A - Learning How to Tell Great Stories (Animation with Suspense or Comedic Elements) (Read / Explore)
In this next project you are asked to create a project with a collection of characters (the number of which is up to you) that tells a clear story about one of the characters. It could be either fiction or non fiction but the story telling component is key. You are asked to incorporate at least FOUR of the animation techniques discussed in the course to date AND incorporate at least FOUR of the 12 principles of animation that we dealt with previously. Here are a few strategies for adding suspense and story interest into our animation work.
Please read and study the following links (Read / Reflect / Respond)
'Masterclass' - Adding an element of suspense in story writing / drama to your animation (same link as below)
Now take one of the following scenarios and turn the 'mundane into a moment of great suspense.
A Quick Exercise to Write a Suspenseful Scene or Short Story (1/2 page 12 Font)
A Quick Exercise to Write a Suspenseful Scene or Short Story (1/2 page 12 Font)
Choose a mundane moment from the list below or from a real life event:
A spider crawling up his web
A child coming out of school
Two people sitting in a car at a stop light
A teenager setting up a tent
A group of men going into a stadium
A woman eating alone in a restaurant
A boy rolls a ball onto the street
A student stuffs a notebook into his backpack
or....make up your own one....:)
Now, write a full page (exactly a page...no more...no less) and turn your everyday "mundane" scene into a suspenseful moment or series of suspensful moments. You have one page only, so if there’s something your reader needs to know in order for things to make sense, find clever ways to blend that information into the narrative. (no preamble - or stage setting)
Adding Comedic Elements to Your Animation Project Work (Read Only!)
Seven Tips for Adding comedic elements to your story telling / The Art of Funny Story Writing (plus 28 story ideas) - Scroll down to the bottom of this page which discusses the 'Art of Writing a Funny Scene' / How to Add Comedic elements in Animation (adding in the unexpected / How to Write a Joke - Jerry Seinfeld New York Times (non animation) / The Skill of Humour (TED talk)
How to incorporate humor into your story telling scripts (some common techniques) / 55 'Funny' Story starters
Part B - Applying our story telling abilities towards the Animation Genre...
Still needing some further 'animation story inspiration'? Perhaps you might want to plug in the headphones and see what else is out there in the animation universe!
Award Winning Animation 'shorts' (examples)
Award Winning Animation Shorts
More 'award winning' animation efforts (some are comedy / some thematic / while others don't fit any narrow category)
Drama / Comedy
Mandrake / "The Exortwist" / / Noon / Playing cards (detective mystery) / The Tree (story of renewal)
Comedy Examples
Fat / The 'Bank Heist' - pencil sketch / Un Sacre Mariage!" / The Emperor's New Groove /
Your Animation project Criteria
Create a 20 sec + animation project (approx. but depends on your project ideas) / incorporate primary and secondary animations / sound / tweening / frame by frame / hand drawn backgrounds (at least TWO) / use of a walking character (humanoid or even animal).../ / use of camera tools / adjusted perspectives (not just side on views) / compelling story line - use common story tell approaches (adding suspense / drama / unusual yet believable series of events ...
Here is a 'Story Boarding' link to organize and plan your animation production (signup required)
Resources (Drawing only)
Yes we can all draw (TED talk) - don't believe your 'inner voice'
Perspective drawing basics / one point perspective drawing / learn to draw for beginners / how to draw faces (front view)
Novel and Original Animation Work
The Thomas Beale Cipher (novel use of layer masking and cuts outs - paper collage styling) / Late Afternoon (memories) / Accounting for Days (monochromatic / introspective) / Icebound (adventure - monochromatic pencil sketch) / Afternoon class (comedy) / Wind (comedy) / Cloudy (comedy) /
Assignment # 5 Lip Sync A beginner's guide
Due:
In the next course segment, we will taking character development to the 'next level'; talking characters, voice scripts and character voice. Voice or mouth positions allow us to put a voice to a character. This essential animation skill allows us to construct scenes and stories that are more relatable and dynamic. In order to accomplish this do, we need to learn some of the tradecraft around mouth positions, visimes, lip movements and tone of voice. This segment will follow a familiar path: tutorial, practice, and then generalize. As is the case with most creative endevours, we must "copy / replicate / innovate and finally originate".
Part I - Explore (auto) lip sync with a seagull or an Owl (just use the practice set)
Base your first sketch on either the Owl or the Seagull. Please create your own mouth positions for a collection of sounds. You should have 12 mouth positions for the various sounds. Be sure you make a chart or a map outlining how many mouth positions and the sounds they will represent.
Steps:
Draw all the mouth shapes you need for your character. (your visemes versus phonemes)
Convert each one to a Graphic Symbol.
Auto Lip Sync references from this master mouth pose.
Align each one so it's centered on the stage.
Import your audio to a new layer and set it to Stream.
Lip sync explained in great detail here
Look at ONE of the following projects and see if you can use them as a guide for your own character idea. The Seagull example is downloadable. You can work with and perhaps even modify the practice set for learning purposes (You are NOT required to submit this part for course credit!)
Sample # 1 - Seagull - View finished project - use as a base for your seagull. Do not copy the visemes
In our first example, you are offered a completed rendition. You are to use that for "illustrative purposes" only. You may base your rendition on this base sketch.
Sample # 2 - Owl - you will need to create the various mouth positions
Lip sync - talking owl example (This sample only has the master mouth position outlined only) You will have to compose the rest of them.
(*) Note: PLEASE compose your character(s) from a face on / or slightly angled perspective.
Part II - Write and perform your own Animation Voice over...
In this follow up exercise you are asked to create a drawn character of your own and then use your phone to make a "voice memo" (iphone) "record your voice" (android) to record your voice saying a couple of sentences "in character". You may use my quiet office to do your voice recording. In this section, we are not looking for anything too complex, just a drawn character, the various mouth positions (phonemes) and a second practice with a voice recording (this time yours). I would suggest that you write out a script (funny / tell jokes / tell a interesting story?) and to rehearse your script as we don't want a collection of (umms and ahhhs).
Something new....
Part III - Putting it All together!
In this segment, you will be creating a character that will match your Animation Voice over. You will need to draw the character (static) and then create the various GRAPHIC symbol mouth positions as described in Part I. You should use all of the '12 slots' available for mouth position art work. Once done, you should put it all together with the voice over, the talking character and a plausible background or setting for the animation. You may use an "AI" generated 'voice over' for your script OR you may record yourself as described above. Try to make your script either funny or 'dramatic' as this will be our focus for the next course segment!
Steps to creating a Lip Sync
Prepare Mouth Shapes:
1) Create a Graphic Symbol for the mouth (e.g., mouthSymbol).
Inside the symbol, draw each mouth shape (viseme) on separate frames. Common shapes include:
A (closed mouth)
B (MBP sounds)
C (FV)
D (L)
E (wide E)
F (O)
G (U)
H (rest)
Label each frame with a name like A, B, etc., using frame labels.
2) Set Up the Timeline
Place the Mouth Symbol on the Timeline:
Add it to its own layer.
Make it a Graphic Symbol, not a Movie Clip.
Record/Import Audio:
Use a clean voiceover recording.
Import it by going to File > Import > Import to Library, then drag it onto the timeline.
Select 'auto lip sync' - and it should do the rest!
Module #4 Walk Cycles - Creation and use of Movie Clips
Introduction
Creating characters that move, jump, walk and run is one of the most important skills that all animator need to know. How a character moves in 'space and time' provides important clues into that character's mood, physical health and overall mass. As well all know, animation artwork is complex and time consuming to generate, therefore, it is critical that we draw 'walk cycles' in such a way that they convey essential insights into the character's personality, attitude and motivations. For example, a character with a lumbering stride and a slouched posture might speak to their lack of confidence or poor health. Conversly, a character with an arched back and a quickened pace might speak to their pride, sense of purpose and confidence.
Keep in mind that we like to create characters of all shapes and sizes as this reflects the world that we live in; diverse and complex.
So how do we accomplish this?
As animators we essentially have a few approaches to choose from; classic 'frame by frame' (draw main poses followed by the in-betweens) OR inverse kinesthetics. With this second approach, 'body parts' are drawn on separate layers and then they are connected together at the joints by the 'bone tool'. This tool connects drawn objects together like a doll or a maroinette with moveable joints. This link discusses everything you need to know about drawing and utilizing the 'bone tool' in Animate CC.
Both methods have their pros and cons and offer trade offs between high quality drawings and technical skill. Since walk cycles are time consuming, we prefer to make them as movie clips so that they can be stored and reused in future scene's and animation productions. When possible, we want to recycle are artwork and our character movement cycles to cut down on production time.
Two ways to create a movement cycle:
The 'bone tool' (inverse kinematics) Create a Walk cycle with armature / How to use (hand example) / (related) Place each body part on its own layer and use motion tweens See this example / Bone Tool example
Frame by frame modifications An example of using this technique
Background links and Information
General information about 'walk cycles' - please watch video before proceeding.
Using the bone tool to help with movement and bone structure
Make a movie clip / 'Classic' frame by frame animation / camera tool
We will now be learning about 'frame by frame' and how to build a sequence within the context of a movie clip. Mastering these skills will allow you to create unique and original animations and how to "reuse" them as a part of your symbol library in Animate CC.
Different ways to create a walk cycle...
How to make a walk cycle method # 1 (using different layers)
A) Movie Clip practice set - (practice) This practice set is actually a completed example of a Movie Clip. You are simply asked to experiment with the files and make some alterations to the timeline and the art work. This is intended for practice only and you are not required to submit this work. Please practice so you understand the process.
B) Walk Cycle Part I - Intro. Classic 'frame by frame' AS a Movie Clip walk cycle (activate onion skin 'mode' to assist you) - (Make a walk cycle Movie clip)
Animation Walking Assignment
In this next segment, you are asked to create a walk cycle with all the various components (i.e. contact, recoil, passing, highpoint etc. - see illustration below) in the form of a MOVIE clip. Your walking character sketch should:
Have a 'run time' of at least five seconds (or put it on a 'loop mode' to make the walk look continuous) / simple walk cycle outline / simple pencil sketch type background to help with perspective (see video for example) / no colour or intense detail required.
A Movie clip (see above for explanation) lasting longer than 5 seconds
Use of "perspective" that is NOT a straight side view but rather it could be from behind or above or viewed from a slight angle
Add in some personality into the walk cycle. For example one might get the character to skip or to slouch. Try to add a bit of 'personality' to the movement.
Experiment with camera angles with pan and zoom
How a character moves through space says a lot about their personality or state of mind
There is of course more to this topic than simply the position of the arms and the legs. One can infer much about the character about the WAY that they move. If they are slouched forward then perhaps the character is sad, or if they walk with a confident strike with their back tilted slightly back, then one might suggest that the character is happy. In addition, our example here is a from a 'side' profile whereas one might also consider showing the character or scene construction from the FRONT or ABOVE. You are not expected to do this for this assignment but it is an important concept to be aware of.
C) Camera tool add on feature - (how to use the camera tools )
When you are finished your movie clip then please click on the camera tool to focus or pan the scene to add a more specific focus to your production. If you can't see the camera tool on your screen then be sure to select the bread crumbs to add it to your tool suite.
Resource Section
Step by Step - Adding 'Shape Hint'
1. Setting up the Shape Tween:
Create your shapes:
Draw the shapes that will be tweened in the first and last keyframes of your timeline.Insert a blank keyframe:
Select the frame where you want the second shape to appear and choose Insert > Timeline > Blank Keyframe (or press F7).Create the shape tween:
Select the frames between the two keyframes, then choose Insert > Shape Tween.
2. Adding Shape Hints:
Select the first keyframe:
Choose the first keyframe of your shape tween.Add the first hint:
Go to Modify > Shape > Add Shape Hint (or press Ctrl+Shift+H). A red circle with the letter "a" will appear.Position the hint:
Drag the shape hint to the point on the shape in the first keyframe that you want to correspond to a point in the second keyframe.Repeat for the last keyframe:
Select the last keyframe and add a corresponding shape hint (also with the letter "a"). Position this hint on the point in the second shape that corresponds to the first point.Add more hints (if needed):
Repeat the process to add more shape hints (labeled "b", "c", etc.) to both keyframes, marking additional points on the shapes.
3. Refining the Tween:
Preview the animation: Play the animation to see how the shape tween is progressing.
Adjust the hints: Move the shape hints on both keyframes to fine-tune the tweening and achieve the desired transformation.
Consider snapping: Enable "Snap to Objects" in the View menu to make it easier to position hints on specific points.
How to make a Frame by Frame Animation (explainer) / working with symbols (graphic or movie clip explainer) - video
Other NON walk cycle examples of frame by frame animation: Example one (*) Example two (a head with facial expression
Examples of a walk cycle in animation / example # 2 / 100 Days of 'walk cycles'
Module # 3 - "Timing is Everything" - Animation's Supporting Cast...
We will now turn our attention to the interplay between primary and secondary animations and learn about new ways to imagine a scene.
Part A - Make a Shape Tween (practice) - Essential for 'realism' ('right click' on frame one of your animation sequence to make one!)
Introduction
Shape Tweens - What are they? And what are their importance to the art of animation...
Make a Shape Tween (in frame one make one shape and have it 'morph' into another) - Instructions
Try to make a few of these - start with shape A and then have it 'morph into another object. You can use basic polygons for this task.
Part B - Make a short production that incorporates 'Shape Tweening'
Option 1 - Create an 'artsy' candle with a flickering candle and glow effect
Lit match with glow effect (written instruction set) / Great video with candle and glow effect
Option 2 - create a scene with a primary animation with a 'supporting cast of secondary animations'
Create a scene (eg an aquarium) or a person walking in the park and add in other changing objects and shapes in the background. For example, a crab (the focus of the stage) is scurring along in the sand meanwhile there are an ensemble of fish darting in and out of the sceen. Or in the case of the person walking in the park, the trees sway overhead, the clouds move from point A to point B changing shape as they go.
Module # 2 - The 12 Principles of Animation Due: Friday April 4th
12 Principles of Animation /12 Principles of animation described (playback link) / more 12 principle examples
Instructions - VERY Simple outline sketches using Classic "Frame by Frame" animation
Help guide # 1 (Adobe) / Video explaining classic frame by frame
Summary of the task:
Take a look at this example - (Vimeo - The illusion of life!)
Put each of the 12 principles of animation on different timelines or perhaps combine a few of them.
Label the layer or the stage letting us know what we are actually looking at
Draw a sketch and then select the onion skin mode. Decide if you're going to animate on the "2's" or on the "3's". However, sometimes 'chunky animations' can be effective if that is your intension and stylistic choice. Move and redraw the sketch into the new frames. Keep your sketches simple so as to reduce the amount of work you need to do. I would suggest slowing the frame speed down to say 10 frames per second to really showcase the movements.
You may use any animation technique (motion tweens or shape tweens - assignment # 3 or frame by frame)
Please read /view about the 12 principles of animation. These 12 principles of animation are a key aspect of the 'animator's tool kit'. We will be creating a short animation production in animate CC, using ONLY outlines and sketches to demonstrate the 12 principles of animation. You could incorporate stick people or cubes or facial outlines to demonstrate the concepts; either sequentially or in combination. Please just illustrate the concept in as simple and as a crisp format as possible. In other words, you don't need to add any backgrounds or other non essential animations.
(*) Please add titles to (use the T tool) the animation to help me see where each specific animation element is situated in the picture. Otherwise its very difficult for me to see specific segments in a short production!
Frame by Frame Animation Explained
Classic frame by frame (using onion skin) - make a rough sketch of your own and change its look over a few frames
Other Animation related resources
frame-by-frame animation with use of onion skinning / shape tweening / Camera tool
Add motion path refinements explained / free sound effects (with sign up
Animation basic concepts / outstanding link explaining key concepts in animation
All about sound Animate CC - how to synchronize sound effects and timings
Edit sound clips part II / Use of the camera tools for animation / Art and drawing lessons for specific scenes and situations
Module # 1 - Introduction to Animation essentials (Part I) (#1)
Due Date: February 21st (Bouncing 'Object') TWO files in total!
In our first look at animation style and techniques, we will be using Animate to create a ball bouncing sequence. This will allow us to start to learn more about the Animate software and how one opens and creates a basic animation project (please see PDF attachment below for further assignment details.
Here is the PDF outlining our first assignment / a set of how to instructions
Examples of this style of animation / Squash and Stretch in animation
Animate CC - program essentials (adjust the canvas rotate etc...)
Concepts covered:
Layering, creating objects, filling objects, creating backgrounds, tweening, movement on the ' two's ', a case study of 'natural' movement, introduction to sound effects library, drawing with a tablet, tracing objects in Animate CC.
A 'natural' bouncing movement trajectory. As animation is, in effect, a study of "realism" we need to understand in great detail how objects actually move in space and time. In this example, we can see that the ball not only does a "squish and a stretch" but the object also moves at different rates in different speeds depending on the location of the object in the "arc". As the ball drops to the ground, the ball picks up speed while the reverse is true on the return. The final bounce is of course lower until the ball rolls to a stop
To add in 'easing' to your project please select this link - This allows for very subtle but important motion trajectories that allow for changes due to effects of gravity and object spin and movements.
To export your finished project as an MP 4 file - you will need to use H264 format and then use the video 'media encoder' to get the correct output!
Adding sound to your project: (do at the end)
In order to add sound to the project please take a look at these instructions / Edit sound clips part II / free sound clips / my library of sound clips
Adobe's Official Animate sound site resource
All about sound Animate CC - how to synchronize sound effects and timings
You can use Audacity to adjust the sound properties:
Select the desired track in the Timeline.
Navigate to Effect > Amplify.
From the new window, set the New Peak Amplitude to -3.0 db. This will increase the track volume to an ideal level.
Ensure “Allow Clipping” is un-checked to prevent peaking and click OK.
Animate CC - workarounds
1) To get Sound to work on Animate CC please do the following:
Open up Adobe "Audition" - import sound file / Save As - change to 44100Hz playback of 16 bits - MP3 format - then import into Adobe Animate
Assignment # 1 A - Drawing Essentials - Your digital doodles....Due: March 14th 2025
(fill your digital sketch book with the fanciful, the frightful, the fun... :) - at least 10 sketches
For today we'll be using the open source drawing software Krita or Adobe Fresco!
Yes we can all draw (TED talk) - don't believe your 'inner voice'
Perspective drawing basics / one point perspective drawing / learn to draw for beginners / how to draw faces (front view)
Instructions for making characters and faces (use Paint 3 D)
Using the above links try your hand at a drawing a scene with different perspectives or sketch out some expressive faces or animals. Use the link as a guide. This is a 'no pressure' assignment....just let your creative mind take over and do the 'unexpected'.....You are encouraged to do your sketched using Adobe Fresco. Adobe Fresco is excellent for offering a greater variety of textures / painting tools / watercolour brushes and so much more. One can use Adobe Fresco seamlessly with Adobe Animate. For example, one might create a background in Adobe Fresco and then export it to Adobe Animate for the character and movement cycles.
Adobe Fresco - a dramatic improvement in drawing tip and painting brush options. You can also easily stylize your projects to give your work a specific 'look and feel'.
Resource Guide - Artistically Inspiring Animation productions
' Mexican Standoff ' - effective perspective and view angles and excellent personalized sketch work / 'Hot Dog' (Bill Plympton) - effective use of stilted animations
Working With Animate CC - Video learning guides
Shape Tweens - With 'Shape Hint' - Ocean Waves example (look at practice set example / covers movie clip and boat making)
Page updated
Google Sites
Report abuse