帧时长与节奏|让动画"活"起来的秘密
节奏比帧数更重要
一个只有 4 帧的走路动画,如果节奏对了,看起来比一个 12 帧但节奏平平的走路动画更"活"。
节奏 = 每帧的时长分配。正确的节奏不是平均分配,而是关键帧停一拍、过渡帧快一点。
三种经典动画节奏
1. 挤压拉伸(Squash & Stretch)
这是所有动画的第一课,也是最容易被忽略的——物体在运动时形状会变化。
经典弹跳小球:
| 帧 | 位置 | 形状 | 时长 |
|---|---|---|---|
| 1 | 起点(最高) | 正圆 | 100ms |
| 2 | 下落中 | 略拉长 | 80ms |
| 3 | 落地瞬间 | 压扁(10×6,总宽不变) | 200ms(关键帧停一拍) |
| 4 | 弹起 | 拉长(6×10) | 80ms |
| 5 | 回到起点 | 正圆 | 100ms |
注意两点:
- 压扁时总体积不变——横向变宽、纵向变窄,不能压扁了体积也变小(那会像果冻融化)
- 落地帧时长翻倍——落地是整个弹跳的关键动作,必须停一下让观众看清
2. 缓入缓出(Ease In / Ease Out)
物体从静止到运动、从运动到静止,不是瞬间变化的,而是慢→快→慢。
比如角色从站立到开始走路:
| 帧 | 动作 | 时长 |
|---|---|---|
| 1 | 站立(起步前) | 150ms(缓入:慢慢蓄势) |
| 2 | 迈出第一步 | 100ms(过渡) |
| 3 | 第二步 | 80ms(加速) |
| 4 | 第三步 | 80ms |
| 5 | 第四步 | 100ms |
| 6 | 第五步(停下) | 200ms(缓出:减速停住) |
走路循环本身是匀速的(80~100ms 每帧),但起步和停下需要缓入缓出的节奏。
3. 关键帧停顿
任何"让观众意识到某个动作发生了"的时刻——都应该停一拍:
- 攻击的接触帧:拳头碰到对手的那一帧 → 时长翻倍
- 跳跃的最高点:在空中悬停的瞬间 → 时长翻倍
- 走路的脚着地:脚踩在地上的那一帧 → 时长翻倍
- 闪烁动画的亮帧:光标最亮的那一帧 → 时长略长
关键帧停顿让动作有"重量感"——不停顿的攻击看起来像"挥了一下空气",停顿一下才像真的打中了什么。
快速自检清单
画完动画、播放预览时,按这个顺序检查:
- [ ] 有没有所有帧时长完全一样?如果有,调整关键帧的时长
- [ ] 关键动作(接触点、最高点、转折点)的帧有没有停一拍?
- [ ] 起步和停下有没有缓入缓出?
- [ ] 乒乓模式的两个极端帧有没有设置更长的时长(比如闪烁的最亮帧和最暗帧)?
- [ ] 缩到正常尺寸看动画——如果还能看清每个关键姿势,节奏就对了
Aseprite 里调时长的技巧
- 选中多帧后批量设置时长(Ctrl+A 全选 → 右键 → Set Frame Duration)
- 关键帧设好时长后,剩下的帧保持默认 100ms 就好
- 导出 GIF 前整体加快一档(实际设 80ms,GIF 播放器自动拉到 100ms)
- Sprite Sheet 导出后,在引擎里手动设相同的帧时长