Apply Disney's 12 principles to create aspirational, exciting experiences that inspire wanderlust and build booking confidence.
The 12 Principles Applied
1. Squash & Stretch
-
Booking Buttons: Satisfying press with light squash
-
Map Pins: Bounce when dropped on location
-
Airplane Icons: Subtle stretch during flight animation
2. Anticipation
-
Search Button: Build-up before results reveal
-
Booking Confirmation: Dramatic pause before success
-
Destination Reveal: Moment of suspense
3. Staging
-
Destination Imagery: Full-bleed hero photos
-
Price Display: Clear but secondary to experience
-
Booking Flow: Current step clearly focused
4. Straight Ahead & Pose to Pose
-
Map Exploration: Smooth pan and zoom (straight ahead)
-
Booking Process: Clear step-by-step (pose to pose)
-
Itinerary Builder: Sequential activity planning
5. Follow Through & Overlapping Action
-
Search Results: Cards cascade in with stagger
-
Image Galleries: Photos settle with follow-through
-
Map Markers: Icon lands, then info popup appears
6. Slow In & Slow Out
-
Dreamy Transitions: Smooth, relaxed pacing
-
Image Carousels: Elegant slide transitions
-
Modal Opens: Comfortable 350-400ms
7. Arc
-
Flight Paths: Curved lines on maps
-
Photo Swipes: Natural arc gestures
-
Destination Transitions: Arc between locations
8. Secondary Action
-
Booking Success: Plane takes off, confetti falls
-
Price Updates: Sparkle when deals appear
-
Loading States: Location-themed animations
9. Timing
-
Aspirational Moments: Slower 400-500ms for dreamy feel
-
Booking Actions: Confident 250-350ms
-
Search Feedback: Quick 150ms
10. Exaggeration
-
Celebration Moments: Booking confirmed deserves fanfare
-
Dream Destinations: Amplify the aspiration
-
Deals: Highlight savings dramatically
11. Solid Drawing
-
Photography First: Stunning destination imagery
-
Map Accuracy: Correct geographical representation
-
Icon Consistency: Unified travel iconography
12. Appeal
-
Inspirational: Motion should spark wanderlust
-
Premium Service Feel: Luxury brand associations
-
Cultural Sensitivity: Respectful representation
Industry Timing Standards
| Image Transition | 400ms | ease-in-out
| Map Animation | 500ms | ease-out
| Booking Step | 300ms | ease-in-out
| Search Results | 250ms | ease-out
| Confirmation | 600ms | custom-bounce
Key Principle
Travel is about dreams and experiences. Animation should transport users mentally before they travel physically. Create moments of aspiration while maintaining booking confidence.