像素畫格斗動畫入門：拳擊與踢腿動作完全解析

大家好，我是 Lucy！

今天超級興奮能和大家分享這個格斗動作動畫教程。從學(xué)習(xí)人體比例到終于能讓角色做出帥氣的格斗動作，這一路走來真的需要很多耐心和專注。

現(xiàn)在，我們終于可以讓角色揮舞拳頭、踢出利落的腿法了！

不過別被興奮沖昏頭腦，我們還是要保持嚴(yán)謹(jǐn)?shù)姆椒▉砻鎸@個挑戰(zhàn)。

在開始深入之前，我想先說明一下這個人體解剖系列的藝術(shù)風(fēng)格定位。雖然核心目的是掌握真實的人體結(jié)構(gòu)，但動畫風(fēng)格是基于一個假想街機(jī)動作/清版格斗游戲的設(shè)定。

我參考了真實的格斗運動原理，但會通過街機(jī)游戲設(shè)計的鏡頭進(jìn)行篩選，優(yōu)先考慮游戲性和簡潔性。我把這種風(fēng)格稱為"超寫實"，更接近《怒之鐵拳》而不是《波斯王子》的風(fēng)格。

系列回顧： 想要做出流暢的格斗動作，前面的基礎(chǔ)很重要。如果你是新接觸這個系列，建議先看看之前的教程：

• 人體解剖基礎(chǔ)[1]
• 行走循環(huán)[2]
• 格斗待機(jī)姿勢[3]

刺拳被稱為拳擊運動中最基礎(chǔ)但也最有用的拳法，是格斗對話中的完美開場白。

從格斗站姿出發(fā)，前手從下巴高度快速直線擊出，手臂完全伸展，身體輕微前傾并伴隨臀部扭轉(zhuǎn)。

刺拳動作逐幀分解，注意手臂的快速伸展

這個動作的關(guān)鍵是要快，不能有明顯的蓄力動作讓人提前預(yù)判。同時要最小程度破壞格斗站姿，這樣防守姿勢能瞬間恢復(fù)。作為低風(fēng)險/回報的招式，非常適合用來開啟連招或創(chuàng)造機(jī)會讓后續(xù)重?fù)裘小］斎胙舆t最小，是安全可靠的快速連打招式。

關(guān)鍵幀解析：

1. 動態(tài)模糊幀（Smear）：第一幀是"動態(tài)模糊"，用抽象的線條捕捉最強(qiáng)運動點的速度感。模糊幀的顏色要保持簡單以便更清晰地閱讀動作。核心打擊姿勢基本上在模糊幀中就已經(jīng)完成了，只是少了模糊效果。

2. 前拳：從前肩直接擊出，頭部下沉 1 像素。前膝彎曲下沉 1 像素，后腳從身體向外轉(zhuǎn)動。

3. 軀干：在胯部前傾 2 像素，胸部位置更劇烈地前傾 3 像素。

4. 擊中幀（Hit）：整個身體進(jìn)一步前傾幾像素，前膝輕微彎曲，腳跟抬起。注意幀時間，以毫秒顯示在每幀旁邊，擊中幀會稍長以增強(qiáng)沖擊感。

5. 跟隨幀（Follow Through）：幾乎與擊中幀相同，但出拳手臂從肩部樞軸再向前伸展 1 像素。

6. 恢復(fù)幀（Recover）：雙腿幾乎回到待機(jī)位置，出拳手臂向身體彎曲回一半的位置。

7. 過沖幀（Overshoot）：過沖幀與待機(jī)第一幀相同，但向后偏移 1 像素，創(chuàng)造出每次出拳后有力的回彈效果。

直拳（也叫后手直拳）從優(yōu)勢手發(fā)出，是一記更重的攻擊。為了獲得更大的力量，這招包含了一個短暫的蓄力，通過初始的"拉"和"加載"幀來傳達(dá)。

雖然這造成從輸入到命中的輕微延遲，但風(fēng)險通過更大的傷害潛力來補(bǔ)償。

直拳動作需要蓄力，威力更大但前搖明顯

我建議把它設(shè)計成在幾次刺拳后自動觸發(fā)的連招終結(jié)技，而不是單獨輸入的招式。

關(guān)鍵幀解析：

1. 加載幀（Load）：從待機(jī)位置滾動開始，動畫以"加載"幀開始，雙拳抬高，手肘像雞翅一樣張開，出拳手臂的角度更銳利。雙膝輕微伸直，從膝蓋以上抬高整個身體。后腳跟微妙地向外轉(zhuǎn)動，腳趾向身體內(nèi)收 1 像素，造成透視縮短。

2. 拉幀（Pull）：幾乎與加載幀相同，但出拳前臂（亮綠色部分）向后拉 1 像素。

3. 動態(tài)模糊幀（Smear）：臀部扭轉(zhuǎn)，讓整個身體進(jìn)入側(cè)面輪廓視角。前膝彎曲并向前移動 4 像素，后膝向前移動 9 像素、向下移動 6 像素。后腳跟大幅離地，腳呈 67.5 度角。出拳手臂直接擊出接近完全伸展，而頭部下沉 2 像素。后手臂向后擺動，讓手肘能看到突出于軀干后方。

