# Travel Hospitality > Use when designing animations for travel booking, hospitality apps, tourism platforms, or vacation planning experiences - Skill: `tomevault-io/travel-hospitality` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/travel-hospitality` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/travel-hospitality/raw - Safety review: pending (external: skill-scanner PASS, skillspector PASS) - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Coding & Dev Tools - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/travel-hospitality --- # 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 | Action | Duration | Easing | |--------|----------|--------| | 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. --- > Converted and distributed by [TomeVault](https://tomevault.io/claim/dylantarre) — claim your Tome and manage your conversions.