Site Menu
<i>DKCR</i> Title Animation icon

DKCR Title Animation

As made famous by Retro Studios
Covered in Unity

Cover Reference

  • Despite only being one screen in an entire game, the Title Sequence in Donkey Kong Country Returns is enchanting. How do they get that much love and attention into something like brining a logo on screen?

Discoveries

  • Squash and Stretch (Rule #1)

    Retro brings a whole new meaning to "jiggle physics" with their UI. Not only do the UI elements jiggle on impact, but they even stretch when moving at high velocities. It's a simple but effective trick - there's a reason why "Squash and Stretch" is the first of 12 Basic Principles of Animation.

  • Anticipation (Rule #2)

    The UI exits differently when exiting the screen. It first squishes in anticipation of the motion, actually staying still for 2 frames while bunching up. It then launches offscreen in only 7 frames (with the entire animation being shorter than the intro by 4 frames).

  • Faster, Faster, Faster!

    Transitioning the UI in only takes a starting 13 frames (0.4333 seconds) - including the jiggling! The animation is able to convey all of that "feel" in the smallest possible amount of time. After all, this is the first screen you see in the game, and you came here to play!

Notes

  • My implementation relies almost entirely on springs. Springs apply more force the further away they are from their destination, which gives them a good feeling "weight" making the animation more physical. The simulation comes from Ryan Juckett's excellent spring function.

  • Originally I implemented the animation entirely by springs - but it became unruly when I wanted to match Retro's animation duration to the frame. So I switched movement animation to an authored curve, which guarantees duration. The spring then follows this position, and defines the squash and stretch of the object. This makes the stretching highly fluid and completely procedural, while giving total control over the motion.

  • When the elements leave, they anticipate the movement by first bunching together. To get the spring to play nice, I apply a force in the direction of movement, which squashes the UI, then stretches as the movement passes the spring while exiting.