—————————————————————————————————————————

　　下面是一篇很适合领人入门的像素教程，出自独立游戏制作人Derek Yu。由我翻译补充的，如果疏漏还望指正。
　　注：【】里为本人补充内容

　　注:2007年，这个教程在我的个人网站上发布。此后做了一些小的调整,但没有什么重要的改动。
　　在这十个部分的教程中,我将教你如何绘制一个「精灵」,「精灵」是一个独立的2D角色或者物体。这个术语来自视频游戏。
　　我学习像素绘画，是因为我需要为我的游戏作图。经过大量的练习,我越来越擅长绘制像素图，并开始将它视为真实的艺术而不仅仅是一个工具。最近，像素图在游戏开发和插图艺术领域非常受欢迎。
　　几年前，我写了这篇像素画教程的初版，阐述像素图背后的概念。现在这个版本是经过简化了的。网上还有其他的像素教程，但我发现它们过于复杂罗嗦。像素绘画不是科学。画像素图时，你不需要一个个地计算矢量。

　　绘制像素图的一大好处是你并不需要任何花哨的工具，电脑内置的画图工具可能就已经足够了！网上有专门绘制像素图的工具Pro Motion，还有Mac平台上的pixen。说实话，我并没有用过它们，但我听说它们很不错。在本教程中，我将使用Photoshop，这是一只昂贵的野兽，但它适用于所有的绘画种类，而且它有很多对于像素绘画来说非常有用的功能。
　　【虽然有不少像素转化软件，可以方便的将图片转化为像素图，甚至PS里就有像素化的滤镜，不过几乎没有画师是先画出图片然后用工具转的，一是因为多此一举，二是因为用工具转的像素画肯定会有转化混乱的地方，到时候还得一点一点改，远不如直接画简单。常用的绘画软件是SAI和PS，SAI有抖动修正，比较适合画长线会抖的新手，不过我还是建议用PS画，像素图本身就没什么长线要画，不如选择更专业一点的PS】
　　使用Photoshop时，你的主要工具是铅笔（快捷键「B」），而不是画笔。铅笔可以让你填充单独的像素，而不含任何抗锯齿处理。

　　另外两个会用得上的工具是选框（快捷键「M」）和魔术棒（快捷键「W」），用于选择、拖放或复制、粘贴。记住一点，选择的同时按住「Shift」键或「Alt」键，你可以从当前选区中添加或减去。这可以方便你选取不规则的四边形区域。
　　你还得使用吸管工具（快捷键「I」）选取颜色。在像素图中「颜色维持」很重要，所以你会经常选取相同的颜色重用。
　　【颜色维持指的是有选择的使用颜色，使图像的颜色维持在一个风格中。下文会有详细介绍】
　　最后,你得学会使用快捷键，它们可以节省你大量的时间和精力。例如「X」,它是一个切换前景色和背景色的快捷键。

　　像素本质上是一个小的颜色块。你需要学习的第一件事就是如何有效地利用这些块来绘制你想要的线条。我们将讨论两种最基本的线段类型——直线和曲线

　　请注意圆圈圈出的地方，这个锯齿是无法解决的，我们要不让这块肌肉整体都变形，要不就得容忍这个锯齿。像素越少的图像不可避免的锯齿就会越多， 我们能做的仅仅是减少那些可避免的锯齿，对于无法避免的锯齿也不用过多计较，当然，在放弃修正某个锯齿前，你最好先多试试】

　　画出让人舒服的线条对于像素图来说至关重要。接下来,我们将学习如何使用抗锯齿来让我们的线条看起来更光滑。

　　你要做的第一件事是拥有一个好想法。试着在你脑海中或是纸上具象化你想要的像素图。一个简单的画前准备就可以让你专注于实际的像素绘制。

　　1.「精灵」将用于什么场景？
　　用于网站,还是游戏?接下来需要为它做动画吗?如果接下来需要制作「精灵」动画,你可能要让它更小，拥有更少的细节。相反,如果你不需要为这个「精灵」做动画，你就可以把更多的细节放进这个「精灵」里。思考「精灵」的使用场景,会让你工作的更好。

