Kain并不是颜色区分很好的例子，但是因为他看起来很酷，所以……呵呵 在小镇中随机选择的一个NPC。这里用到颜色区分的区域主要在头发上。 桃色的发髻和头发的颜色差别很明显，所以这里不需要黑色勾边。如果加上勾边，想像一下会出现什么情况？ 你的眼睛将无法分辨出哪是眼睛哪是头发。使用颜色区分使头发和脸部衬托出黑色的眼睛。 观察她的躯干（包括脖子到腰以及手臂）。这里唯一的黑色是整个区域的轮廓……这里没有黑色给衣服和皮肤勾边，但是你可以说出她穿了什么，对吧？ 看，假如你只有2个像素高的身体给你画细节，你将没有多余的空间用来勾边……如我之前所说的，很多时候使用黑色勾边会使角色看起来灰暗，因为黑色比任何颜色都强烈。观察头发上的黄色点，你知道那是什么对吗？ 类似头花的小饰物，也没有勾边。在躯干内部有两条黑色的线，分别表示下巴和腰部分界，这是必要的结构线。 如果没有结构线，角色就变成一大团颜色了。这个就需要多练习以及熟悉人体解剖。 Cecil和Kain，最终幻想2某场剧情中的精灵。16×24像素，尺寸和16×16的不一样。 因为如此他们有更多的细节，同样使用颜色区分。看，现在画家有8个甚至更多的像素来画细节。…

现在你已经阅读了前面的章节并且开始自己分析如何制作一个精灵……恩，是时候开始制作精灵了。之前我们看过很多不同的精灵，但是我们会从基础的精灵开始（RPG游戏的精灵），类似最终幻想风格的。 如果你对制作16×16的精灵不感兴趣，而想学如何制作大尺寸的精灵，那么还是希望你耐心读完本章……从这里学到的技术同样可以用来制作大尺寸的精灵。尽你所能努力学习吧。 那么我们从最终幻想2的精灵开始： 关于FF2精灵首先要了解的是他们都以某种方式分块绘制……这是一个16×16像素的盒子……左边有一条橙色、黄色、橙色的线。这些线标示了各部分的起止点。 FF2精灵腰部以下是3个像素（底部的橙色区），躯干到下巴是3个像素（中间的黄色区），头部有10个像素（顶部橙色区）。人们通常称之为“SD”风格……SD指“突然变形”，被用来形容卡通片中某个正常角色突然变的像娃娃一样，头变的很大，身子却很小……这是FF2采用的风格，也是早期RPG游戏普遍使用的风格。 大部分SD风格游戏出产于。因为在SD风格被大量应用于动画片，**人积累了很多绘制SD风格的经验。 而在西方，我们倾向于写实的风格，角色的头身大体是1：7。按写实比例，16像素高的精灵头部将只有2个像素……使用大尺寸头部的原因：玩家通过辨认不同的头部细节来区分角色，同时较大尺寸也有利于绘制表情……表情可以使角色有活力更有趣……现在你知道SD风格流行这么久的原因了吧？ 呵呵，这是我个人的猜测…… 那么我们从基本的头部开始。这是一点一点绘制的FF2精灵头部构造……许多美术师都会这么做，如果他们要画很多精灵，那么首先绘制一个模板精灵，然后在此基础上增加细节就可以变成很多精灵了。 这是一个节约时间的好方法……但是你必须保证在模板精灵上绘制足够的细节以区分彼此，而不仅仅是更换几个颜色，呵呵……两只眼睛之间空了2个像素，眼睛是2个像素高，眼睛到脸颊和下巴都是1像素。所有这些比例都应该看起来是合理的。…

现在我加上明暗完成了精灵。当你上明暗的时候，试着设想一个固定方向的光源……这里我设想在角色右上方有一个光源，那么所有的阴影都在左下方。 人们通常喜欢给左右两边上阴影，使中间成为亮部……这意味着光源在角色的正前方……这样做没错，但是这会使精灵看起来枯燥因为左边和右边的阴影对称，只有中间部分有一些变化。这解释起来有点怪，但是这样的光源设定使精灵变的很对称和没有意思。 侧光可以更好的表现精灵的体积感。关于阴影到底需要多暗没有一个统一的标准。 你可以多试验一下，看看哪一种效果更好。这里还有一些你需要注意的地方……如果光源很亮（在中午，或者站在火堆旁边等等）阴影会非常暗，这时明暗对比会非常强烈。 如果光源柔和（在屋子里，或者晚上等等）对比也会柔和。你不需要因为精灵所在的场景光源不同而改变精灵的明暗，但是你要考虑因明暗的不同所带来的不同视觉效果。 另一个要注意的是当你眯起眼睛看精灵，如果你不能找到明显的明暗对比，那么你就需要再加强一些了。如果你看不到颜色之间的差别，你就会对明暗困惑，对吧？ 当人们使用黄色的时候就会遇到这个问题……因为黄色本身明度很高，所以黄色明暗变化相比别的颜色要柔和的多。最重要的脸部（通常是黄色的）却比身体其他部分的对比柔和的多。 比黄色强烈的颜色会分散眼睛的注意力。这里没有固定的法则，怎么好看怎么画吧。 一些游戏把脸平涂，这样脸上的细节（眼睛、嘴）就很突出。我在这用了比较强烈的明暗对比。 接下去看看腰部以下的部分。向后摆的腿处在阴影中而且你看不到脚。…

