像素画口袋妖怪DIY教程

打开网易新闻 查看精彩图片

文本概览:全文约 3,135 字,阅读约 8 分钟。

看完本文你就可以设计完全属于你自己的口袋妖怪。举一反三,你可以学会看到的所有像素画风格。

打开网易新闻 查看精彩图片

其实很多时候不是你手笨,是你还没把“宝可梦风”当成一套有边界的练习题。画布多大、能用几色、战斗里该怎么站、光从哪边来,先解决这些问题,后面落点和上色才会顺。

声明:宝可梦及相关设定归任天堂等权利方所有。下文只讨论风格学习与原创练习,不涉及官方素材商用。
先搞清:你要模仿的是哪一代的约束

“宝可梦风点绘”不是一种随便的怀旧滤镜。各世代画布和色数不同,风格差得很开。

打开网易新闻 查看精彩图片

下面四张是原文按世代拆开的规格对照,建议你对照记忆,别混用:

红绿蓝/金银(GB/GBC):画布大约56×564 色

打开网易新闻 查看精彩图片

宝石/火叶(GBA):画布大约64×64,含背景约16 色

打开网易新闻 查看精彩图片

钻石珍珠/心金魂银(DS):画布大约80×80,含背景约16 色

打开网易新闻 查看精彩图片

黑白/黑白2(第五世代):画布大约96×96,含背景约16 色。本篇后面的步骤默认按这一代来练。

打开网易新闻 查看精彩图片

你先选定一代,后面才不会“线是第五代的,色是第一代的”。

工具怎么设:别让软件把像素糊掉

电脑上可以用 Aseprite、GraphicsGale 这类点绘工具;手机上很多人用ibisPaint(功能全、图层和色板管理方便,通勤也能画)。

打开网易新闻 查看精彩图片

无论用哪款,有一条几乎通用:关闭“放大时插值/平滑”,否则一放大就糊成油画,根本看不清格子。放大后能数清每一格,这关才算过。

步骤 1:在视图或画布设置里找到“放大插值”“平滑缩放”之类选项,关掉它。

打开网易新闻 查看精彩图片

步骤 2:确认放大后边缘是硬像素,不是模糊过渡。

打开网易新闻 查看精彩图片

刷子用1 像素的数字笔。你要的是一格一格放颜色,不是软边笔刷。

线稿之前:先把“设计”修到适合落点 设计尽量简单,但眼睛要有戏

第一稿别追求复杂。圆身子、方脑袋这种基本形更好落点。眼睛在这套风格里特别重要,表情和辨识度多半靠它。可以加一两处特征纹样,但别一上来塞满细节。

下面这只草系小狗向草稿,就是“简单形 + 眼睛 + 毛浪”的思路:

打开网易新闻 查看精彩图片

站姿别正面摆拍,想战斗画面

第五世代精灵在游戏里常有轻微动画,但静止下来多是简洁站姿。你若画成“正脸怼镜头”,落点后往往不像那一套。

先看官方战斗画面里的参考站姿:

打开网易新闻 查看精彩图片

设计案一的问题是:脸正对着镜头,像证件照,不像战斗里的精灵。

打开网易新闻 查看精彩图片

更稳的角度,是战斗画面常见的略侧身、面向斜前方。按第五世代习惯,理想朝向大致如下:

打开网易新闻 查看精彩图片

把姿态改到这种构图,违和感会先掉一截:

打开网易新闻 查看精彩图片

修两处细节:深度,以及线与线的夹角

草稿能看,还不等于适合缩成点绘。优先盯两件事:

修正点 ①:考虑深度的鼻子位置

打开网易新闻 查看精彩图片

修正点 ②:线与线接缝角度太浅,缩小后会糊成一团

打开网易新闻 查看精彩图片

改完之后,面部绒毛会更利落,脚的前后关系也更清楚:

打开网易新闻 查看精彩图片
打开网易新闻 查看精彩图片

你可能觉得“原画阶段已经够细了”。但你真正要省的,是后面在 96×96 里反复擦格子的时间。能在原画阶段修掉的,就别留给点绘阶段碰运气。

落点:96×96,留一点余白,别死描缩小稿

线稿按下面八步来。新建画布、选笔、导入原画、设插值、调大小、留余白,再描点。

步骤 1:新建96×96画布。

打开网易新闻 查看精彩图片

步骤 2:画笔设为1.0px 数字笔

打开网易新闻 查看精彩图片

步骤 3:导入修好的原画。

打开网易新闻 查看精彩图片

步骤 4:缩小原画时,插值选最近邻(ibisPaint 里常见叫“色平均(点)”)。别用双线性或平滑,格子会糊一片。

打开网易新闻 查看精彩图片

步骤 5:把原画缩到合适大小。

打开网易新闻 查看精彩图片

步骤 6四周留余白(大约 4~8 像素),让剪影干净。也有官方精灵几乎贴满画布,以角色体量为准。

打开网易新闻 查看精彩图片

步骤 7:新建图层,在原画上方逐格描线。

打开网易新闻 查看精彩图片

步骤 8:对照原画,把轮廓“翻译”成点绘线型。

打开网易新闻 查看精彩图片

落点时记住一句:不是死描缩小后的原画,而是用点绘线型去“翻译”它。

