游戏开发论坛

 找回密码
 立即注册
搜索
查看: 11956|回复: 0

【风农翻译】开始画像素画 #1

[复制链接]

8364

主题

8525

帖子

1万

积分

版主

Rank: 7Rank: 7Rank: 7

积分
14833
发表于 2020-8-5 10:54:47 | 显示全部楼层 |阅读模式
这是一个小的系列,算是专门为纯小白设计。
开始画像素画

这是来自佩德罗・梅代鲁斯(Pedro Medeiros,@saint11)授权的一系列像素美术教程,由风农翻译整理。

佩德罗・梅代鲁斯最为知名的作品莫过于《塞莱斯特山(蔚蓝,Celeste)》,不过他持续在网络上发布的像素美术教程也同样相当知名。这里选择的教程就是经过风农翻译整理内容。

相关链接:

Pedro Medeiros@Patreon
风农@indienova
风农@bilibili 专栏



完全小白起步指南

这篇文章是关于如何开始画像素画,专为从来没用过像素画软件,或者刚开始学画的人设计。这里我只会讲解最基本的东西,如何创建文件,设置画布尺寸,以及如何利用受限的颜色。

如果喜欢这篇文章,欢迎去 Patreon 支持我:patreon.com/saint11

这是一个系列的第一篇。


开始之前

在开始进入像素画世界之前,要记住,像素画只是一种艺术形式,就像抽象画,油画,铅笔画,雕塑或者他的亲戚镶嵌画一样。画好像素画,你需要能画好常规的画。就是说你也要学习结构,透视,光影,颜色理论,甚至艺术史,这些都是画好像素画的关键。

工具

画好像素画不需要什么好的工具,你可以只用鼠标和免费软件就画的不错。我的设备有一个小的 Wacom 手绘板,一个好鼠标,一个键盘和我最喜欢的软件 Aseprite,总之你应该用你用着最舒服的。

这里是一些很常用的像素画软件:

  • Aseprite:专业的编辑器,有很多提高效率的特性,收费。

https://www.aseprite.org/

  • GraphicsGale:经典,很多游戏有用到。略复杂,但是好特性很多,免费

https://graphicsgale.com/us/

  • Piskel:免费线上编辑器(风农:我之前翻译的视频教程里有讲)。

https://www.piskelapp.com/

  • Photoshop:强力图片编辑器,不是为像素画设计的,但设置好了也可以用,收费。


Aseprite

目前我最喜欢的像素画软件。非常的强大,特性很多又很方便用。这个教程都是用 Aseprite 来做的,但是我觉得转换到其他软件也不需要费很大功夫。你可以试试 Aseprite 的试用版,但是不能保存文件,用来练习我觉得还 OK。

创建文件

点击主界面的“New File”,或者到 FIle > New File,之后就可以开始画了。

20.JPG

我们新建一个文件,16 乘 16 可能看起来太小,不过我觉得作为起始还是很好的。大的分辨率可能会让你分心,你现在应该聚焦在:理解每个像素和周边的关系。

颜色模式保持 RGBA,这是最简单直观的。一些像素画手喜欢用 Indexed(索引)模式,能用一些很酷的颜色技巧,但也有一些缺点。

背景选透明(transparent)或者白色(white),暂时没影响。高级选项(Advanced Options)不要选,以后你可以自己去试试。

现在就都准备 ok 了。

开始画!

界面上有很多工具和菜单,别着急,我们现在只需要用几个按钮。最主要的工具是铅笔(Pencil),应该一直保持 1px 宽度,这是我们在画布上画像素的工具。点击这个按钮,或者按 B,再去点击屏幕,就可以画上一个所选颜色的像素点。

21.JPG

在左边你可以看到调色盘,有几个默认颜色。把这些换一下,换成简单点的集合。点击调色盘上面第三个按钮(预设,presets),选择 ARQ4(Endesga 所做的一个很棒的调色盘)。这就是你画第一个 sprite 会用的调色盘了。

现在用这里的 4 个颜色来试着画个杯子。

可以从我的设计里找灵感,也要试着画的个性一点。如果画错,按 ALT + 点击一个空白区域或者画布外,你就会选择一个透明的色,可以用来擦除像素。当然也可以点击橡皮(Eraser)或者按 E。

你可能注意到,在这么低的分辨率上画,跟常规绘画是不同的。所有东西都要计算好,没个像素的位置都是你需要做的决定。你需要适应这些。

22.JPG

你可以去试试其他的按钮。注意有些按钮点中后会打开更多选项。先不要用模糊工具(blur),他会增加很多颜色,我们还用不上。

现在,我们可以画更多 sprite,试试画骷髅,宝剑,人脸。这次不找像素画参考。如果你感觉这些在画布上画不开,完全正常,试着去把一些地方抽象成单像素再试试。在这么低的分辨率画画是很难的,有时候很想是解密。这里有一篇我之前给 Kano 写的,关于在低分辨率下画画的文章:https://kano.me/blog/my-thoughts-on-very-low-resolution/

