Home / Articles / 12 Principles to Create Realistic Animation the Disney Way

12 Principles to Create Realistic Animation the Disney Way

Article Description

Transitions and CSS animations can help make websites friendlier, but their movement can be mechanical and somewhat unrealistic if not handled well. Website designer/developer Steven Bradley shows how designers can take a cue from the animators at Disney and the 12 principles of animation they follow, and apply to all their work.


Staging is how you present objects. It provides context for the object and the animation, and it helps tell your story.

For example, a cube displayed at an angle to any of its six sides will show the cube as a 3D object. If you’re looking directly at one side though, it will appear to be a 2D square (see Figure 2).

Figure 2

Figure 2 Staging

There are three main considerations with staging:

  • Characters and objects should have strong silhouettes to more quickly understand them.
  • The environment (the stage) should be interesting, without drawing attention away from the characters, objects, and actions.
  • Major actions should be presented one at a time or it could potentially lead to confusion.
5. Straight Ahead Action and Pose-to-Pose | Next Section Previous Section