　　2.我该维持什么风格？
　　上文中，我说过「颜色维持」很重要。其中一个原因就是你的色板颜色可能是有限的。受限于硬件（很少是因为这个）或者受限于画面风格。如果你是在模拟一个特定的主机风格（例如64位的NES），则会受限于主机的精度。除了颜色受限，你还得考虑「精灵」的尺寸大小，以及如何让它融入环境，不显突兀。
　　【我不建议完全模仿一个特定的主机风格，比如FC机的同屏发色数只有16色，这显然是不够用的，我们追求的应该是适合游戏风格的画面，而不是一味的追求复古。「颜色维持」更重要的意义在于使整个画面协调，这里面涉及的色彩搭配又是一个大坑，我这儿有些相关资料，感兴趣的可以找我要。实在不想看书，就模仿别人的上色，百度“色板”，有现成的可供参考，或者找好看的图片来提取颜色制作自己的色板】

　　让我们开始进入正题吧！

　　在本教程中，我没有设定任何风格限制。我只是确保「精灵」足够大，方便你看清每一步的细节。为此，我决定用「摔跤律师」来作为教程原型，它是我们这儿最屌的摔跤代理人！它能用于格斗游戏或者其他像「Habeus Corpse Blaster」这样的游戏中。

　　黑色的轮廓线线能为你的「精灵」提供一个良好的基本结构，它是最好的开始步骤。我们选择黑色的原因是因为它好看且醒目。稍后，我会告诉你如何改变轮廓线的颜色来让「精灵」显得更真实。

　　有两种描出轮廓线的方法，一种是直接拖拽出轮廓线，然后再进行清理修改。另一种是从一开始就用像素点一个个的填充成你想要的线条，你懂的，就是点点点。
　　用哪种方法取决于「精灵」的尺寸和你对像素绘画的熟练度。如果一个「精灵」很大，那么拖拽出草图再进行修改，要比用像素填充追求一次性通过容易的多。
　　在这个教程中，我们绘制的是一个相当大的「精灵」，所以我会演示第一种方法，这也更利于文字说明和图片说明。

　　一般来说，即使是较大的「精灵」也不会超过200*200像素。「以少成多」在像素图里再正确不过了，你慢慢会发现，用极少的像素仍能表现极多的不同。
　　【一般独立游戏的「精灵」都没这么大，200200像素在优秀的画师手中都能画的看不出是像素画了。选择几十几十就差不多了，越大的像素图画起来越繁琐，“像素味”也越淡。】
　　让轮廓线简单。细节我们之后会添加，但现在，让我们全神贯注于「打形」，完成例如肌肉分割这样的基础步骤。它现在可能不像你想要画的像素图，但请耐心，这是一个必经的步骤。

　　随着轮廓线的完成，我们有了一幅空白的填色图，PS里的油漆桶和其他填充工具会帮助我们上色，填充颜色可有点难度，色彩理论是个超出本教程范围的话题，不过，这里有些基础概念你最好清楚。

　　HSB代表色调，饱和度，和亮度。这是计算机几种颜色模式（即：数值表示颜色）中的一种，其他的颜色模式是RGB模式和CMYK模式。大多数绘图程序使用HSB模式采色，所以让我们详细讲讲HSB模式。
　　色调——你感知到的颜色。比如「红」「橙」「蓝」等。
　　饱和度——颜色的强烈程度。100%饱和度的颜色最鲜艳，饱和度越低的颜色暗淡。
　　亮度（也称「明度」）——颜色的明亮程度，0%亮度的颜色是黑色。

　　选择什么颜色取决于你，但有些事项请记住：
　　1.饱和度低、亮度低的颜色会显得更朴实，不那么卡通。
　　2.考虑色盘上的颜色关系—在色盘上离的越远的颜色越难协调。在同一侧的颜色，比如相邻的红色和橙色，放在一起会更好看。

