Login
dylantarre/animation-principles1 file

Travel Hospitality

Use when designing animations for travel booking, hospitality apps, tourism platforms, or vacation planning experiences

Use this skillView repositoryView on skills.sh
Specification
Skill ID
dylantarre/animation-principles/travel-hospitality
Publisher
dylantarre
Repository
animation-principles
Installs
0
Files
1
Synced
Sep 23, 2026
How to use it

Open any RiverX project, open the Skills panel in the chat, and search for this identifier. The files are fetched from the source repository at install time.

dylantarre/animation-principles/travel-hospitalityInstalls these files
  • SKILL.md

What this skill tells the agent

Travel & Hospitality Animation Principles

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

ActionDurationEasing
Image Transition400msease-in-out
Map Animation500msease-out
Booking Step300msease-in-out
Search Results250msease-out
Confirmation600mscustom-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.

More from dylantarre

dylantarre/animation-principles

3d Spatial

Use when working in Blender, Unity 3D, Unreal Engine, Cinema 4D, VR/AR applications, or any three-dimensional animation work.

dylantarre/animation-principles

Accessibility Advocate

Use when designing inclusive animations, addressing vestibular disorders and motion sensitivity, or ensuring animation accessibility compliance.

dylantarre/animation-principles

Accessibility Issues

Use when animation excludes users with vestibular disorders, cognitive disabilities, or assistive technology needs

Use this skill in a project

Open any RiverX project, search the Skills panel for dylantarre/animation-principles/travel-hospitality, and install it in one click.

Use this skill