motion-designer

动效设计师

为创作引人入胜的视频提供专业动效设计指导。这项技能将数十年的 After Effects 和动态图形经验应用于 Remotion 视频规范。

理念

出色的动效设计融合了三个要素：

1. 视觉叙事 — 每一帧都服务于叙事
2. 节奏韵律 — 动效遵循自然节奏和音乐节拍
3. 情感共鸣 — 设计选择唤起预期的情感

这项技能的工作方式

调用这项技能后，它会引导你创建详细的视频规范，其中包括：

• 逐场景拆解 — 完整描述每个视觉元素
• 时间安排与节奏把控 — 为所有动画和转场精确设定帧时间
• 音频策略 — 根据情绪和能量水平推荐背景音乐
• 音效安排 — 指定音效及其精确时间和用途
• 转场设计 — 场景之间如何衔接和过渡
• 视觉层级 — 观众在每个时刻应关注的内容

输出是一份全面的规范文档，可与 /remotion-best-practices 无缝配合实施。

核心框架

动画的 12 条原则（Disney）

1. 挤压与拉伸 — 赋予物体重量感和柔韧性
2. 预备动作 — 为动作做好铺垫
3. 演出布局 — 引导观众关注最重要的元素
4. 连续动作与关键姿势 — 两种动画方法
5. 跟随动作与重叠动作 — 自然的运动会延续
6. 慢入与慢出 — 缓动营造真实的运动效果
7. 弧线 — 自然运动沿曲线路径进行
8. 次要动作 — 辅助细节增添生气
9. 时间安排 — 速度塑造个性和情绪
10. 夸张 — 强化现实以增强效果
11. 扎实绘制 — 具有三维感的形体
12. 吸引力 — 设计引人入胜、令人愉悦

动效设计弧线

每个引人入胜的视频都遵循情感弧线：

Hook (0-5s)     → Grab attention immediately
Build (5-30s)   → Establish context and build interest
Peak (30-70s)   → Deliver main message with maximum impact
Resolve (70-90s) → Satisfying conclusion and call-to-action

音频设计层次

专业动态图形使用分层音频：

1. 背景音乐 — 营造情绪和能量（音量 40-60%）
2. 音效 — 强调动作和转场（音量 60-80%）
3. 环境音效 — 营造微妙的背景氛围（音量 20-30%）
4. 旁白/对白 — 如适用（音量 80-100%）

时间安排理论

动态图形的时间安排遵循自然节奏：

• 24-30 FPS — 标准视频帧率
• 2 帧规则 — 让内容被感知到所需的最短时长
• 0.3s（9 帧） — 舒适阅读所需的最短时长
• 0.5s（15 帧） — UI 微交互的理想时长
• 1-2s — 舒适的转场时长
• 3-5s — 复杂信息的场景时长
• 8-12s — 不发生变化时的最长注意力持续时间

视频规范格式

创建视频规范时，请使用以下结构：

1. 概览

• 标题 — 清晰、描述性强的名称
• 时长 — 总秒数
• 尺寸 — 宽 x 高（通常为 1920x1080）
• 帧率 — 30 fps（标准）
• 风格 — 视觉美学描述
• 情绪 — 情感基调

2. 音频策略

• 背景音乐
  • 风格/流派
  • 情绪和能量水平
  • 需要同步的关键时刻
  • 音量包络（渐入、闪避）
• 音效
  • 所需音效列表
  • 每个音效的时间安排（以秒为单位）
  • 每个音效的用途

3. 场景拆解

对于每个场景，请说明：

## Scene N: [Name] (Xs - Ys, Duration: Zs)

**Visual Description:**
[Detailed description of every element, position, color, size, typography]

**Animation Details:**
- Element 1: [entrance/behavior] from Xs to Ys
- Element 2: [movement/transform] from Xs to Ys
- Element 3: [exit/transition] from Xs to Ys

**Timing:**
- Frame 0-30: [what happens]
- Frame 30-60: [what happens]
- Frame 60-90: [what happens]

**Audio:**
- Background music: [volume level, mood]
- SFX at Xs: [effect description]
- SFX at Ys: [effect description]

**Transitions:**
[How this scene transitions to the next]

**Focus Points:**
[What should draw viewer attention]

4. 技术规范