　　3.使用的颜色越多，你的「精灵」看起来就会越混乱。只用两种或三种主要颜色会让「精灵」更吸引人。（想想当年的超级马里奥，只用了红色和褐色！）
　　【还是那句，不懂怎么上色就模仿别人的上色。经常收集喜欢的图片是个好习惯，临到要上色时，可以提出别人的色彩，做成自己的色板。具体怎么操作可以参考：设计师必备取色技巧！教你在PS里通过照片创建色板 】

　　用绘画程序填色很容易。如果你用的是PS，你应该用魔棒工具[快捷键「W」]选中区域，然后用[Alt+Del]填充前景色，或者用[Ctrl+Del]填充背景色。

　　画好阴影是我们追求极致像素图的关键一步，它决定一个「精灵」变得出众还是糟糕。照我说的做，你会成功的。

　　首先，我们要挑选一个光源。如果你的「精灵」是在一个大场景里，可能会有很多局部光照在它上面（像灯光、火光、叠加光等），这些光源会混合成一种很复杂的情况。不过，大部分情况中，选择一个远光源（比如太阳）是一个不错的做法，对于游戏来说，你应该绘制一个能通用的被照亮的「精灵」，让它能适用于尽可能多的场景。
　　我通常选择一个在「精灵」上方偏前位置的远光源，物体顶部和前部会被照亮，而其他部分会在阴影中。这种光照下的「精灵」看起来最自然。

　　一旦我们定义了一个光源，先用深色填充离光源最远的区域，我们选取的「前上位置」灯光模型限定了头的边缘，手臂，脚等部位是在阴影中的。
　　记住，是光和影之间的差异让物体显得立体。将一张白纸揉成纸球，然后把它摊开放在桌子上——你凭什么说它不是平的？因为你能看见褶皱周围细小的暗面。你要做的是，用阴影勾勒出衣服的褶皱，用阴影去突显肌肉，头发，毛皮，裂纹等。

　　灰面属于第二级阴影，比第一级的暗面亮，常作为软阴影来使用。灰面是物体被间接照亮的区域，也能作为亮面到暗面的过渡区域，特别是曲面的过渡。

　　被光源直接照射的地方就会出现高光效果，高光应该适度使用（比暗面少得多），因为频繁使用高光会分散观看者的注意力。
　　先涂完阴影再上高光会让你少头痛很多。如果没有阴影填充好区域，你上高光的时候就可能会画的偏大。

　　涂阴影对于大部分初学者来说是个坎。你在涂阴影时应该遵照以下几条规则。
　　1.不要使用渐变工具。这是新手最容易犯的错误。渐变看起来难看的可怕，而且跟真实光照完全不一样。
　　2.不要使用「枕形阴影」。枕形阴影是内轮廓的阴影，它之所以叫枕头阴影是因为像个枕头而且没有专业定义。
　　【「枕形阴影」 -- 「pillow-shading」，我问了大神@all Artplus，他也不是很确定该怎么翻译，他的说法是意思就是像枕头那样的，从中间高光到四周阴影的，从高到低的变化。

　　我搜了搜，国外个一个博客有介绍，「枕形阴影」大致上就是这种。详细内容在：The Pixel Art Tutorial 里面是些进阶内容，都挺有用】
　　3.不要使用太多的阴影。人们很容易认为「越多的颜色意味着越真实」，但实际上，我们倾向于在大块的光影中观察物体——我们的大脑会过滤掉光影之间的细节。在基础色上，我们最多使用两种阴影（浅阴影和深阴影）和两种亮面（浅亮面和高亮）。
　　4.不要使用太过相似的颜色。不要在一个物体上使用两种太相似的颜色，除非你想让你的「精灵」模糊不清。
　　【大部分像素风格的游戏都不会分太多层的明暗，一般都是亮部，暗部，阴影这三层明暗就够了，甚至只分亮部，暗部，不要阴影。分的明暗层越多，自然就越逼真，越有立体感，不过再次强调一点，我们画的像素图并不追求逼真。PS。如果不懂阴影怎么画，可以百度“三大面五大调”】