这里是我画的几个 sprite,一定确保你画完自己的再看:

23.JPG

这是个不错的练习,如果你想继续练习,试着带着这些限制画更多东西。

保存文件

按 CTRL+S 来保存文件,或者到 File > Save As...,选文件名和保存路径,点击 save。

在试用版这个功能是禁用的!

24.JPG

Aseprite 可以保存很多的格式,我建议保存一个 ase 文件。就好像 PS 里你会留一个 psd 文件一样。当要导出到 web 或游戏里时,可以 CTRL+ALT+SHIFT+S,或者 File > Export.

25.JPG

Aseprite 在导出界面有个很棒的 Resize 特性。它只会把你的 sprite 放大整数倍,完美。如果你要把 sprite 放大 107%,就会把所有像素都破坏掉,乱七八糟。但如果你缩放 200%,每个像素就会变成 2 倍宽和高,还是很整洁。

大点的画布

现在你已经连接了基础,像创建保存文件,在画布上画画。我们试着画个大点的画布,32 乘 32 像素。调色盘也换大一点,试一试 AAP-Micro12( AdigunPolack 制作)。这次画个铲子。

不像 16 乘 16 的 sprite,我们可以在这里画一些轮廓线,这是我的流程分解:

第一步:线条

26.JPG

这种线条风格我称为像素完美线,只有 1 像素宽,与其他像素对角线连接。当画这种线时,注意避免不必要的边,比如:

27.JPG

Aseprite 还有个很棒的笔刷特性可以自动处理这些:选中你的笔刷工具,再选中像素完美(pixel-perfect)。记得不画线的时候要把它勾掉,不然很烦人。

28.JPG

第二步:基本颜色

29.JPG

可选颜色少有个好处是不会被太多的选择淹没。这就是为什么用一大堆色也很难,如果你的调色盘里有个颜色,你没理由不好好利用起来。试着把它当成解密,多试验,即使是怪异的,非常规的组合,知道你找到你认为最合适这个区域的组合。

第三步:明暗

用你的调色盘有创意的画出明暗。因为你只有非常受限的调色盘,你不会有每种不同亮度的色调,你必须随机应变。

30.JPG

这个例子里,我用的也是 AAP-Mini12 调色盘。当我画上这个绿老哥之后,我没有其他亮绿色可用了,所以我选了能用的最接近的色,也就是黄色。阴影也是一样,我选了蓝色,因为这是最接近的暗色。但如果我反过来呢?我可以用个亮蓝色和暗红色,对吧?其实不太行:

31.JPG

看起来好像很酷,但是明显有点不对劲。通常你得把冷色调用在阴影,暖色用在亮处,不然就看着怪。当然这也不是雷打不动的规则,有很多的例外。在你不确定的时候,就遵从它。

第四步:抗锯齿和优化

32.JPG

这部分需要你试着把像素变得不那么“尖”。手工抗锯齿是个复杂的主题,估计我们要用一整篇文章来讨论,不过概念是,你可以用中间色来模拟“半个像素”,软化边界。但是不用过多的关心这个,现在你需要把 spirite 的尽量画的易于理解。

另外一个适合在这个阶段做的是干掉孤立像素减少噪点。孤立像素就是不属于任何大的同色的像素簇的像素,也不属于抗锯齿,比如:

33.JPG

注意到左边的 1 像素小岛了吗?那些就是孤立像素,在我们把这些孤立像素和邻近的同色像素合并之后,能看出这个地球看起来好多了。

那么图里的那些星星呢?他们的存在是为了表示孤立像素也不是完全不好,这些星星就是想要的效果,画出一个噪点纹理,提高了背景的对比度。

不要无脑的删除孤立像素,要在过程中问自己:这个像素是不是需要单独存在?

接下来?


现在是时候去试试更多颜色和更大的分辨率了。但要慢慢来,比如 48 乘 48,16 个色等等。如果你是完全初学,我建议先别做动画,先聚焦于如何舒服的画出静态的画。

我选了几个我很喜欢的像素画教程,如果你想看看的话:

Pixel art tutorial by Cure
http://pixeljoint.com/forum/forum_posts.asp?TID=11299&PID=139318#139318
Pixel art tutorial by Derek Yu
http://makegames.tumblr.com/post/42648699708/pixel-art-tutorial
Pixel art tutorial by Arne
https://androidarts.com/pixtut/pixelart.htm

我自己也做了很多不同主题的教程,你可以在 patreon 页里看到(风农:就是我做的这个系列~)。

My Patreon page
patreon.com/saint11
A compiled list of all my tutorials
http://blog.studiominiboss.com/pixelart

相关阅读:可移步风农翻译的《像素宝典系列》

作者:Pedro Medeiros
译者:风农
来源:INDIENOVA
地址:https://indienova.com/indie-game-development/saint11-making-pixel-art-1/

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

作品发布|文章投稿|广告合作|关于本站|游戏开发论坛 ( 闽ICP备17032699号-3 )

GMT+8, 2024-10-7 10:52

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表