极简像素画角色跑步动画教程：四帧循环跑步

前言

大家好，今天分享一篇像素画跑步动画教程。教程灵感来自 @angrysnail 的跑步小人，用很少的像素就能做出有辨识度的跑步循环，还能通过发型、背包、服装等小改动做出不同角色。

我会用 Aseprite 演示，如果你用免费工具，可以用 Pixilart 等替代。

下面按步骤从静帧小人做到四帧跑步循环，并加上阴影和扬尘效果。

第一步：画第一个小人

先用肤色画一个 5×5 像素的头部方块，我用的是 #eec39a，背景用蓝色 #639bff 方便观察。

在底部中间加 3 个像素作为脖子，并擦掉左上角一格。

加上眼睛和头发，我用了绿色 #872222 和深红 #ac3232，你可以按自己喜好改颜色。

在脖子下画 5×4 的身体（我用 #872287），下面一行蓝色 #225487 当短裤，再画一行作为左腿。

选一个稍深的肤色做四肢和脖子下方的下巴阴影，例如从 #eec39a 的 Shades 里选 #e7a96e。

加上鞋子。现在看起来可能有点怪，动起来就会自然很多。

第二步：复制并改出第二个角色

复制第一个小人，然后改发型、眼睛、上衣颜色和体型：比如金发、更多头发、深蓝眼睛、绿色上衣，缩短躯干、抬高手臂、加长一条腿，这样两个角色就有区分度。

第三步：做四帧跑步循环

新建一帧，帧就是动画里的每一格。

跑步或走路循环里，腿从伸展→收回→抬起→再向前伸展，如此循环。

第一帧：身体和头下移一格，擦掉原来的腿但保留脚，整体矮 1 像素，形成上下起伏；手臂伸直向下，前腿收回 1 像素。

第二个角色同理，腿可以缩短而不是完全擦掉。

再新建一帧。手臂摆到后面，另一侧手臂出现；一条腿在身后只露出鞋，另一条腿带着短裤和鞋在前。身体高度恢复，形成起伏。

第四帧和第二帧类似，但腿左右相反：又是“压低”的一帧，手臂伸直，腿的位置对调。

这样四帧跑循环就完成了。

导出时选 GIF 并设为无限循环。

可以加一层共享图层画地面阴影（所有帧共用），再单独一层画扬尘，从后脚蹬地处飞出。

用取色器或色板（如 w3schools 的 color picker）选比背景蓝深一两档的颜色画阴影和扬尘，再给衣服、头发加一点暗部。

如果上衣阴影太重，可以只加深一档而不是两档。

导出后如果觉得在 GIF 里阴影比在 Aseprite 里更明显，可以回软件里微调。

下面是 1:1 尺寸的动画和精灵表，方便你对照帧与图层。

结语

这篇教程把“静帧小人 → 双角色 → 四帧跑步 → 阴影与扬尘”串起来做了一遍，用的都是基础操作。

你可以在同一套循环上换颜色、换发型和服装，快速做出一组跑步角色。

如果你按这个流程做了自己的跑步动画，欢迎在评论区分享～