包含 Remotion 专属指导：

• 合成尺寸和 FPS
• 调色板（十六进制代码）
• 字体排版（字体、字号、字重）
• 动画类型（弹簧、插值、缓动）
• 不同效果的弹簧配置
• 资源需求（图像、图标等）

与 Remotion 最佳实践集成

此技能生成的规格可直接映射到 Remotion 实现：

• 场景描述 → Remotion <Sequence> 组件
• 时间细节 → 使用 useCurrentFrame() 进行基于帧的动画
• 动画细节 → spring() 和 interpolate() 配置
• 音频位置 → 带时间设置的 <Audio> 组件
• 转场 → remotion-best-practices 中的转场模式

使用此技能创建规格后，请使用 /remotion-best-practices 进行实现。

常见视频类型

类型	时长	结构	关键元素
微交互	1-3 秒	单个动作	快速、利落、反馈清晰
解说视频开场	5-10 秒	吸引注意 + 预告	醒目文字、简单概念
产品演示	15-30 秒	问题 → 解决方案	展示胜于讲述
功能展示	30-60 秒	铺垫 → 高潮 → 行动号召	多个场景、转场
品牌故事	60-120 秒	弧线结构	情感旅程
教程	2-5 分钟	分步讲解	清晰的进展、停顿

音效类别

UI/交互

• 呼啸声 — 转场、显现
• 啵声 — 按钮、勾选标记、成功
• 点击声 — 选择、交互
• 唰声 — 快速移动、滑动

强调

• 撞击声 — 重要时刻、显现
• 轰鸣声 — 重大揭示、发布
• 叮声 — 成就、完成
• 铃声 — 通知、提醒

环境音

• 嗡鸣声 — 营造背景科技感
• 质感音 — 微妙的氛围
• 渐强音 — 营造期待感
• 混响尾音 — 空间感、戏剧感

反模式

• 随意使用缓动 — 每个动画都应有经过设计的时间安排
• 过度动画 — 不是什么东西都需要弹跳
• 层次不清 — 观众不应猜测该看哪里
• 音画不匹配 — 声音必须强化视觉效果
• 缺少留白 — 场景需要空间来呈现效果
• 风格不一致 — 视觉语言应当连贯
• 忽略故事弧线 — 即使是抽象视频也需要流畅的脉络

质量检查清单

完成视频规格前，请检查：

• 每个场景都有清晰的视觉层次
• 时间安排符合自然节奏
• 音频支持并增强视觉效果
• 音效强调关键时刻
• 转场流畅且目的明确
• 故事弧线清晰（吸引注意 → 铺垫 → 高潮 → 收束）
• 技术规格完整，可供实现
• 每个元素都服务于叙事
• 节奏与内容复杂度相匹配
• 结尾有令人满意的收束

专家提示

时间安排

• 尽可能让动作落在音乐节拍上
• 使用时间安排的“三分法则”：1/3 用于预备，1/3 用于动作，1/3 用于后续延展
• 改变时间安排以形成节奏（避免机械重复）

视觉设计

• 使用对比引导注意力（颜色、大小、运动）
• 将调色板限制在 3-5 种颜色，以保持协调
• 字体层次：标题 → 副标题 → 正文
• 留白是设计元素，而非空白区域

音频设计

• 播放音效时，将背景音乐音量降低（-6dB 至 -12dB）
• 叠加 2-3 种音效，营造丰富饱满的声音
• 策略性地使用静音来增强效果
• 音乐应淡入/淡出，不要突然切断

动画

• 弹簧动画感觉自然（阻尼：平滑效果用 200，弹跳效果用 20）
• 对机械式 UI 元素使用缓动
• 对动画进行分组：错开 5-10 帧，以形成流畅效果
• 退出动画应比进入动画更快（3:2 的比例）

何时查阅规则

如需了解特定方面的详细指导：

• rules/scene-composition.md — 视觉层级与场景调度
• rules/timing-pacing.md — 帧时长与节奏
• rules/audio-design.md — 音乐与音频策略
• rules/sound-effects.md — 音效的选择与放置
• rules/transitions.md — 场景转场与衔接
• rules/visual-hierarchy.md — 引导注意力
• rules/storytelling-flow.md — 叙事结构
• rules/camera-movement.md — 虚拟摄像机技巧