Produced with Scholar
Icon for Creating the Illusion of Life

Creating the Illusion of Life

Applying the principles of animation while creating animated GIFs

Learning Module

Abstract

In this module, participants will learn four of Disney's twelve classic animation principles and apply them while creating a portfolio of one of the Internet's most popular image types, the animated GIF. During each session, participants are required to show their finished animation as well as comment on other participants' works. This will help ensure that everyone learns through interacting with others. Participants will also conduct a peer review, after which they can make changes to their work before sharing their entire portfolio during the last session.

Keywords

Animation, Drawing, GIF, GIF89a, Animated GIF, Squash and Stretch, Exaggeration, Arcs, Frames, Slow in and Slow out, Communities of Practice, Social Constructivism, Low-Threshold High-Ceiling

Overview

Estimated Time to Complete: Six 30-40-minute sessions

In this module, participants will learn four of Disney's twelve classic animation principles and apply them while creating a portfolio of one of the Internet's most popular image types, the animated GIF. 

The first five sessions feature videos, readings, and interactive elements to aid the learning process. The idea of drawing can be intimidating to some, so each lesson is designed to be low threshold high ceiling, meaning anyone who can draw a circle can succeed and those who want to go further are encouraged. During each session, participants are required to show their finished artwork, and in most sessions, they'll also comment on at least two other participants' works. This will help ensure that everyone learns through interacting with others, which is a tenet of social constructivism. Participants will also conduct a peer review, after which they can make changes to their work before sharing their entire portfolio during the last session.

About the Author:

I am a former professor of 3D modeling and animation, and also a website developer who loves a good animated GIF. As a child, I watched cartoons incessantly and loved making flipbook animations. This is my second learning module in a series aimed at helping children connect with their creativity, and I am excited that it could help a budding animator hone their skills through a contemporary artform.

Learning Objectives

For the Participant

This module was designed for 4th grade students with an interest in learning:

  • Animation

Learning Objectives:

By the end of the module, you should be able to:

  1. Identify and explain four principles of professional animation
  2. Brainstorm animation ideas based on real-world observations
  3. Create your own hand-drawn animations showing the principles you've learned
  4. Evaluate animations made by yourself and others
  5. Appreciate the work that goes into creating professional animations

Skills/Experience Required:

  • Basic drawing skills
  • Experience navigating a website

Materials:

  • Computer, tablet, or phone with internet access

Optional Materials:

  • Stylus for drawing on a screen
  • Drawing tablet or mouse, for computers that do not have a touch screen
  • A ball or other round object that bounces
Grading (Up to 100 points)
A new lesson will be posted at the start of each session. In those lessons, you'll find videos, reading materials, interactive elements, and assignments. Your assignments can be found in the section called "Keyframes" and each type of assignment will be listed as a different "Frame." The list below shows how you'll be graded on your assignments.
Complete the pre-course survey 5 points
Comment at least ten times 1 point per comment, up to 10 points
Finish your peer review project 20 points
Provide feedback in a peer review 10 points
Show your portfolio of required work 10 points per work, up to 50 points
Complete the session 6 quiz 5 points

 

For the Instructor

This module was designed to be facilitated by instructors with an interest in:

  • Teaching applied visual art
  • Fostering social learning through observation, conversation, interpretation, and iteration

Learning Objectives:

By the end of the module, participants should be able to:

  • Understand the history of hand-drawn animation
  • Identify each of the four professional animation principles in use
  • Contribute unique animation ideas and feedback, based on real-world observations
  • Set goals for what to animate and achieve them
  • Create hand-drawn animations showcasing a combination of principles
  • Operate frame-based animation software
  • Critique peer animations
  • Revise animations based on peer feedback
  • Appreciate the work that goes into creating professional animations
  • Complete a quiz about animation principles

Skills/Experience Required:

  • Experience navigating a website
  • Basic drawing skills (circle, ovals, rectangles)

Materials:

  • Computer, tablet, or phone with internet access (for each participant)

Optional Materials:

  • Stylus for drawing on a screen
  • Drawing tablet or mouse, for computers that do not have a touch screen
  • Balls or other round objects that bounce (for participants to observe)

National Core Arts Standards:

The content and activities in this module were developed to address the following National Core Arts Standards