　　「颜色维持」是像素艺术家必须多加考虑的事情。有一种方法能让你使用较少的颜色得到更多的阴影层次，这种方法叫做「抖动网点」。类似传统绘画中的「交叉影线」和「点画」，把两种颜色交错起来，为的就是得到它们的中间色。

　　这是一个简单例子，它运用「抖动网点（dithering）」技巧，用两个颜色制作出了4种不同的明暗：

　　对比这两张图片，上面那张图片是用PS的渐变工具做的，下面那张图片用3种颜色通过「抖动网点」做出的，注意创建中间色的不同模式，尝试使用不同的模式来创建新的纹理。

　　「抖动网点」能给你的「精灵」带来复古的感觉。因为许多古老的视频游戏严重依赖「抖动网点」，靠「抖动网点」来充分利用它们有限的色板。（看看MD上使用「抖动网点」的诸多例子）。我不常用这个技巧，但出于学习的目的，我将它应用在我们的「精灵」上（可能过度使用了）。
　　你能遵照自己的想法使用「抖动网点」。但老实说，我很少见到能将这个技术运用好的人。

　　这两张对比就更明显了，第一张看起来非常光滑圆润，后一个就像饱经沧桑的坚果墙或者矿石之类的，用不用「抖动网点」取决与你想表现什么样的材质，不过我劝你谨慎使用，抖动用多了会使画面变脏，清新风格的游戏一般不用「抖动网点」。具体操作可以看：手把手教你画像素（二）】*

　　调整轮廓线，也叫「选择输出」，是一种描绘轮廓的方式。我们使用一种更接近「精灵」原色的颜色来绘制轮廓，而不是全使用黑色。此外，我们改变「精灵」边缘轮廓线的亮度，让光源决定我们该使用什么颜色。
　　直到这一步，我们一直保持着轮廓线是黑色的。这没有什么不好的，真的，因为它很好看，而且它让「精灵」和周围的环境分开。但使用一直使用黑色，我们牺牲的真实性可能会超出我们预期，因为他让「精灵」显得更加卡通。「选择输出」是一种避免这现象的好方法。
　　【意思就是重绘一遍轮廓线，这在游戏素材绘制中是必做的，没有哪个游戏是用黑色描边的】
　　你会注意到我还使用「选择输出」来软化了他的肌肉纹理。最后，这个「精灵」开始看起来像个连贯的整体而不是一堆单独的片段了。

　　抗锯齿的工作原理是：添加中间色到扭结的线条上，来让线条变得平滑。例如，如果你有一条黑色的线在白色背景上，你可以在线的边缘添加灰色的像素来使线平滑。

　　一般来说，你应该在线条断裂、参差不齐的地方加上中间色来过渡。如果线条仍然看起来太不平坦，就沿着曲线的方向，再添加一个比中间色更亮的像素层。
　　我解释的再好都不如让你直接看例子，只用看下面这些图片，你就明白我的意思了。

　　正如你看到的，这种效果虽然微妙，但会产生极大的不同。

　　为什么要手动调节？
　　你可能会问，为什么我们不直接使用绘图程序里的滤镜来让精灵变得平滑?答案是没有什么滤镜能比得上我们手动调节的效果。手动调节有完全的控制权，能调节更多的颜色层次。在需要被平滑处理的区域使用任何抗锯齿滤镜，都会让那个区域降低像素质量。

　　唷！到了关掉电脑来瓶冰啤酒的时候了。但不行，还差一点！最后的这部分是一个充满热情的业余爱好者和一个专业人士之间的区别。
　　退后一步，然后仔细的看看你的精灵，可能它仍然有点粗糙。花时间去完善它，确保所有部分都是完美的。这其实是最有趣的部分（虽然你可以已经累了）。添加细节来让你的精灵变得更吸引人。这会是你展现技术和经验的地方。