Digital experiences are increasingly using animation to inform, engage, and delight users. At SXSW, I attended two sessions that explored how Disney’s classic 12 Principles of Animation can be applied to modern experience design.
Back in the 1930s, Disney animators asked a simple but profound question: What makes animation good? To answer it, they studied animals in zoos and watched old films to better understand real-world physics and motion. Their research culminated in the book The Illusion of Life: Disney Animation, which introduced the 12 Principles of Animation:
- Squash & Stretch
- Anticipation
- Staging
- Straight Ahead Action and Pose to Pose
- Follow Through and Overlapping Action
- Slow In and Slow Out
- Arcs
- Secondary Action
- Timing
- Exaggeration
- Solid Drawing
- Appeal
While these principles originated in film, many translate seamlessly into digital experience design. Principles such as anticipation, timing, and staging are particularly effective when designing motion for apps, websites, and interfaces.
The first session I attended, “Think Like an Animator: Motion and Android,” was co-presented by Kevin Grant (Android developer at Tumblr) and Zack Sultan (Lead Designer at Tumblr). They distilled Disney’s 12 principles into four fundamental types of motion that apply directly to digital products: slide, rotate, scale, and fade. Using these, they critiqued Android apps and tied each example back to Disney’s framework, creating a shared vocabulary for designers and developers.
The second session, “The Principles of UX Choreography” was co-led by Glen Keane, legendary Disney animator, and Rebecca Ussai, Senior UX Designer at R/GA. Rebecca emphasized how animation enhances UX, while Glen brought concepts to life by sketching Mickey Mouse live on stage. Their session concluded with Glen’s stunning short film Duet, created for Google.
Key takeaway: digital experiences should be architected around a system of animations, not just one-off transitions. Animation is part of your brand language—working in harmony with copy, design, and functionality. Done well, it serves two essential purposes: informing users and delighting them.