VISUAL ARTS - CREATING

  1. VA:Cr1.2.4a - Collaboratively set goals and create artwork that is meaningful and has purpose to the makers.
  2. VA:Cr3.1.4a - Revise artwork in progress on the basis of insights gained through peer discussion.

VISUAL ARTS - RESPONDING

  1. VA:Re7.2.4a - Analyze components in visual imagery that convey messages.
  2. VA:Re9.1.4a - Apply one set of criteria to evaluate more than one work of art.
Assessment Criteria
Completion of pre-course survey 5% (the survey sets a baseline to measure knowledge acquisition)
At least ten comments in the community 10% (one percentage point per comment, not to exceed 10 points)
Peer review project completed 20%
Peer review completed 10% 
Portfolio 50% (each work in the portfolio counts as 10 percentage points and is to be assessed with a rubric)
Completion of session 6 quiz 5% (the quiz is to assess the average amount of knowledge gained by taking the course, for the purpose of measuring future changes to course material)
View the detailed peer review rubric
View the detailed portfolio assessment rubric

 

Pre-Course Survey

For the Participant

You've probably watched animations, but before we get started, I'd like to get an idea of what you know about how they're made. Please complete this short, two question survey, so I can get to know you better. Thanks!

Take the pre-course survey  >

For the Instructor

Before posting the Session 1 Participant content, survey participants on their existing knowledge of animation principles. A similar quiz will be taken at the end of the module, to gauge the degree of knowledge acquisition.

1. An Introduction to Animation

For the Participant

Welcome to the Creating the Illusion of Life module! Do you have a favorite cartoon or animated film? I do. Sometimes I like to draw the characters, even if my drawings don't look as good as the originals. We're going to draw a lot during these six sessions, but don't be afraid if you can't draw as well as a Disney artist. We'll keep it simple.

Did you know that Mickey Mouse is over 90 years old? The same artists who created Mickey Mouse and a lot of other characters at the Walt Disney Animation Studios also came up with twelve principles for how those characters should move, in order to give them the illusion of life. Making your drawings look like they're moving is exactly what animation is, and over these six sessions, you'll be introduced to four of those twelve principles. You'll also create a series of animated GIFs that show off your new skills. Even if you don't go on to become a Disney animator, the skills you learn can be applied to all types of animations from explaining scientific concepts that aren't easy to see to characters moving in a video game.

Before we start drawing, let's watch this video so we can appreciate how Disney made cartoons:

Media embedded March 11, 2021

wwodtv. (2010, March 10). How Walt Disney Cartoons Are Made (Burbank version) [Video]. YouTube. https://www.youtube.com/watch?v=ycU8BhfEs_I

Did you notice how animation ideas are discussed by teams, even before the animation starts? You'll get to animate some of your own ideas during these sessions, but we'll also give each other feedback to inspire new ideas. After all, we're learning this together as a community.

The tool you'll use to create your animations is called Brush Ninja. Please watch this brief tutorial to learn its basic functions. To complete the session 1 work, you'll need to know how to use the drawing tool, add frames, and export your animation.

Media embedded March 11, 2021
Media embedded March 12, 2021

Byrne, R. (2018, July 27). How to create an animated GIF on Brush Ninja [Video]. YouTube. https://www.youtube.com/watch?v=CfE1cu8Cw1o

Now that you know some animation history and you have a tool to create animations, let's get to work. Review the rough sketch section, then make your update, before finally adding your comments.

Rough Sketch

Newton, P. (2015, Oct 14). Animation for beginners: How to animate a bouncing ball! [Online Image]. Retrieved March 11, 2021, from https://design.tutsplus.com/tutorials/animation-for-beginners-how-to-animate-a-bouncing-ball--cms-24787

Look at this animated GIF of a bouncing ball. Without any color or details, can you tell:

  1. What type of ball it is?
  2. How big or heavy the ball is?
  3. What the ball is bouncing on?

Even when you're animating something as simple as a ball, these are some of the questions that color and details can help answer.

 

Keyframes