线的画法:注意重叠与走线差异

缩小会让线重叠、挤扁。你要主动拆开这些事故点。

先看要注意的地方:

打开网易新闻 查看精彩图片

对照两种线稿:一种死描原画,一种按点绘线型重排,差的就是那股“像/不像”。

打开网易新闻 查看精彩图片

怎么拆?缩回原尺寸看:哪两段轮廓糊成一条粗线,就放大检查。若两格共边(正上下或正左右挨着)把轮廓撑厚了,擦掉其中一格,只留对角相触,或故意留出 1 像素缝。

直线、折线、圆、方各自还有常见走法,一格之差圆可能变方、尖可能变钝。

多练几种基本线型:

打开网易新闻 查看精彩图片

线稿满意了,再进入上色。别急着一边线一边色,先把“形”锁住。

上色:十六色里做出体积,而不是涂满鲜艳

上色段你先只记三件事:压彩度、左上来光、轮廓尽量贴内侧。

先建色板,别直接甩原色

第五世代习惯是:在最多十六色(含背景)里,用底色、阴影、高光、轮廓把体积和质感挤出来。

打开网易新闻 查看精彩图片

一个实用习惯:少用未经调过的高饱和原色。官方点绘整体彩度偏克制,你一上来就拉满,很容易“艳”,却不像。

打开网易新闻 查看精彩图片

彩度拉满也不是绝对不行。整体关系摆对了,偶尔一块亮色也能成立。怕的是整板都刺,又没有明暗层次。

打开网易新闻 查看精彩图片

底色、阴影、轮廓的关系值

按草稿意向先定底色。再准备阴影;高光和轮廓按需要加。

下描阶段可以先定大致配色方向:

打开网易新闻 查看精彩图片

常见关系(不是铁律,但很有“那味”):

  • 底色:彩度偏低、明度偏高

  • 阴影:往往比底色更“浓”一点(彩度可更高、明度更低)

  • 轮廓:可用更暗的同系色,有时直接从阴影色里借

打开网易新闻 查看精彩图片

对着色相/饱和度/明度滑条推移,可以先这么试:底色把饱和度压一截、明度抬一点;阴影在同色相附近把明度往下拖,饱和度略升;轮廓再从阴影往更暗挪半档,或直接吸阴影色复用。

打开网易新闻 查看精彩图片

定好底色后,再推阴影色

打开网易新闻 查看精彩图片

鼻子等局部若已有偏暗同系色,轮廓色也可以直接复用,少开新色,十六色才够花:

打开网易新闻 查看精彩图片

光源默认左上,右下与背侧吃影

官方点绘多数按左上来光理解:高光偏左上,阴影落在右下或背侧。

打开网易新闻 查看精彩图片

点绘里的光影不等于写实插画。地面反射、某些“理应有影”的位置故意留空,都可能出现。画布就这么大,可读的剪影和特征,优先于物理正确。卡住时去观察官方精灵,总结几种常见技法:

打开网易新闻 查看精彩图片

轮廓:内外放错,背景一变就穿帮

按左上光源铺完高光和阴影后,角色大致是这样:

打开网易新闻 查看精彩图片

回头收拾轮廓。轮廓常用2~3 档明度,并继续服从左上光源:

打开网易新闻 查看精彩图片

线稿阶段叠在一起的线,上色后要重新裁决。下面这类线条密集区尤其要试几种处理方式:

打开网易新闻 查看精彩图片

没有唯一答案,但有一条硬提醒:轮廓色贴在形体外侧,背景一亮或一暗,边缘就容易脏、容易飘;贴在内侧通常更稳。

打开网易新闻 查看精彩图片
打开网易新闻 查看精彩图片
打开网易新闻 查看精彩图片

缩小回原尺寸看一眼,再改

你制作时几乎总在放大。隔一会儿,缩回 96×96 原尺寸再看:糊不糊、脏不脏、剪影还清不清。

打开网易新闻 查看精彩图片

觉得“差不多了”就存档离开十分钟,回来再判。也可以试几种配色微调,对比再定稿:

打开网易新闻 查看精彩图片

可以立刻做的小练习

今天只做一只,别贪多:

  1. 新建 96×96 画布,关掉放大插值;导入草稿缩小用最近邻。

  2. 画一个极简原创小怪草稿,改成战斗向侧站姿,四周留约 4~8 像素空。

  3. 落点时专门找一处“线粘在一起”的地方:共边撑厚就擦一格,只留对角或 1 像素缝。

  4. 色板控制在十六色以内(含背景色),按上面滑条习惯推底色/阴影/轮廓;默认左上光源,轮廓尽量放内侧。

  5. 每隔几步缩回原尺寸看一眼。

你做完的,不是又多练了一手技巧,而是摸到一条可复用的制作约束:画布、色数、站姿、光源。同一套色板习惯,明天还能套到第二只、第三只小怪上。以后你要做独立游戏里的小怪、道具、立绘,这套边界感都能直接搬过去。

参考资料

https://note.com/alphatopokedo/n/n2ccbc65ba96d: https://note.com/alphatopokedo/n/n2ccbc65ba96d

https://note.com/alphatopokedo/n/n3dc18d0c23eb: https://note.com/alphatopokedo/n/n3dc18d0c23eb