topdown俯视角角色攻击动画:六帧与三种武器
今天这篇来自我常看的 SLYNYRD 的 Pixelblog 56:Top Down Character Attack Animation。作者 Raymond Schlitter 在已有 8 方向 idle / 跑步的基础上,给同一个角色做了剑、矛、锤三种武器的攻击动画,并且把「动作阶段」和「帧时序」讲得很清楚。我按自己的理解整理成一篇第一人称笔记,方便以后做俯视角攻击时直接对照。
一、动作拆解:五阶段六帧
无论朝哪个方向,一次攻击都是6 帧完成;按武器不同,会落在4~5 个阶段,每帧的停留时间(frame timing)也不同。
阶段 作用 帧数Anticipation(蓄力)武器后拉,为挥击蓄势,让打击更有重量感 1 帧,时长可变Smear(运动模糊)动作幅度最大,武器带拖影,强调速度与轨迹 多帧、短时长Rebound(回弹)仅锤子等触地武器需要,触地后轻微弹起 1 帧(可选)Follow Through(延伸)攻击完全伸展,可再进 1 pixel,无 smear 1 帧,时长较长Recover(收招)武器收回 idle 姿态 1 帧
要点:蓄力帧和收招帧不要做 smear,否则会抢掉「向前挥击」的注意力;帧时序会直接体现武器重量和手感。
二、剑:中规中矩的短剑
短剑攻速快、蓄力和收招都短,适合做「普攻」感。挥砍范围通过身体与剑的横扫体现,smear 用棱角分明的形状强化力度。八方向会刻意微调角度,让 hitbox 在各方向相对均衡。
- 帧时序(ms):100, 50, 50, 50, 100, 50
- 总周期:400 ms
矛的射程更长,代价是蓄力和 follow through 明显拉长,整体更「蓄力一击」的感觉。注意 idle 时是反手握矛,攻击时从反手转为刺出,和剑的举剑姿态要区分开。
- 帧时序(ms):200, 50, 50, 50, 150, 50
- 总周期:550 ms
锤子把蓄力、延伸、收招都拉得更长,再加上触地后的 rebound 帧,配合屏幕震动,重量感就出来了。轨迹比剑更集中,hitbox 更窄,用「单次高伤害」来平衡。
- 帧时序(ms):250, 50, 50, 50, 300, 100
- 总周期:800 ms
教程里强调了两点我很受用:动画是一帧一帧做出来的,八方向一开始会让人头大,但拆成阶段和帧时序之后就好排期;蓄力 / 收招不用 smear,把 smear 留给「向前挥」的那几帧,读招会更清晰。原文还提到可以按需做 run + 完整角色设计的攻击动画,这篇则先用 dummy 把剑 / 矛 / 锤三种武器变体讲透,方便直接套到自己的角色上。
- :Pixelblog 56 - Top Down Character Attack Animation[1] by Raymond Schlitter(SLYNYRD)
Pixelblog 56 - Top Down Character Attack Animation: https://www.slynyrd.com/blog/2025/5/23/pixelblog-56-top-down-character-attack-animation
热门跟贴