Frame 1: Make an Update
  1. Create a one frame GIF using as many of the Brush Ninja tools as possible.
  2. Create an animation that is at least three second long (that's 18 frames), with at least one ball bouncing around.

Export both items from Brush Ninja as animated GIFs, then add them to your update. Please put the session number and your name on the update.

Tip: Save your Brush Ninja files. Each animated GIF you create counts towards your grade and you can go back to update animations whenever you want.

Frame 2: Comment in the Community
  1. Write the name of one type of ball or ball-shaped object and then describe it using 3-5 sentences. Think about its size, shape, color, what it's made of, and how high it might bounce. Be as descriptive as possible because the balls in these comments will be the same ones you'll animate throughout this module. 

 

For the Instructor

Lesson Overview:

Participants will watch a video on the history of Disney animation, followed by another video familiarizing them with a free, online tool for making animated GIFs, called Brush Ninja. Before participants begin animating, in the Rough Sketch section, they're prompted to analyze different aspects of an animated GIF, so they may visualize their animation ideas before making them. As participants create their animations, they can immediately play them within Brush Ninja for self-assessment.

To ease participants into working with Brush Ninja, the first task in the update encourages them to explore as many of Brush Ninja's tools as possible. The outcome of that exploration will be posted online along with their finished animation. By posting work online regularly, other participants may be inspired or inquire about technique in the comments. Commenting is encouraged throughout the module, so that students receive regular feedback on their work.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Understand the history of hand-drawn animation
  2. Set goals for what to animate and achieve them
  3. Operate frame-based animation software

National Core Arts Standard(s):

  • VA:Re7.2.4a - Analyze components in visual imagery that convey messages.

Teaching Tip:

In the comments, encourage participants to think about a range of different ball-shaped objects. You will likely get comments about sports balls, but what about a piece of paper or aluminum foil crumpled into a ball. Some other suggestions might include marbles, a ball of yarn, a wadded-up ball of gum, a rubber band ball, a snowball, or even a meatball.

I encourage instructors to become familiar with Brush Ninja before posting the first update.

The most commonly used tools for drawing animations will be:

  • Shapes: There are lots of shapes to choose from, including circles, which participants will use a lot. Advanced participants may discover the More section which has pre-drawn objects like buildings and vehicles.
  • Lines: Very useful for drawing straight lines for things like floors, buildings, or other obstacles.
  • Brushes: Advanced participants can draw whatever they want with the brushes.

Work smarter, not harder:

  • Draw where you want to move, before you move: Use the dashes brush to draw the path you want your animated object to follow, then animate the object along that path. It will help you stay organized and when you're done animating you can use the select tool to select and delete the path from each frame. 
  • Duplicate frames to save time. Once you've drawn the object you want to animate, you don't have to redraw it in each frame. Instead, at the bottom of the Brush Ninja screen, hover over the frame you want to make an exact copy of, then click the Duplicate option that appears at the bottom-left. Then you can use the select tool to move your object to the next position of your animation.
  • See the past with onion skinning: Click on the onion skinning option (it looks like a chopped onion) in the top menu to make it easier to see the previous frame of your animation.
  • Save your progress: Good animation takes time, but you can work on it a bit at a time by saving your Brush Ninja file, then opening the file later. 

2. Animation Principles: Arcs

For the Participant

Did you ever think you would draw eighteen pictures of a ball, just to see it move for three seconds? Each drawing in our Brush Ninja animation was a single frame and there were six frames per second. 6 frames x 3 seconds = 18 frames. How many frames would a one-minute animation have? How about a thirty-minute animation? If you know the answers, add them to the comments for this update. When you watch an animated movie in a theatre, there are twenty-four frames per second. That means for a movie that is one-hour and thirty-minutes long, you would have to draw 129,600 frames! 24 frames x 60 seconds x 90 minutes = 129,600 frames. Well, I'm glad we didn't have to draw that much to learn the basics of animation. Now we can move on to learning some Disney principles.

PRINCIPLES OF ANIMATION: ARCS

The first principle we're going to cover is arcs. Please watch the following video to understand how arcs help make stiff, mechanical movements look smoother and more lifelike. To complete the session 2 work, you'll need to know how to animate your ball so that it moves in an arc.

Media embedded March 11, 2021

AlanBeckerTutorials. (2015a, Feb 26). 7. Arcs - 12 Principles of Animation [Video]. YouTube. https://youtu.be/I1_tZ9LhJD4?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

In the video, you probably noticed that the arc principle doesn't just apply to balls. Arcs define the path, also called a trajectory, that many objects move along. An object can even have multiple arcs as it bounces off of other objects. Look at this image of a ping-pong ball bouncing on a table and notice how the height of each bounce, known as the amplitude, is smaller each time. It's not easy to tell from a photograph, but the amount of time each bounce takes, known as the period, also decreases over time.

Kitagawa, M. (n.d.). Strobographic photograph of a bouncing ping-pong ball [Online Image]. Retrieved on March 14, 2021, from https://www.utdallas.edu/atec/midori/Handouts/diminishing_bounces.htm

Now that you know the principle of arcs, let's get back to the drawing board. Review the rough sketch section, then make your update, add your comments, and begin work on your peer review project.

Rough Sketch

SportsManias. (n.d.) Football Soccer GIF [Online Image]. Retrieved on March 11, 2021, from https://giphy.com/gifs/SportsManias-football-soccer-futbol-WvuTFk2IN7jxoLVDkP

Look at this animated GIF of a bouncing soccer ball. Now we have some details, but can you tell:

  1. If it's a full-sized soccer ball or a tiny toy ball?
  2. What the ball is bouncing over?
  3. Why the ball is bouncing back and forth?

Adding others items to the scene can help answer these types of questions.

Keyframes

Frame 1: Make an Update

Choose a ball from the session 1 comments. Create an animation that is at least three second long, where that ball displays the arc principle. Your ball must avoid at least one other object in the scene. When you post your update, don't tell us what type of ball it is. Anyone who leaves a comment on your update will have to guess.

Frame 2: Comment in the Community
  1. Find at least two session 2 updates made by other classmates. Leave a comment on each update saying what type of ball you think they used and two reasons why. Also give them feedback, by saying "I like the way you ________." or ask "How did you __________?"
  2. Play Dunk Shot

    When you aimed the ball, how did the arc help? What was your high score? Comment on this update with some tips and tricks. I heard that the teacher has a high score!

Frame 3: Start Your Peer Review Project

For your peer review project, create a five second animation that tells part of a story using at least two balls and other items that the balls will interact with. You'll be graded on:

  1. the length of your animation
  2. the interaction between the balls
  3. the interaction between the balls and other items
  4. the principles of animation that the balls show
Click to view the detailed peer review rubric

Due Date: Before the start of session 5

 

For the Instructor

Lesson Overview:

Participants will watch a video explaining the principle of arcs, then read text detailing the physics of a bounce. Before participants begin animating, in the Rough Sketch section, they're prompted to analyze different aspects of an animated GIF. As part of their assignments, participants will play an online game that requires close attention to arcs and showcases how animation is used in video games.

Participants are also given the rubric for their peer review project. Work for that project will be completed between sessions 2 and 4. The review will be conducted during session 5, so that each participant can make updates based on the feedback in time for the animation showcase during session 6.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Understand the arc animation principle
  2. Identify one of the four professional animation principles in use
  3. Create hand-drawn animations showcasing one of the four principles
  4. Contribute unique animation ideas and feedback, based on real-world observations
  5. Set goals for what to animate and achieve them
  6. Operate frame-based animation software

National Core Arts Standard(s):

  • VA:Re7.2.4a - Analyze components in visual imagery that convey messages.
  • VA:Cr1.2.4a - Collaboratively set goals and create artwork that is meaningful and has purpose to the makers.

Teaching Tip:

Play the Dunk Shot game and post your high score in the comments for this update. Don't post any tips though. That will motivate participants to explore ways to beat the instructor and share their ideas, while simultaneously learning more about arcs. Learning through goal-oriented information sharing is common in communities of practice.

3. Animation Principles: Slow In & Slow Out

For the Participant

When you played Dunk Shot, did you notice anything about the spacing between each orange dot in the trajectory? If you didn't, go back and play a few rounds then leave a comment on this update about what you saw. I'll give you a clue, those dots have something to do with this session's animation principle, slow in and slow out.

PRINCIPLES OF ANIMATION: SLOW IN & SLOW OUT

Please watch the following video to understand how, just like the arc, slow in and slow out helps turn mechanical movements into more lifelike motions. To complete the session 3 work, you'll need to know how to animate your ball so that it eases in and out slowly.

Media embedded March 11, 2021

AlanBeckerTutorials. (2015b, February 20). 6. Slow In & Slow Out - 12 Principles of Animation [Video]. YouTube. https://youtu.be/fQBFsTqbKhY?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

You might not have guessed it, but there's actually a lot of science in animation. Movie and video game animator Kevin Koch (2017), uses the science of physics to describe the slow in and slow out principle in more detail. He explains that in physics, moving objects have:

  • Position: where something is in space
  • Translation: movement from one position to another
  • Velocity: the rate of change of position over time (also known as speed and direction)
  • Acceleration: the rate of change of velocity over time

When you look below at the photo of a tennis ball bouncing, you'll notice twenty-two balls. Each ball is one frame of animation and the position is wherever the ball shows up in one frame. As we go from one frame to the next, translation is the distance that the ball has moved. Velocity and acceleration describe how fast the movement is happening.

Bounce Tennis. (n.d.). Photo of tennis ball bouncing [Online Image]. Retrieved on March 14, 2021, from https://bouncetennis.files.wordpress.com/2015/12/tennis-ball-bounce-1a.jpg

Just as you learned in the last session, the tennis ball is bouncing in an arc. Do you notice how close together the balls are at the top of each arc? Does that mean the ball is moving faster or slower? If you guessed slower, you're correct. The closer the ball is in two frames, the slower it will appear to move in your animation. If the ball if moving up towards the top of the arc, the velocity is slowing down and it's decelerating (the opposite of accelerating). If the ball is moving down from the top of the arc, the velocity is speeding up and it's accelerating. The farther apart the ball is between two frames, the faster it will appear to move when you watch the animation. That movement from frame to frame is also called spacing.

Now that you know the principle of slow-in and slow-out, let's get back to the drawing board. Review the rough sketch section, then make your update, before finally adding your comments.

Rough Sketch

Pinterest. (n.d.a) Animated balls bouncing [Online Image]. Retrieved on March 11, 2021, from https://i.pinimg.com/originals /38/40/cf/ 3840cf7bb0e55b8650b041504f3864a0.gif

Look at this animated GIF of several bouncing balls. Now we have color and multiple objects, but can you tell:

  • Which ball is lightest?
  • Which ball is heaviest?
  • What the different balls are made of?
  • If the balls are solid or hollow?

Some of these questions you might be able to answer if you compare the size, color, and bounciness of the animated ball to similar balls you've seen in the real world. Closely observing and comparing things in the real world are useful skills for animators.

Keyframes

Frame 1: Make an Update

Choose a ball from the Session 1 comments. It cannot be the same ball you used in Session 2. Create an animation that is at least three second long, where the ball displays the slow in and slow out principle. The ball must interact with an object in your scene. When you post your update, don't tell us what type of ball it is. Anyone who leaves a comment on your update will have to guess.

Frame 2: Comment in the Community
  1. Find at least two session 3 updates made by other classmates. Leave a comment on each update saying what type of ball you think it is and two reasons why. Remember to also give them feedback, by saying "I like the way you ________." or ask "How did you __________?"
  2. Name and describe two things that start slow, speed up, then slow down again. For example, a car starts out slow, speeds up, and then slows down at a traffic light.

 

For the Instructor

Lesson Overview:

Participants will watch a video explaining the principle of slow in and slow out, then read text detailing more physics of a bounce. Before participants begin animating, in the Rough Sketch section, they're prompted to analyze different aspects of an animated GIF. In this session's update, participants must choose a different ball than they animated previously, which forces them to consider the new ball's physical properties.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Understand the slow in and slow out animation principle
  2. Identify two of the four professional animation principles in use
  3. Create hand-drawn animations showcasing two of the four principles
  4. Contribute unique animation ideas and feedback, based on real-world observations
  5. Set goals for what to animate and achieve them
  6. Operate frame-based animation software

National Core Arts Standard(s):

  • VA:Re7.2.4a - Analyze components in visual imagery that convey messages.
  • VA:Cr1.2.4a - Collaboratively set goals and create artwork that is meaningful and has purpose to the makers.

Teaching Tip:

If participants don't add a variety of scenarios in the comments, consider inserting any of the following to get the ball rolling:

  • Running a race from start to finish
  • Airplanes taking off and landing
  • Spinning around in a circle
  • Swinging on a swing set

4. Animation Principles: Squash & Stretch

For the Participant

What types of objects did your ball interact with in your last update? How objects react to one another can tell you a lot about what they are made of. Would a bowling ball bounce off of a high dive into a pool of warm mustard? Bowling balls aren't usually very bouncy. Maybe it could roll off instead. But what if the bowling ball was scared of heights? I've never seen a ball get scared, but that's one great thing about animation. With a little imagination, you can make objects act like humans. A fancy word for that is anthropomorphism (ann-throw-po-more-fizz-em). Watch this short animation to see how simple forms like a ball, cubes, and pyramids can be animated to tell a story, using some of the principles you've already learned.

Media embedded March 15, 2021

notbadfilms. (2016, January 18). Bouncing Ball Animation praised by Pixar animator [Video]. YouTube. https://www.youtube.com/watch?v=dSdu8cUKroI

That brave, little ball bounced in big, beautiful arcs before slowing down to look back at the shapes that had teased it. Did you notice that the ball also changed shape as it hopped around? That brings us to our next principle of animation. 

PRINCIPLES OF ANIMATION: SQUASH & STRETCH

Please watch the following video to understand how squash and stretch helps to show if your object is hard or soft. To complete the session 4 work, you'll need to know how to animate your ball so that it squashes and stretches.

Media embedded March 11, 2021

AlanBeckerTutorials. (2015c, January 16). 1. Squash & Stretch - 12 Principles of Animation [Video]. YouTube. https://youtu.be/haa7n3UGyDc?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

We've already talked about speed and how a tennis ball decelerates near the top of a bounce and then accelerates as it drops again. In the video you just watched, you learned that speed is also a part of the squash and stretch principle. The faster an object is moving, the more it may squash flat when it hits something, stretch out as it bounces off, and then eventually go back to its normal shape. Another word for that type of flexibility is elasticity (ee-lass-tiss-sit-tee). Can you think of some other objects that have a lot of elasticity? Maybe you call them "stretchy." You might even be wearing some. If you can think of some, add them to the comments for this update.

Squashing and stretching can be difficult to see at regular speed, so to help you out, here are some objects with different amounts of elasticity, bouncing in slow motion:

Tennis ball (20 seconds)

Rubber ball (14 seconds)

Marbles (51 seconds)

Water balloon (1min 6 seconds)

Now that you know the principle of squash and stretch, let's get back to the drawing board. Review the rough sketch section, then make your update, before finally adding your comments.

Rough Sketch

Pinterest. (n.d.b) Animated bouncing grey balls. [Online Image]. Retrieved on March 11, 2021, from https://i.pinimg.com/originals/b9/5e/ ab/b95eabfc00484961296ac75b9c8dac1c.gif

Look at this animated GIF of several bouncing balls. This time, we lost the different colors, but can you still tell:

  1. Which ball is lightest?
  2. Which ball is heaviest?
  3. What the different balls are made of?
  4. If the balls are solid or hollow?

Even though we have six balls, they all have the same color and behave the same way. How much a ball squashes and stretches can help answer these types of questions.

Keyframes

Frame 1: Finish and Upload Your Peer Review Animation
  1. Finish your peer review project by adding squash and stretch to the animation, then export it from Brush Ninja and upload the final animated GIF before session 5. At the start of session 5, your instructor will ask you to review someone else's animation.

Click here to upload your animation >

Due Date: Before the start of session 5

 

For the Instructor

Lesson Overview:

Participants will watch a video showing multiple animation principles applied to simple geometric forms, in order to tell a meaningful story. The purpose of the video is to inspire but also illustrate the principle of squash and stretch, which is explained further in the second video that participants will watch. Additional videos and text further detail the physics behind this animation principle, which can be difficult to observe with the naked eye.

Before participants begin animating, in the Rough Sketch section, they're prompted to analyze different aspects of an animated GIF. In this session, participants will neither make an update nor comment, but the three principles they've learned so far must be visible in their peer review animation. The animation submitted for peer review should be received in time to allow 15-20-minutes for review and feedback during the first half of session 5.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Understand the squash and stretch animation principle
  2. Identify three of the four professional animation principles in use
  3. Create hand-drawn animations showcasing three of the four principles
  4. Contribute unique animation ideas and feedback, based on real-world observations
  5. Set goals for what to animate and achieve them
  6. Operate frame-based animation software
  7. Critique peer animations

National Core Arts Standard(s):

  • VA:Re7.2.4a - Analyze components in visual imagery that convey messages.
  • VA:Cr1.2.4a - Collaboratively set goals and create artwork that is meaningful and has purpose to the makers.
  • VA:Re9.1.4a - Apply one set of criteria to evaluate more than one work of art.

5. Animation Principles: Exaggeration

For the Participant

Frame 1: Submit Your Peer Review Feedback

Before you get started learning about the last principle of animation, spend the first half of this session reviewing your classmate's animation. Give them positive and helpful feedback based on the prompts in the grading rubric.

View the detailed peer review rubric

 

Does it feel like your ball is coming to life? Take a few minutes to look at all of the animated GIFs you've created. As you learned and applied each animation principle, your ball probably started to move more realistically. However, another great thing about animation, is that you don't always have to be realistic. Our final animation principle is where you can let your imagination run wwwWWWWWIIIIiiiiiiiillllLLLLLLDDDDddddd!

PRINCIPLES OF ANIMATION: EXAGGERATION

Please watch the following video to understand how exaggeration helps add impact to your animations. To complete the session 5 work, you'll need to know how to animate an exaggerated reaction.

Media embedded March 11, 2021

AlanBeckerTutorials. (2015d, March 22). 10. Exaggeration - 12 Principles of Animation [Video]. YouTube. https://youtu.be/HfFj-VQKiAM?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

To make sure you have time to prepare for next session's animation showcase, for this session, there is no rough sketch, no update, and you won't have to make comments. However, please remember to look at the results of your peer review, then make any improvements you would like to your peer reviewed animation as well as any of your earlier work.

Keyframes

Frame 1: Make a Portfolio Update

Make changes to your peer review animation based on the feedback you received in the review, as well as what you've just learned about exaggeration. Then make an update that includes the following:

  1. The animated GIF you submitted for peer review (Before) and the animated GIF you updated after the peer review (After). Make sure to label them as before and after, so we can see how much you've progressed.
  2. Animated GIFs from the previous sessions. If you've made updates to any of those animations, include the before and after GIFs too.

This is your portfolio for the animation showcase, which is worth 50 grade points.

 

For the Instructor

Lesson Overview:

Participants will begin the session by conducting a peer review of another classmate's animation. After that, they will watch a video explaining the principle of exaggeration. There is no Rough Sketch, required update, nor comments for this session. Instead, participants are encouraged to update their peer review animation based on the peer review feedback and exaggeration lesson, then create a portfolio of all of their work, to be reviewed during the animation showcase in session 6.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Understand the squash and stretch animation principle
  2. Identify all four professional animation principles in use
  3. Create hand-drawn animations showcasing all four principles
  4. Contribute unique animation ideas and feedback, based on real-world observations
  5. Set goals for what to animate and achieve them
  6. Operate frame-based animation software
  7. Critique peer animations
  8. Revise animations based on peer feedback

National Core Arts Standard(s):

  • VA:Cr3.1.4a - Revise artwork in progress on the basis of insights gained through peer discussion.
  • VA:Re9.1.4a - Apply one set of criteria to evaluate more than one work of art.

Teaching Tip:

To save time, pair students up in the order their work was uploaded.

6. The Animation Showcase

For the Participant

Congratulations, you've created so many animations and learned how to really make them come to life! Now it's time to enjoy everyone's hard work.

If after all of this you feel like you need a rest, I totally understand. Animation is a lot of work and it's usually made by a team of artists. At the very least, I hope you have a new appreciation for the cartoons and animated movies you've seen. I really appreciate that you reviewed a classmate's project and commented on different updates. Your feedback helps us all grow. 

If you want to learn the other principles of animation, feel free to watch this 24-minute video explaining all twelve of them:

Media embedded March 15, 2021

AlanBeckerTutorials. (2017, Mar 22). 12 Principles of Animation (Official Full Series) [Video]. YouTube. https://www.youtube.com/watch?v=uDqjIdI4bF4&list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd&index=13

Keyframes

Frame 1: Comment in the Community
  1. Watch and comment on at least three of your classmate's portfolios. In your comments, use some of the animation terms you've learned throughout our sessions together.
Frame 2: Quiz

Take this short quiz about the principles of animation.

Start the quiz > 

 

For the Instructor

Lesson Overview:

Participants can now enjoy everyone's hard work by browsing the animation showcase. Each participant has posted an update with all of their work and must comment on at least three other participant's portfolios. There is a short quiz to assess whether participants can identify the principles any better now than they could in the pre-course survey.

Lesson Objective(s):

By the end of the lesson, participants should be able to:

  1. Identify each of the four professional animation principles in use
  2. Appreciate the work that goes into creating professional animations
  3. Complete a quiz about animation principles

National Core Arts Standard(s):

  • VA:Re7.2.4a - Analyze components in visual imagery that convey messages.

Teaching Tip:

Enjoy!

References

*AlanBeckerTutorials. (2015a, Feb 26). 7. Arcs - 12 Principles of Animation [Video]. YouTube. https://youtu.be/I1_tZ9LhJD4?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

*AlanBeckerTutorials. (2015b, February 20). 6. Slow In & Slow Out - 12 Principles of Animation [Video]. YouTube. https://youtu.be/fQBFsTqbKhY?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

*AlanBeckerTutorials. (2015c, January 16). 1. Squash & Stretch - 12 Principles of Animation [Video]. YouTube. https://youtu.be/haa7n3UGyDc?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

*AlanBeckerTutorials. (2015d, March 22). 10. Exaggeration - 12 Principles of Animation [Video]. YouTube. https://youtu.be/HfFj-VQKiAM?list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd

*AlanBeckerTutorials. (2017, Mar 22). 12 Principles of Animation (Official Full Series) [Video]. YouTube. https://www.youtube.com/watch?v=uDqjIdI4bF4&list=PL-bOh8btec4CXd2ya1NmSKpi92U_l6ZJd&index=13

*Bounce Tennis. (n.d.). Photo of tennis ball bouncing [Online Image]. Retrieved on March 14, 2021, from https://bouncetennis.files.wordpress.com/2015/12/tennis-ball-bounce-1a.jpg

*Byrne, R. (2018, July 27). How to create an animated GIF on Brush Ninja [Video]. YouTube. https://www.youtube.com/watch?v=CfE1cu8Cw1o

*Kitagawa, M. (n.d.). Strobographic photograph of a bouncing ping-pong ball [Online Image]. Retrieved on March 14, 2021, from https://www.utdallas.edu/atec/midori/Handouts/diminishing_bounces.htm

*Koch, K. (2017, June 21). Slow In and Slow Out: The 12 Basic Principles of Animation. Animation Mentor. https://www.animationmentor.com/blog/slow-in-and-slow-out-the-12-basic-principles-of-animation/

*Newton, P. (2015, Oct 14). Animation for beginners: How to animate a bouncing ball! [Online Image]. Retrieved on March 11, 2021, from https://design.tutsplus.com/tutorials/animation-for-beginners-how-to-animate-a-bouncing-ball--cms-24787

*notbadfilms. (2016, January 18). Bouncing Ball Animation praised by Pixar animator [Video]. YouTube. https://www.youtube.com/watch?v=dSdu8cUKroI

*Pinterest. (n.d.a) Animated balls bouncing [Online Image]. Retrieved on March 11, 2021, from https://i.pinimg.com/originals/38/40/cf/3840cf7bb0e55b8650b041504f3864a0.gif

*Pinterest. (n.d.b) Animated bouncing grey balls. [Online Image]. Retrieved on March 11, 2021, from https://i.pinimg.com/originals/b9/5e/ab/b95eabfc00484961296ac75b9c8dac1c.gif

*SportsManias. (n.d.) Football Soccer GIF [Online Image]. Retrieved on March 11, 2021, from https://giphy.com/gifs/SportsManias-football-soccer-futbol-WvuTFk2IN7jxoLVDkP

*wwodtv. (2010, March 10). How Walt Disney Cartoons Are Made (Burbank version) [Video]. YouTube. https://www.youtube.com/watch?v=ycU8BhfEs_I