橫版角色攻擊：鞭子攻擊的 smear 與 overshoot

今天的教程來(lái)自 SLYNYRD 的Pixelblog 37 - Castlevania Study

作者 Raymond Schlitter 以《惡魔城 3》為參考，重做了吸血鬼獵人的基礎(chǔ)模型，并在角色攻擊上做了明顯強(qiáng)化——把原本「鞭子伸展一幀」拆成smear（運(yùn)動(dòng)模糊）和overshoot（ overshoot）兩幀，和之前寫(xiě)的近戰(zhàn)揮砍思路一致，只是表現(xiàn)形式是橫版游戲角色攻擊。

一、為什么橫版游戲角色攻擊也要拆幀

教程里主角是 16×16 像素、嚴(yán)格對(duì)齊 16×16 瓦片格的側(cè)視角色（走、蹲、跳、攻擊）。

不要只畫(huà)「鞭子伸出去」的一幀，那樣會(huì)顯得平、沒(méi)有爆發(fā)感。

和俯視角劍擊一樣，側(cè)視鞭擊也可以拆成「蓄力 → 爆發(fā) → 收招」，其中「爆發(fā)」用兩幀來(lái)表現(xiàn)會(huì)更清晰：

• 第 3 幀：smear——鞭子帶拖影、軌跡拉長(zhǎng)，強(qiáng)調(diào)揮出的速度。
• 第 4 幀：overshoot（過(guò)沖）——鞭子略超過(guò)最終位置再定住，讓打擊更有重量感。

這樣玩家一眼能看出「抽出去」的瞬間，而不是「突然多了一根線(xiàn)」。

二、與瓦片格、其他動(dòng)作的配合

教程里所有動(dòng)作都卡在 16×16 格子里：起跳高度 2 格、受擊擊退 2 格、樓梯半步一格，這樣和關(guān)卡設(shè)計(jì)一致。

蹲姿幀被復(fù)用到跳躍：跳躍時(shí)用同一張蹲幀，空中攻擊則用普通攻擊幀，不單獨(dú)做「跳攻」幀，省幀又保持可讀性。

攻擊部分的核心就是上面說(shuō)的：smear + overshoot 兩幀，讓鞭擊從「一根線(xiàn)」變成「一次揮擊」。

三、復(fù)古限制與可讀性

用 NES 色板但沒(méi)死守 NES 的 3 色 + 1 共享限制，在保持復(fù)古感的前提下稍微加了顏色，讓輪廓和攻擊軌跡更清晰。要點(diǎn)是：在低分辨率下，攻擊的「軌跡」和「落點(diǎn)」要能一眼看懂，smear 負(fù)責(zé)軌跡，overshoot 負(fù)責(zé)落點(diǎn)，兩幀分工明確。

四、小結(jié)與延伸

把「?jìng)?cè)視角色攻擊」也當(dāng)成「蓄力 → 爆發(fā)（smear + overshoot）→ 收招」來(lái)拆，和近戰(zhàn)揮砍[1]、俯視角角色攻擊[2]是同一套思路，只是視角和武器不同。原教程里還有怪物 sprite、城堡瓦片等，感興趣可以看原文的 KEY POINTS：多參考、分塊畫(huà)、不描圖、考慮現(xiàn)代屏幕下的像素清晰度。

• ：Pixelblog 37 - Castlevania Study[3] by Raymond Schlitter
• 本站前文：絲滑打擊感：近戰(zhàn)攻擊進(jìn)階[4]、俯視角角色攻擊：六幀與三種武器[5]。

近戰(zhàn)揮砍: 2026-02-20-tutorial-melee.md

俯視角角色攻擊: 2026-02-21-top-down-character-attack-animation.md

Pixelblog 37 - Castlevania Study: https://www.slynyrd.com/blog/2022/3/19/pixelblog-37-classic-castlevania-study

絲滑打擊感：近戰(zhàn)攻擊進(jìn)階: 2026-02-20-tutorial-melee.md

[5]

俯視角角色攻擊：六幀與三種武器: 2026-02-21-top-down-character-attack-animation.md