4. 擊中幀（Hit）：整個軀干和前臂再向前傾斜 1 像素，同時后臂再向后移動 1 像素。后膝和腳跟向后移動 1 像素，但腳掌保持著地。

5. 跟隨幀（Follow Through）：幾乎與擊中幀相同，但出拳手臂從肩部樞軸再向前推動 1 像素。胸部也向前旋轉(zhuǎn) 1 像素，伴隨子像素移動。

6. 恢復(fù)幀（Recover）：后腳跟著地，前膝回移 3 像素，后膝回移 3 像素、上移 2 像素。軀干向后移動，臀部旋轉(zhuǎn)回待機(jī)站姿的一半位置。出拳手臂向身體拉回，同時后臂向前移動，兩者都回到待機(jī)位置的一半。

7. 過沖幀（Overshoot）：非常相似于待機(jī)第一幀，但膝蓋向后偏移 1 像素，整個精靈從待機(jī)腳步位置向后偏移 1 像素。

女性格斗者利用比男性對手更低的重心和相對更強(qiáng)的腿部力量，運用快速的遠(yuǎn)程踢擊。

前踢可以輕易地從任意一條腿發(fā)起，但根據(jù)執(zhí)行方式也能爆發(fā)出驚人的力量。

前踢動作快速直接，適合作為基礎(chǔ)攻擊

執(zhí)行方式是先將膝蓋直直抬起——越高越好。武術(shù)中的很多踢擊都先以這種方式"蓄力"，它把腿部置于可以施展多種打擊的位置，同時保持中心平衡。一旦膝蓋達(dá)到最高點，腳就快速向前彈出。

關(guān)鍵幀解析：

1. 動態(tài)模糊幀（Smear）：為了提供快速的基礎(chǔ)攻擊和最小延遲，動畫直接進(jìn)入腿部向前彈出的狀態(tài)，蓄力動作只在動態(tài)模糊中暗示。從待機(jī)站姿開始，臀部扭轉(zhuǎn)，讓人物呈現(xiàn)側(cè)面輪廓。后腿伸直并向前帶，整體高度從待機(jī)序列第一幀抬高 5 像素。雙臂抬高，前拳到達(dá)頭頂高度，后拳大約在肩膀高度。

2. 擊中幀（Hit）：非常相似于動態(tài)模糊幀，但移除了模糊效果，整個踢擊腿從臀部樞軸向前移動 1 像素，并進(jìn)一步伸直，腳抬高 1 像素。后膝和臀部輕微前移 1 像素但高度不變。動量讓胸部向前移動 1 像素。

3. 跟隨幀（Follow Through）：前腿向后波動到動態(tài)模糊幀的位置，減去模糊。后腿保持不動，但臀部有輕微的凹陷。前手肘降低 1 像素，同時后臂向后移動 1 像素。胸部向后移動 1 像素。

4. 過沖幀（Overshoot）：過沖幀與待機(jī)第一幀相同，但向后偏移 1 像素。

回旋踢利用更多的臀部運動獲得比前踢更強(qiáng)的力量，允許更高的打擊點直接命中對手頭部。與男性的直拳類似，回旋踢包含 2 個預(yù)備幀來暗示更大的力量。

此外，它還使用延遲、屏幕震動和更重的擊中效果來強(qiáng)調(diào)腿部的雷霆之力。

回旋踢威力巨大，適合作為終結(jié)技

關(guān)鍵幀解析：

1. 加載幀（Load）：踢擊蓄力的第一幀將踢擊腿和前臂從待機(jī)位置大幅移動，需要使用動態(tài)模糊。由于動作流向踢擊將要彈出的方向，動態(tài)模糊效果很好。然而，如果與運動方向相反（如直拳的加載幀），動態(tài)模糊會削弱動作感。膝蓋直直向上抬起，同時腳向身體蜷曲以增加運動幅度，為踢擊發(fā)出時彈簧彈出做準(zhǔn)備。后腿部分伸直但仍保持輕微彎曲，腳輕微向外轉(zhuǎn)動。頭頂從待機(jī)序列第一幀抬高 1 像素。

2. 彈簧幀（Spring）：踢擊腿的膝蓋進(jìn)一步抬高，腳向下擺動與膝蓋對齊。支撐腿進(jìn)一步伸直并向外轉(zhuǎn)動，從臀部以上抬高 2 像素。前臂向上抬起并開始向前伸直，同時后前臂輕微向上旋轉(zhuǎn)。

3. 動態(tài)模糊幀（Smear）：踢擊腿快速向外、向上彈出，支撐腿向前樞軸轉(zhuǎn)到直立位置同時向外轉(zhuǎn)動，進(jìn)一步造成透視縮短。臀部扭轉(zhuǎn)進(jìn)入踢擊，露出大部分背部和臀部，同時整個軀干向后樞軸約 45 度。前臂伸直并向外伸展與踢擊腿平行。后前臂保持相對位置同時隨軀干向后旋轉(zhuǎn)。