好的，我们完成了一个16×16的RPG游戏角色，效果还不差。“但是我现在想做一个大尺寸角色的格斗游戏！ 你知道吗，要像卡普空游戏中的那样！” 你也许跳过了前一章因为你想做更酷的角色。 如果你的确跳过了前一章，我建议你重新回到该章并仔细阅读。因为不管角色大小，制作角色的规律都是相同的。 而如果你已经做好了这方面上的准备，那么我们就开始吧……首先我要指出的是这里谈论的方法不仅仅适合像素类的游戏，这些方法和技巧同样适用于其他平台游戏的美术开发。记住，学习任何你能学习的东西，并且实际运用到工作中去。 现在我们来看一些少年街霸3代的角色： 这些是非常高级的像素技艺体现。注意到，每个角色有其独有的特色。 Zangief是一个肌肉佬，小樱则是一个小巧的斗士。两个精灵的宽度就很能说明这个问题。 这也告诉我们不同的精灵尺寸是不一样的，不是限制在一个定死的大小内的。小樱的尺寸是76×87，而Zangief的尺寸是116×111。 这个尺寸是基于可见的像素的，但如果Zangief吐出气息而身体往前伸展时，他的水平尺寸会比平时的来得长而垂直尺寸会相对减少。不过这一章讲的是静止的精灵，稍后我们再来考虑这个，我们这一章专注于怎么制作精灵的形象。…

我介绍一下我的方法。把图放在背景层（你确认是RGB色彩模式），新建层。 填充颜色（我选蓝的），图层模式设置为screen（滤色），黑线线变成蓝色的了。这样做是为了使你画的黑线可以清晰显示，如果都是黑色容易混淆。 再新建层，填充白色，设置模式为multiply（正片叠底），这样你就能看到底下的图了。现在你可以画了，铅笔的快捷键是“b”，橡皮的快捷键是“e”。 因为这的白色是透明的（图层模式为multiply正片叠底），所有你可以通过切换前后景颜色（按“x”）来替换橡皮功能。 把缩完后的图放在下面，更改下透明度，然后照着描线。 边描边修改，这个方法可以节约很多时间。脸部的细节完全没有了，所以在这里你要重新绘制。 这里我改了左脚的角度，注意要避免像素挤成一团，去掉多余的像素。有些时候轮廓线会挨着，这样就会像素挤成一团，注意左手和左腿相接的地方。 我做了更改以避免这种情况。 完成了勾线。 脸有一些改变，特别是眼睛，当我上色后你就会明白了。黑色的点是眼球，白色的点则是眼白。…

这个页面有大量的动画GIF文件（豆瓣不支持gif）…在网页上加载时可能会因为数量的原因而播放显得缓慢。你应该可以在你的浏览器里点右键选查看图片（在 Netscape是这样，我并不知道其他的如IE或Opera这些浏览器的选项是否一样）单独观看某张图片，这样的话播放速度就会正常。 读到这章你已经可以自主制作角色（sprite）了。你现在有了一个包括别人和你自己都说酷的角色，但似乎缺少了一点什么：你的人物还不会动。 那现在就让我们给角色添加一些简单的动作让角色鲜活起来，让我们先看看怎么让角色呼吸起来。不过在那之前，我们还是来参考学习一下Capcom公司的例子，这是我们想要达到的效果： 首先让我们来看看这些呼吸动作的动画帧数。 最左边的图是很活跃地跳着的拳王，他看起来就好像要对对手吼着“小子，尽管放马过来吧！！ ”。他的动作幅度和弹性都很大。 而处于最右下角的Guy则是另外一个典型，几乎没有动作，他很轻松的呼吸着，很冷静，似乎在说着“如果你靠近我，你会后悔的…”。这些你赋予人物的动作应该用来表现这些人物的性格和格斗风格。 当然这也并不只限于格斗游戏。任何游戏里只要你需要用到待机动作，这个原则就可以用得上。 这里我用格斗游戏做例子和用格斗游戏的术语来做解释是因为他们是学习角色动画的好例子。从中学到的技巧可以举一反三，运用在其他方面上。…

