Use when building larger movement animations between 500-800ms - hero transitions, complex reveals, animations that tell a story and deserve attention

Large Animations (500 800ms) At 500 800ms, animations become events . Users stop and watch. Reserve this duration for significant moments that deserve attention and communicate importance. Disney Principles at Large Scale Full Expression of All Principles Squash & Stretch : Dramatic deformation 20 30% stretch visible and characterful. Objects feel elastic and alive. Anticipation : Extended wind up 150 200ms anticipation sells the action. Clear "about to happen" signal. Staging : Sophisticated choreography multiple elements with clear hierarchy and timing offsets. Straight Ahead/Pose to Pose : Definitely pose to pose complex motion needs keyframe control. Follow Through : Extended settling elements continue moving 100 200ms after main action completes. Slow In/Slow Out : Dramatic easing strong deceleration creates impact at endpoints. Arcs : Essential all movement should follow natural curved paths. Secondary Action : Rich layering primary, secondary, and tertiary actions possible. Timing : 30 48 frames at 60fps. Full cinematic range. Exaggeration : Go bold this duration supports theatrical expression. Solid Drawing : Full 3D transforms depth, perspective, complex rotations. Appeal : Memorable moments users will recall these animations. Easing Recommendations Best Use Cases Hero image/section reveals Major feature introductions Success/completion celebrations Onboarding sequences Dashboard data loads Portfolio piece reveals First time user experiences Important state changes Implementation Pattern Warning Signs If users seem impatient, duration is too long If used for common actions, flow suffers If multiple large animations compete, staging fails Key Insight Large animations are moments of theater . They punctuate the experience and create memory. Use sparingly every large animation should earn its duration.

large-500-800ms