iOS App 来了!iPhone & iPad 都能用,随时随地创作,GIF 视频随便做!
获取 iOS App →

像素动画指南:让小角色看起来活着

像素动画示例

一份轻量的像素角色动画指南:从轮廓、配色、主动作到小细节,让角色动得清楚又有性格。

像素画很吃克制。几个像素就能暗示表情、动作和角色性格。加上动画以后,难点就变成了:让它动起来,同时不要丢掉原本清楚的形状。

这篇不会讲大型 Sprite 流程,也不假装一个按钮能解决所有事。我们只看一些能让小角色更容易读懂的习惯。

先看轮廓

细节之前,先看剪影。如果角色涂成一个颜色也能认出来,动起来就成功了一半。

适合新手的轮廓都很简单:圆果冻、方形机器人、高高的蘑菇、幽灵形状、有耳朵的猫猫头。小手、小配件和表情可以后面再加。

限制颜色数量

两到四种颜色通常已经够用。有限的色板会让动画更干净,也会逼每个像素都更有作用。

如果画面觉得平,可以先调对比度,而不是立刻加新颜色。更深的外轮廓或更亮的高光,往往比第五种颜色更有效。

先确定主动作

用一句话说清楚角色在做什么:

  • 果冻在呼吸。
  • 机器人在挥手。
  • 蘑菇在弹跳。
  • 幽灵在漂。

这句话就是边界。和它无关的细节,先不要加。

帧数可以少一点

小尺寸像素动画不一定需要很多信息。一个呼吸循环可以只有两三个状态,一个弹跳可以是压扁、拉长、回到原位。

WigglyPaint 的线条本来就会带一点运动感,所以结构可以比传统逐帧更简单。

留住锚点

角色动起来时,总要有一些地方相对稳定。脚接触地面,影子在身体下方,脸的中心不要无理由乱飘。

锚点能避免角色看起来像融化了。

加一个次要细节

主动作成立后,再加一个小细节:

  • 头发轻轻弹一下
  • 围巾慢半拍
  • 眨一下眼
  • 一颗星星闪一下
  • 影子被拉长一点

一个细节会显得用心,五个细节可能会变得难读。

常见问题

  • 外轮廓粗细忽然变化
  • 小尺寸里塞了太多颜色
  • 细节破坏了剪影
  • 动作太快,来不及看清
  • 循环回到开头时突然跳一下

这些都不是大问题。它们通常只是在提醒你:可以再简化一点。

一个很好的第一个角色

画一个果冻块,加两只眼睛。底部稍微压平,让它像站在地上。让身体轻轻呼吸,再加一个高光,移动得比身体少一点。

这就够了。如果它看起来像活着,你已经学到重点。

做一个小循环

角色小一点,动作清楚一点,剩下的可爱感交给晃动。

试试 WigglyPaint