好，下面就让我们看看怎么一步一步给这个我刚画好的角色加上呼吸动作： 这个人物有110像素高，而且做好准备开架的姿势。接下来我要展示的是如何在像素级上制作呼吸的动画。 如果我制作的是像狮王Blanka那样的动作幅度很大的人物（因为动作幅度大的原因可以保证动作间的区别），我也许会考虑给每一桢单独画一张手稿。但因为这章是讨论另外一个方法的，所以接下来我们说的是剪切加粘贴的方法。 我给他设计的形象是他的上半身会上下晃动，两个拳头则是一上一下的交替运动（当一只手在上面时，另外一只在下面），而他的两条腿也会随着身体的动作稍做弯曲，给整体一点小弹跳的感觉。又或许我会让他的脚踝也稍微的弯曲一下来表现他的动态。 不过这些都仅是我脑海里的计划而已，现在我们来看如何实现它们。第一步要完成的是幅度最大的那个动作…我要将他的上半身往上移2个像素。 在设计中，他的呼吸是很重的，吸气吸得快且深，当吸气逐渐达到最深时（也就是上半身达到最高高度的时候），胸部的动作会逐渐缓慢下来（就好像你跳起来，越达到最高点，速度越慢），然后呼气，再次在另外一个端点逐渐缓慢下来。在像素上来说，这代表着在呼吸的快速部分移动数量比较多的像素，而在慢速的部分移动比较少的像素。 下面来看一下做好呼吸动作的样子： 好了，在一个四桢的动作序列里我们可以看出他的呼吸动作了。我做的步骤仅有将胸部上下移动和稍微整理一下多余像素而已，成图是上面的左边那个图。 用Photoshop来做这种剪切和粘贴的操作再适合不过了，用方形选择工具来选择所要的像素非常简单（配合Shift键做出不规则选区）。这样操作之后，左边的动画看起来已经挺不错了，看起来已经有呼吸的感觉，但看起来还是有点单调。 每一桢的延迟都是一样的，看起来他就像是上半身在上下下上的滑动。我决定要改进他，所以接下来我们要在桢的延迟上做文章，在他达到呼吸的最高点和最低点时，这两桢的延迟是其他过渡桢的两倍。…

这个页面有大量的动画GIF文件…在网页上加载时可能会因为数量的原因而播放显得缓慢。你应该可以在你的浏览器里点右键选查看图片（在Netscape是这样，我并不知道其他的如IE或Opera这些浏览器的选项是否一样）单独观看某张图片，这样的话播放速度就会正常。 好，之前的章节里我们讨论了设计角色和制作角色动画的基础…但剪切加粘贴的技巧只能制作一些基本的动作，对接下来的动画来说是远远不足的。如果你的人物需要一个侧身踢的动作的话，你确实需要将整个新姿势都画出来。 下面还是让我们来看看少年街霸3代的一些图： 如果上面的图因为网页加载图片速度不理想而播放缓慢的话，那正好可以让我们来研究分解动作。现在试观察上面的动画，看看你能不你能说出每一个动画各有多少桢。 另外你还需注意到你每个动作的动作量有多少。上面古烈Guile的踢法是360度回旋踢，大概9桢左右。 轻拳呢，则是5桢的刺拳动作，对于这个动作，可能只有2桢是实打实画的（站立一桢，手臂伸出一桢）。中间过渡桢很容易解决，直接在像素级别下调整部分像素就可以了，就好像我们之前制作呼吸动作一样。 我把中间那行留给了凯琳Karin的飞踢，因为它们看起来实在太酷了，简直就是完美的。直踢有力，回旋踢则轻盈，动作流畅极了。 泰王Sagat的踢法只有几桢，因为你可以从他收腿的动作里看到，这个动作实际上就是踢腿动作的回放。又一个节省时间的好办法，当然还得在保证效果的前提下。 这样处理不影响Sagat的帅劲，但如果我们对第一排第三个古烈Guile的重拳也做同样的处理可能就不大适合了。因为他出拳时手臂是水平伸出的，而收回来时手臂是下沉的，如果我们将他出拳的动作回放来作为收拳动作，看起来他的拳就收得太后了，好像出拳完了之后又得肘击后面的人。 是否运用这个技巧还得按实际情况而定。如果你手头有个摄影头的话，你可以尝试拍下自己做这个动作的样子来研究四肢是如何运动的。…

