Lesson 29: Attack and Hurt Animation
Last lesson you learned to draw hit flashes; this lesson embeds those flashes into the action itself — attack animation determines game feel.
Wind-up, hit, and recovery — all three need to feel right before players think "that slash landed solid." Blurry silhouettes, no wind-up, or attack frames that don't match the VFX will feel like waving cardboard.
1. Three-Part Structure: Wind-up → Attack Frame → Recovery
Almost every melee attack breaks into three segments:
| Phase | What it does | What players read |
|---|---|---|
| Wind-up Anticipation | Charge, pull wrist, raise sword | "Something's coming" |
| Attack frame Active / Hit | Weapon at full extension, VFX fires | "It connected" |
| Recovery | Inertia carries through, return to stance | "There's a cost to this" |
Frame counts are just starting points — tune with FPS:
| Power | Wind-up | Attack | Recovery |
|---|---|---|---|
| Light hit | 2–4 | 1–2 | 2–4 |
| Normal | 4–6 | 1–3 | 4–8 |
| Heavy / Ultimate | 8–16 | 2–4 | 8–16 |
Light attacks can have very short or almost no wind-up — too long feels like input lag; heavy attacks should deliberately drag so opponents / players can "read" the move.
Look at this 10-frame slash: Ready → a few charge frames (sword pulled back) → Swing (blade arc appears) → Follow → Recover. Attack frames are usually only one or two, but the whole rhythm is built by what comes before and after.
2. Attack Frame: It Has to "Pop" at a Glance
The attack frame is the peak of the whole sequence:
- Weapon at farthest reach / swing at maximum arc
- Body leans or lunges forward; center of gravity shows "effort"
- Last lesson's hit VFX goes on this frame (sword trail, star flash)
- Hitbox also opens during this segment (too early feels sneaky, too late feels like a fake swing)
When you need more "weight," hold the attack frame a few extra ticks — looks like it landed solid, but don't drag it into slow motion.

Fast-paced melee (punches, jabs) often takes the "almost no wind-up" route: press the button, shadow appears immediately. Adding Anticipation gives more punch but also more "heft" — pick one for your project's style; don't mix them without realizing it.

Thrusts are another pattern: charge at chest → spear / sword suddenly extends → retract. Shape change reads clearer than the whole body twisting randomly.
3. Wind-up / Recovery / Weight
Wind-up must be visible
- Sword pulled back, legs crouch, shoulders twist
- Heavy weapons: raise overhead or drag behind; amplitude should be large
- Optional slight charge glow — don't steal the show
Recovery has a cost
- Blade inertia continues a bit, then returns to Idle
- Heavier weapons = longer recovery (next attack comes later)
- The final hit of a combo can deliberately extend recovery for a "finisher" feel

From stance → charge → smear swing → blade arc lands: the middle frame can be pushed to an extreme "blurred arc"; even at low frame rate, the swing path stays readable.
The recovery pose should connect back to Idle and also set up the next combo's opening — don't end on a weird pose that needs a hard cut.
Weapon differences at a glance:
| Type | Feel | Wind-up / Recovery |
|---|---|---|
| Short sword | Fast, close range | Both short |
| Greatsword / Axe | Slow, brutal, wide range | Both long |
| Spear / Lance | Straight thrust | Medium, long narrow trail |
| Staff | Casting bar | Wind-up can be very long; relies on VFX |
4. Hurt: Prove "I Got Hit"
Hurt isn't just a white flash — the body needs to react too:
Stun (can be 1 frame) → lean back / tilt sideways → return to Idle (or fall)
Layer on top from last lesson: red flash, hit-point sparks, slight knockback, screen shake.
Knockback approximates: fast start, slow stop — first two frames move a lot, later frames move less, stop at a position where you can be hit again or counter.
For combos, remember three things:
- Rhythm variation: light → medium → heavy finisher
- Pose handoff: end of one segment ≈ start of the next
- Input window: usually in the first half of recovery; miss it and you return to Idle
Hitbox / Hurtbox: no attack box during wind-up; opens on attack frame; closes during recovery. Boxes slightly tighter than the blade arc are usually fairer.
5. Homework
Draw a short combat sequence that chains together:
- Attack: pick sword / greatsword / spear / staff, 6–12 frames, including wind-up + attack frame (can attach last lesson's hit flash) + recovery; recommended 32×32 or 48×48, transparent background
- Hurt: same character, 4–6 frames (stun → lean back → return)
- Labels: roughly mark Hitbox on attack frames; mark Hurtbox on the character; note how many frames the box stays open
- Optional: 2–3 hit combo, note which frames can chain into the next move; or test in engine and tune FPS
Next lesson uses a state machine to wire Idle / Walk / Attack / Hurt together — once animation is drawn, you still need to know when each clip is allowed to play.
课程作者:像素熊老师
微信公众号「教你画像素画」 · B站 · X / Twitter · GitHub