Thursday, February 1, 2018

OUGD603 - Brief 01 - Fate App - Animation Research

I want to create a couple of gifs in after effects to demonstrate the UX of the app and how it will work/respond to the user, therefore expressing movement in a beleiveable and non static way is crucial when mocking it up.

Below is a video explaining the 12 Basic Principles of Animation: first introduced in the book The Illusion of Life: Disney Animation. The Illusion of Life was written by Disney animators Ollie Johnston and Frank Thomas, two of the master animators referred to by Walt Disney as the “Nine Old Men.” No matter the style of animation—be it hand drawn, 3D or experimental animation—the 12 principles can be seen in almost any motion-based design.


While there is a clear difference between human character animation and motion design (or motion graphics), the 12 principles are still applicable across these processes.

1 - Squash and Stretch

Adding exaggeration to an object in motion gives it a greater sense of weight and volume. This principle is often demonstrated with a bouncing ball: the ball appears stretched when it is falling and squashed when it hits the ground. By squashing and stretching the ball, an animator gives a more realistic feel.

2 - Staging

Influenced by theatrical principles, staging helps establish mood, create focus and clarify what is happening in the scene. For example, removing any extraneous details from the background, which helps keep the main focus in the center even though the scene is always moving.


3 - Straight Ahead Action & Pose to Pose

Straight ahead action refers to the technique of drawing each pose, one right after another, which can yield a fluid animation style. Pose to pose refers to the animation technique in which key frames are planned ahead of each other and then connected to afterward. Pose to pose usually leads to a more proportional animation that is convincing to the eye.

4  -Slow In and Slow Out

In the physical world, objects and humans need to pick up momentum before they can reach full speed. Similarly, it takes time to decrease speed before something can come to a complete stop.


5 - Arc

When someone shoots an arrow, it rarely flies completely straight. Gravity causes objects in motion to arc between the start and end points. Even many of the natural movements in the human body move on arcs, such as the arm, hand, fingers, etc.

6 - Secondary Action

In the physical world, we can observe primary movement in the motion of a person walking or a bird flying. Secondary actions, such as a person swinging their arms as they walk or a birds’ feathers rippling in the wind, help support primary movements. Even smaller actions, such as blinking, are also considered secondary actions. In any secondary animation, it is important that it doesn’t detract from or dominate the main animation movement.

7 - Timing

In a true animation, timing is an essential aspect of the way frames are drawn. Timing also helps in establishing personality of characters and the emotions they express.


8 - Solid drawing

Solid drawing takes an enhanced level of realism to the skill of drawing, adding good form and a three-dimensional feel to an animated work. No matter what tool (pencil or computer) is being used to create the drawing, it must work in three-dimensional space.

9 - Appeal

A character with appeal isn’t always attractive. He or she can be an ugly or evil character with a certain level of charisma that is makes sense within the story. In motion design, appeal can be established before anything moves by choosing an interesting typeface, creating a visual translation, or juxtaposing images.


10 - Anticipation

11 - Exaggeration

12 -  Follow Through and Overlapping Action


No comments:

Post a Comment