对于这种动作，基本的制作流程是先画出分解动作然后用像素笔触来描出线稿。因为这个教程是为了个人制作角色（一个人包揽所有工作）而写的，我想重复申明的一点是不要做无用功。 当然，你可以摧残你自己，将每一桢里的人物的表情都画出来，但其实你清楚的知道“在这个动画序列里脸部是保持不变的”，这些就是无用功了。对桢的处理上也是类似的，你知道第五桢里手稍微动那么一下，这种情况下完全没有必要重画第五桢，只需在前一桢的基础上稍做改变就可。 但如果你是大公司的老板，手下有一帮子做原画和做像素的人，那么也许你有必要要求原画画出所有的桢，因为描图的人未必会了解到设计人的意图，他们并不知道怎么填充中间桢。下面给出一些Capcom公司的手绘桢图，来自少年街霸3代。 桢数不少吧。上面那个例子还不错，但下面那个却在一个及其细微的动作上花了好多功夫，最后那三桢几乎是一样的，直接在像素级别下修改会高效很多。 但就如我上面所讲，Capcom是一家大公司，同一个项目上有很多人手，每个任务都变得巨细无遗。如果你看过少年街霸3代的动画（我手头上没有，也许你得上大机上或其他收集这个系列的动画的网站上去观摩一下，另外也可以参考Capcom对SNK这个游戏的动画），你就知道他们将动作分解得如此细致的原因了。 但对于我们个人的练习，我们可以将上面的桢数的奇数桢省略掉，而成品仍然是很流畅的。当然画更多的过渡桢动画会更圆滑，但却不是必须的，因为人脑会自动修补上中间桢。 因为这个的原因，你画出拳这个动作就不需要将拳头每次移动一个像素，你可以一下跳过几个像素，人脑会自动翻译中间的过渡部分。但要控制好“度”的问题，如果省略过多的桢又或移动过多的距离，动画是不可能自然的。 达到以最少的桢数来表现足够自然的动作这种程度是需要不断磨练的。这个跟画画一样是没有捷径的。 利用一下动画片，在播放器里逐桢播放来学习怎么控制动作的桢数。日式动画是很好的教材，因为里面的播放桢率比较低，只画出比较重要的桢数。 而Disney动画里那些超高的播放桢率会对学习造成麻烦。如果观察一下李小龙或成龙的动作，你会发现这些动作通常只有两三桢。…

讲到这步你也许会心存疑问，“为什么不直接用这些画好的帧？为什么要这么辛苦的重新描画？ 稿子上的已经是很细很干净的线稿了啊！”。 我的回答是他们的尺寸不是我们最终成品所要的。如果直接缩小，自动抗锯齿这个功能就会来妨碍我们，加入多余的中间像素，如下图所示： 自动抗锯齿是一种平滑图像的方法，如果你在白色背景上有一黑色直线，自动抗锯齿就会帮你在黑线上加入灰色的像素来过渡，这样的直线在稍远一点的距离看来就很圆滑了（对于弧线来说更是）。 这个对于一般的CG来说是好事，但对于像素精灵来说，它就是噩梦了。就像上图那样，精灵的外边缘分布着一些浅灰色(非纯白)的像素。 游戏里很少运用自动抗锯齿（除了一些很新的3D游戏，而且也不是所有的3D游戏用上了这个技术）因为需要额外计算中间过渡像素会将性能降低。如果一个人物跑过一个以彩虹为背景的背景，那么程序就得为每一个角色计算出跑过各种颜色背景时外边线的过渡像素，对于现有硬件来说还是太大的负荷了。 实际上玩家在玩电视和街机游戏时因为电视屏幕的渲染，一般都觉察不到像素的存在。而当你在电脑上玩模拟游戏时能觉察到这个是因为电脑的屏幕比较精确。 说这么多，其实我就是想说明在创作像素画时，自动抗锯齿是不需要的。当然，你可以将草图缩小然后逐个的将那些自动加的过渡像素删除，但我觉得这样跟重描所花的功夫相差不大，所以我选择重描线图。 另外一点如果你观察她的手指和脚趾，因为尺寸问题和自动抗锯齿的介入，你很难分辨出手指脚趾间的区别。通过重描线图，我可以重新刻画这些部位来表现更好的效果。 最后还有一个原因是添加自动抗锯齿后颜色总数为37。如果你的色板每次每屏只允许256色（标准的VGA色板，超级任天堂和Genesis游戏也是用的这个标准），你就已经浪费掉了37色，得出的效果也仅是黑白的而已。…