2

I use pixelmator at the moment to do pixel art to make 8-bit-esque game sprites.

For iOS, alas, we need to spit out multiple versions of these. For example, I'm drawing the art at 19x19px (one pixel = one pixel in the drawing app for ease of drawing) but I actually need to then output this as:

38x38 76x76 108x108

Pixelmator has a major flaw in terms of producing pixel art in that you can't scale and resample an image using 'nearest neighbor' interpolation which would preserve the pixel look.

So...I need a better tool. Can anyone recommend a decent raster based illustration tool that can automatically scale up and output images using a preferred interpolation method?

Photoshop is an option...but we're hoping for a non-Adobe solution if it exists (and open source would be even better)

  • 1
    You are always better off using the highest resolution and downscaling than upscaling. – Steve Barnes Aug 30 '16 at 19:53
  • @SteveBarnes catch is it is pixel art. We can't let the software do the interpolation since it will blur. As such, we need to tailor the pixel art to each resolution. – DA. Aug 30 '16 at 20:00
  • You are asking for Automatic Upscaling which usually results in a blocky look take the highest resolution and downscale and it will not pixelate. – Steve Barnes Aug 31 '16 at 6:56
  • @SteveBarnes it's pixel art. We want it pixelated (aliased) :) – DA. Aug 31 '16 at 14:42
2

My solution is to always work, with whatever image editor you like I prefer Gimp or Krita, at at least the highest resolution that I need, or even at twice the resolution and then use a batch file or script to produce the lower resolutions using a command line tool such as ImageMagick.

ImageMagick is:

  • Free Gratis & Open Source
  • Cross Platform
  • Scriptable & Powerful
  • Capable of Batch Processing Images

GIMP & Krita are also FOSS

As an example I took the ImageMagick wizard logo, a 265x352 jpeg, below: enter image description here

And ran convert wizard.jpg[108x108!] wiz108.bmp which gave me: enter image description here

Then I ran convert wizard.jpg[76x76!] wiz76.bmp and got: enter image description here

Finally convert wizard.jpg[38x38!] wiz38.bmp gave me: enter image description here

Why not to upscale: As a cautionary tail I also ran convert wiz38.bmp[108x108] wizup.bmp to go from 38x38 to 108x108 which gave me: enter image description here

If you would like to upscale without antialiasing you can use: convert wiz38.bmp -sample 108x108 wizups.bmp which avoids any interpolation and gives a pixilated look.

enter image description here

It is also worth noting that you can set GIMP to resize without interpolation and that you can add either script-fu or gimp python filters to export at fixed sizes, (with or without interpolation), in response to a single menu selection.

  • Thanks, but with pixel art, you actually want to go in the opposite direction. You typically draw pixel art at the smallest resolution where 1 pixel at a time. You then want to scale up so the visual pixels look bigger, but actually take up multiple screen pixels. Some software tries to anti-alias images when you scale up as your example shows. Pixelmator does this as well. This is exactly what I'm trying to avoid. I want it to scale up sans anti-aliasing. – DA. Aug 31 '16 at 14:49
1

The solution is The GIMP.

It's been a while since I used The GIMP. They now have a native OSX version. It's nice!

So my workflow was:

  • export as layered PSD from pixelmator
  • open in The GIMP
  • scale image up using "none" as the interpolation method. This preserves the aliased pixel-art look.
  • I then export the layers as individual pngs using an 'export as layers' GIMP plugin.
  • I then scale that image up to the next size needed and repeat the process.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.