極簡(jiǎn)像素畫角色跑步動(dòng)畫教程：四幀循環(huán)跑步

極簡(jiǎn)像素畫角色跑步動(dòng)畫教程：四幀循環(huán)跑步

前言

大家好，今天分享一篇像素畫跑步動(dòng)畫教程。教程靈感來(lái)自 @angrysnail 的跑步小人，用很少的像素就能做出有辨識(shí)度的跑步循環(huán)，還能通過(guò)發(fā)型、背包、服裝等小改動(dòng)做出不同角色。

我會(huì)用 Aseprite 演示，如果你用免費(fèi)工具，可以用 Pixilart 等替代。

下面按步驟從靜幀小人做到四幀跑步循環(huán)，并加上陰影和揚(yáng)塵效果。

第一步：畫第一個(gè)小人

先用膚色畫一個(gè) 5×5 像素的頭部方塊，我用的是 #eec39a，背景用藍(lán)色 #639bff 方便觀察。

在底部中間加 3 個(gè)像素作為脖子，并擦掉左上角一格。

加上眼睛和頭發(fā)，我用了綠色 #872222 和深紅 #ac3232，你可以按自己喜好改顏色。

在脖子下畫 5×4 的身體（我用 #872287），下面一行藍(lán)色 #225487 當(dāng)短褲，再畫一行作為左腿。

選一個(gè)稍深的膚色做四肢和脖子下方的下巴陰影，例如從 #eec39a 的 Shades 里選 #e7a96e。

加上鞋子。現(xiàn)在看起來(lái)可能有點(diǎn)怪，動(dòng)起來(lái)就會(huì)自然很多。

第二步：復(fù)制并改出第二個(gè)角色

復(fù)制第一個(gè)小人，然后改發(fā)型、眼睛、上衣顏色和體型：比如金發(fā)、更多頭發(fā)、深藍(lán)眼睛、綠色上衣，縮短軀干、抬高手臂、加長(zhǎng)一條腿，這樣兩個(gè)角色就有區(qū)分度。

第三步：做四幀跑步循環(huán)

新建一幀，幀就是動(dòng)畫里的每一格。

跑步或走路循環(huán)里，腿從伸展→收回→抬起→再向前伸展，如此循環(huán)。

第一幀：身體和頭下移一格，擦掉原來(lái)的腿但保留腳，整體矮 1 像素，形成上下起伏；手臂伸直向下，前腿收回 1 像素。

第二個(gè)角色同理，腿可以縮短而不是完全擦掉。

再新建一幀。手臂擺到后面，另一側(cè)手臂出現(xiàn)；一條腿在身后只露出鞋，另一條腿帶著短褲和鞋在前。身體高度恢復(fù)，形成起伏。

第四幀和第二幀類似，但腿左右相反：又是“壓低”的一幀，手臂伸直，腿的位置對(duì)調(diào)。

這樣四幀跑循環(huán)就完成了。

導(dǎo)出時(shí)選 GIF 并設(shè)為無(wú)限循環(huán)。

可以加一層共享圖層畫地面陰影（所有幀共用），再單獨(dú)一層畫揚(yáng)塵，從后腳蹬地處飛出。

用取色器或色板（如 w3schools 的 color picker）選比背景藍(lán)深一兩檔的顏色畫陰影和揚(yáng)塵，再給衣服、頭發(fā)加一點(diǎn)暗部。

如果上衣陰影太重，可以只加深一檔而不是兩檔。

導(dǎo)出后如果覺得在 GIF 里陰影比在 Aseprite 里更明顯，可以回軟件里微調(diào)。

下面是 1:1 尺寸的動(dòng)畫和精靈表，方便你對(duì)照幀與圖層。

結(jié)語(yǔ)

這篇教程把“靜幀小人 → 雙角色 → 四幀跑步 → 陰影與揚(yáng)塵”串起來(lái)做了一遍，用的都是基礎(chǔ)操作。

你可以在同一套循環(huán)上換顏色、換發(fā)型和服裝，快速做出一組跑步角色。

如果你按這個(gè)流程做了自己的跑步動(dòng)畫，歡迎在評(píng)論區(qū)分享～