摘要：像素畫逐幀動畫研究：馬里奧

本文概覽

• 1、結論

• 2、NES/FC（任天堂8位機）：馬里奧

• 3、參考馬里奧：制作3幀行走動畫

1、結論

從馬里奧入手，學習像素畫逐幀動畫。

掌握FC游戲角色動畫制作之后，再學習難度更大的SFC游戲角色動畫，仍然以馬里奧為案例。

這樣你可以清晰的看到，同一款游戲主角隨著游戲主機性能的提升，同一個像素畫游戲角色，細節是如何進化的？品質又是如何提升的？

像素畫的質量，很尺寸大小，顏色數量關系不大，但是和細節關系很大。

1.1、NES/FC和SNES/SFC的差別

在教程開始之前，先了解下NES/FC和SNES/SFC的差別：

主機分辨率顏色數量角色尺寸上限NES/FC 256x240像素 3個+透明色 8x8/8x16像素 SNES/SFC 256x224像素 15個 最小16x16像素

由此可知，像素畫游戲角色的尺寸和登錄的主機緊密相關。

2、NES馬里奧

NES馬里奧美術資源，可以在Sprites-resource.com上獲取。

NES馬里奧

可以看到一張圖片就包含了NES/FC馬里奧角色所有的動畫幀。

注意可以發射子彈的白色背帶褲馬里奧，以及2P綠色馬里奧，都是通過替換顏色板數據來實現的，無需額外增加圖片。

2.1、游戲角色基本動畫

NES馬里奧游戲角色基本動畫包含：

• idle：待機

• walk/run：行走/奔跑

• jump：跳

• hurt：受傷

• dead：死亡

• squat：下蹲

• up/down：爬上/爬下

• swim：游泳

• attack：攻擊

• slide：滑步（這個動作很細膩，模擬跑太快停止時的慣性）

• 貼墻：水下貼墻動作

另外馬里奧有2個形態：

16x16

• 
  

  small：正常形態 16x16像素

極簡像素畫，整個角色只有3個顏色（紅、黃、綠）。

16x32

• 
  

  big：吃完蘑菇變大形態 16x32像素

所有需要2套動作圖。如果你要做一個標準的像素畫游戲，需要制作的角色動畫只會多不會少。類似我昨天做的大魚吃小魚屬于小游戲，動畫就沒那么多。

2.2、1幀動畫

1幀動畫=沒有動畫？

• idle：待機

• jump：跳

• dead：死亡

• squat：下蹲

• slide：滑步

• attack：攻擊

上面6個都是1幀動畫，但是不代表沒有動畫。因為可以用代碼來移動這1幀產生動畫。

比如跳，雖然只有1幀，當玩家按跳躍B鍵，馬里奧就會在代碼的作用起跳。如果起跳之前，正在按住A奔跑，則會跳的更高更遠。

借用其他幀。

起跳和落地都借用了idle站立/待機幀。

• hurt：受傷

受傷動畫只會出現在馬里奧的變大形態，被怪物或陷阱碰到，馬里奧就會閃爍之后變小。嚴格來說受傷動畫為0幀，只是在變大形態和正常形態之間閃爍，借用了2幀。

2.3、2幀動畫

• up/down：爬上/爬下

爬上爬下共用1個動畫，有2幀，需要通過代碼移動實現爬上爬下效果。

可以看到馬里奧的頭部是不變的，在制作像素畫逐幀動畫的時候，不變的身體部件可以復制粘貼，減少工作量。

2.4、多幀動畫

大于2幀的都歸到多幀動畫。

• 
  

• walk/run：行走/奔跑

NES馬里奧的行走/奔跑共用1個動畫，只有3幀，但是效果是拉滿的。幾十年過去，現在看這個動畫，依然是無懈可擊的！完美！

3幀行走動畫序列幀
5幀游泳

• 
  

  swim：游泳

NES馬里奧最復雜的動畫是游泳！一共有5幀。

動的部分只有手臂和腳，頭部，身體都是不動的，學到了。

3、參考馬里奧：制作3幀行走動畫

先按照馬里奧的風格，畫一個自己的極簡小人（站立幀），只能使用3個顏色。

極簡小人

只有3個顏色，真的沒有施展空間。

頭發我想用紅頭發，想起櫻木花道，紅頭發比較適合當主角。

皮膚是肉色，這樣只剩1個顏色了，選1個籃紫色壓一壓，不然這個角色太輕飄飄了，而且眼睛用暗一些的顏色比較合適。（馬里奧用的橄欖綠）

發型的話，其實我想畫平頭，留一撮毛在額頭好了。

鞋子和褲子沒啥創新的，和馬里奧一樣。

手臂我想露出來，衣服改成背心，再加一個紅內衣。

站立幀有了，接著畫行走幀。

3.2、行走動畫小知識
邁腿幀

• 邁腿幀，已邁出，單腿彎曲，此時角色高度最高

• 落地幀，邁出的腿落地，另一腿抬起，此時角色高度最低

• 過渡幀，單腿站直，另一腿提起準備邁出，此時角色高度居中

這一步沒啥說的了，參考馬里奧，把剛才畫好的小人行走幀畫出來。

pario