如何制作像素画#8:Aseprite像素画导出格式详细介绍

作者:Pedro Medeiros编译 | 三二 (转载请注明出处)。矢量图的缺点是很难用于像照片这样写实的图像。

虽然可以用矢量图创建看起来像像素画的东西,或者将像素画导出为矢量格式(需要将像素画打印到非常大的广告牌上时。),但很少这样做。

图1

SVG矢量图可以使用代码来生成或修改,比如下面的代码就是一个红色的圆。位图则会保存每一个像素的颜色(6位数字的代码)和位置。

就像下面这样。位图存储信息的方式会导致大尺寸的图片容量比矢量图大的多的多。

图2

1080 x 1920的位图意味着需要存储2.073.600个像素,因此程序员们发明了图像压缩算法,JPG就是其中的一种。图像压缩图像压缩可以使图片变小,但是也会使图片变模糊。

所以画好像素画以后保存的时候,一定要选择无损压缩格式比如PNG或GIF。左:PNG(无损);右:JPG(有损)使用绘图软件的自有格式可以保存尽可能多的信息。

图3

如Aseprite的 .aseprite或Photoshop的 .psd,可以保存所有图层和元数据。Aseprite保存在Aseprite中,可以使用保存对话框保存文件(Ctrl + S或Ctrl + Shit + S保存到新文件)。

图4

文件格式File type选择.ase或.aseprite保存。Aseprite导出当你需要将作品分享给团队成员或其他人时,单纯的PNG可能无法满足需要,而.aseprite对程序员无效。

因此需要用到“文件”>“导出”功能。导出文件Output File:文件名。

图5

只需输入要使用的文件扩展名,Aseprite将以该格式保存。我建议对静态图像使用“.png”,对动画使用“.gif”。

调整大小Resize:一般像素画尺寸都很小,当你完成作品需要展示或分享的时候都需要放大。请使用100%的倍数来导出,如果是101%或110%都会使像素画变模糊。

图6

图层Layers:可以选择要导出的图层,默认导出所有图层。帧Frames:可以选择导出全部帧或当前帧。

选择全部帧,前面文件格式选择.gif会导出动画,选择.png则会导出序列帧。动画播放顺序Animation Direction:一般默认无需更改。

图7

Twitter导出Export for Twitter:如果gif动画要发布到twitter可以勾选。游戏引擎不同的游戏引擎对于图片资源的要求不同,绝大部分引擎都支持PNG。

一般情况下对于游戏使用的像素画图片,建议1:1导出,理想情况所有的图片都应该由游戏引擎统一缩放,可以保持分辨率统一。动画可以导出SpriteSheet或序列帧,不建议导出视频格式。

图8

序列帧将动画保存为.png格式,Aseprite会自动导出序列帧。如果需要从0开始,就在文件名后面输入0或00,效果如下另外一个有效都技巧是使用标签Tag。

使用标签来管理多个动画。在导出的时候将文件名设置为boss_ {tag} {tagframe00} .png,Aseprite会自动导出:SpriteSheet有些游戏引擎更喜欢SpriteSheet而不是序列帧,使用File> Export Sprite Sheet命令自动导出它们。

图9

在这里,我们可以选择各种选项,其中大部分将由引擎决定。如果不确定,请不要修改默认配置。

可以在程序员指导下导出。切片和命令行(mac)切片非常适合在单个画布中制作多个图像,我喜欢在画游戏场景道具时使用它们。

图10

第一步是将sprite放在一个文件中,并排放置,不要让它们相互重叠。下一步,选择切片工具选择每个对象,注意不要包含任何其他的Sprite。

图11

之后双击一个(或右键单击查看属性)设置名称。导出切片需要使用命令行。

这对于美术可能有点可怕,但是使用命令行可以帮你自动完成无聊的图片导出工作。mac打开Terminal,先进入文件所在目录,我将测试文件存在Downloads目录。

图12

cd Downloads然后输入下面代码即可/Applications/Aseprite.app/Contents/MacOS/aseprite -b 123.aseprite –save-as {slice}.png123.aseprite是测试的文件名。

如果你用的windows,建议找程序员帮忙哦。或者在命令行工具中输入以下命令查看官方帮助。

图13

(Aseprite需要安装在C盘才行,如果是其他盘,请将下面代码中的C:修改成相应的盘符)”C:\Program Files (x86)\Aseprite\Aseprite.exe” –help或者”C:\Program Files\Aseprite\Aseprite.exe” –help完。

Author: PixelBear