4. 擊中幀（Hit）：非常相似于動態(tài)模糊幀，但整個身體（除了后前臂）從支撐腿膝蓋的樞軸向前傾斜 1 像素。擊中效果從這一幀開始。

5. 跟隨幀（Follow Through）：踢擊腿從膝蓋樞軸向內(nèi)、向下彎曲 1 像素，同時腳輕微向下旋轉(zhuǎn)。后前臂向后、向下移動 1 像素。

6. 恢復(fù)幀（Recover）：臀部扭轉(zhuǎn)回來，讓整個身體進(jìn)入側(cè)面輪廓，同時軀干旋轉(zhuǎn)挺直。前前臂向后旋轉(zhuǎn)，手肘保持抬高。后臂向上擺動到類似位置，讓雙拳都在眼睛高度。踢擊腿向后向下擺動，膝蓋降低。后腿向后彎曲，腳向前旋轉(zhuǎn)，讓后臀部回移 6 像素。

7. 過沖幀（Overshoot）：過沖幀與待機(jī)第一幀相同，但向后偏移 1 像素。

在基本動作的基礎(chǔ)上，我們給人物穿上經(jīng)典的西裝革履格斗者造型。

這可不只是換個調(diào)色板，布料和頭發(fā)的物理效果必須仔細(xì)考慮。

西裝版本的刺拳，注意領(lǐng)帶和衣擺的動態(tài)

西裝直拳，頭發(fā)和褲線的細(xì)節(jié)增加質(zhì)感

關(guān)于布料褶皺動態(tài)的技巧，我在之前的教程中已經(jīng)說了很多。使用參考資料，在鏡子前自己做出這些動作，分析布料的褶皺方向。嘗試給頭發(fā)和布料最松垮的地方增加生動的動態(tài)。保持細(xì)節(jié)簡潔，一次專注于一個區(qū)域、一幀。從主形體的固有色和動態(tài)開始，再處理子像素動畫。

與其創(chuàng)造復(fù)雜細(xì)節(jié)導(dǎo)致動作中產(chǎn)生雜亂的噪點，不如用最少的顏色和細(xì)節(jié)保持動作的清晰可讀性。要得到滿意的效果需要反復(fù)試驗。

西裝比較貼身，不會給整體形態(tài)增加太多額外動態(tài)，但子像素細(xì)節(jié)大大增強(qiáng)了深度，并可視化了在基礎(chǔ)版本中只能暗示的動態(tài)。例如，褲腿上的縫線幫助說明臀部的扭轉(zhuǎn)和身體的旋轉(zhuǎn)。頭發(fā)的擺動增加角色性格，同時增強(qiáng)速度和沖擊感。

快速連續(xù)技，沒有中間的待機(jī)幀

女性角色著裝腿法

女性致命殺手的緊身短裙在折疊布料動態(tài)方面不需要太多細(xì)節(jié)。

但頭發(fā)和裙子下擺得到了特別關(guān)注，相比基礎(chǔ)版本增加了驚人的表現(xiàn)力。

裙裝前踢，裙擺和頭發(fā)的動態(tài)是重點

裙裝回旋踢，高跟鞋增加高度和視覺特色

還要注意高跟鞋如何增加高度并改變腳的形狀。主要方法是帶著對物理效果的基本認(rèn)知進(jìn)行反復(fù)試驗。頭發(fā)我就是一直調(diào)整到感覺對了為止。它在踢擊結(jié)束時垂下來，然后在恢復(fù)幀又彈回去，這是關(guān)鍵。而且直到做這個版本我才意識到一點臀部晃動如何增加動量。

穿高跟鞋做這些動作可能有點奇幻，但說真的，高跟鞋砸到臉上肯定能造成不小的傷害。

女性角色的流暢連續(xù)攻擊

結(jié)語

角色動畫的天賦是稀缺的，我自己也不例外。如果你在這個主題上掙扎，我想告訴你我也在掙扎。

然而，從掙扎中獲得的智慧能提供最持久的教訓(xùn)?；仡欉^去，我必須承認(rèn)自己已經(jīng)走了多遠(yuǎn)，但也不能因為已經(jīng)掌握的能力而過度驕傲，要繼續(xù)追求進(jìn)步?；旧希蚁胝f的是我們在變強(qiáng)之前都很菜。

希望我的詳細(xì)方法能提供一些洞察，激勵你接受角色動畫的挑戰(zhàn)。畢竟，你不可能通過滲透作用學(xué)會這些東西。

這個系列要繼續(xù)嗎？跳躍、空中攻擊、受傷、死亡……還有這么多內(nèi)容可以講。我們下次見！

本文改寫自 Slynyrd 的 Pixelblog 第 53 期教程：Punches and Kicks[4]

參考資料

人體解剖基礎(chǔ): https://www.slynyrd.com/blog/2024/3/25/pixelblog-49-realistic-human-anatomy

行走循環(huán): https://www.slynyrd.com/blog/2024/5/24/pixelblog-50-human-walk-cycle

格斗待機(jī)姿勢: https://www.slynyrd.com/blog/2024/9/26/pixelblog-52-idle-fighting-stance

Punches and Kicks: https://www.slynyrd.com/blog/2024/11/25/pixelblog-53-punches-and-kicks