travel-hospitality

旅游与酒店业动画原则

运用迪士尼的 12 条原则，打造令人向往、激动人心的体验，激发旅行欲望并增强预订信心。

12 条原则的应用

1. 挤压与拉伸

• 预订按钮：按下时轻微挤压，带来令人满意的反馈
• 地图图钉：落到目的地时弹跳
• 飞机图标：飞行动画中轻微拉伸

2. 预备动作

• 搜索按钮：结果显示前逐步蓄势
• 预订确认：成功提示前加入戏剧性的停顿
• 目的地揭晓：营造悬念

3. 演出布局

• 目的地图片：使用铺满屏幕的主视觉照片
• 价格显示：清晰呈现，但不喧宾夺主
• 预订流程：清楚突出当前步骤

4. 连续动作与关键姿势

• 地图探索：平滑平移和缩放（连续动作）
• 预订流程：步骤清晰、循序渐进（关键姿势）
• 行程规划器：按顺序规划活动

5. 跟随动作与重叠动作

• 搜索结果：卡片依次错落出现
• 图片库：照片带有跟随效果，最终平稳停下
• 地图标记：图标落下后，再显示信息弹窗

6. 慢入与慢出

• 梦幻转场：节奏平滑、轻松
• 图片轮播：优雅的滑动转场
• 模态窗口打开：以舒适的 350-400ms 完成

7. 弧线运动

• 飞行路线：在地图上以弧线呈现
• 照片滑动：采用自然的弧线手势
• 目的地转场：以弧线连接不同地点

8. 次要动作

• 预订成功：飞机起飞，彩屑飘落
• 价格更新：优惠出现时闪烁
• 加载状态：播放与地点相关的动画

9. 时间节奏

• 令人向往的时刻：放慢至 400-500ms，营造梦幻感
• 预订操作：以自信利落的 250-350ms 完成
• 搜索反馈：快速响应，时长为 150ms

10. 夸张

• 庆祝时刻：预订成功值得隆重庆祝
• 梦幻目的地：进一步放大向往之情
• 优惠：以醒目的方式突出节省金额

11. 扎实绘制

• 照片优先：呈现令人惊叹的目的地图片
• 地图准确性：准确呈现地理信息
• 图标一致性：统一旅行图标风格

12. 吸引力

• 激发灵感：动效应点燃旅行欲望
• 尊享服务体验：营造奢华品牌联想
• 文化敏感性：以尊重的方式呈现文化

行业时长标准

操作	时长	缓动
图片转场	400ms	ease-in-out
地图动画	500ms	ease-out
预订步骤	300ms	ease-in-out
搜索结果	250ms	ease-out
确认	600ms	custom-bounce

核心原则

旅行关乎梦想与体验。动画应在用户踏上旅程之前，先带他们在心中抵达目的地。在增强预订信心的同时，营造令人向往的时刻。