Pixel art scaling algorithms
I saw this posted on reddit and thought it might be of use to a lot of the programmers here:
https://secure.wikimedia.org/wikipedia/en/wiki/Pixel_art_scaling_algorithms
Just in case the game developers here didn't know, there are a number of high quality open source pixel art scaling algorithms around that can be used in their entirity in your games!
Just want to add some useful links I found on this topic for the imagemagic-tool:
Discussion about best approach: http://www.imagemagick.org/discourse-server/viewtopic.php?f=1&t=17447
Seems they recommend a triangle filter to keep diagonal edges. And it seems they are considering to add special pixel-art-scaling algorithms. But they can't use available source code because of licensing issues.
These links contain reference on available imagemagic methods:
Resizing-Reference with pictured examples: http://www.imagemagick.org/Usage/resize/
Downscaling esp. for aspect ratio changes: http://www.imagemagick.org/Usage/resize/#liquid-rescale
Blury upscale and then sharpening: http://www.imagemagick.org/Usage/resize/#resize_unsharp
The resize_unsharp is a general purpose method when you want to preserve edges and crispness not (only) for pixel-art.
I would love to be able to use the hqnx pixel art scaling algorithms on some of the art here, especially Antifarea's stuff. But the only tools I found are for the command line, only work with uncompressed bmps, and don't handle transparency properly. I wish someone would write a nice plugin for GIMP or Paint.NET (hint hint).
HTML5 Canvas Old School RPG
HTML5 Canvas Old School RPG
There is Scale2x and SuperScale2x. Imho both are preferable over HQ2x. For Scale2x there is an GIMP plugin avaiable.
I'll be the first to admit that Scale2x could be better if you need to preserve texture / dithering patterns or keep the number of colors down, but for most small pixel art (which I plan to use it for) hq2x is just way, way better. It was so much better that it practically brought back old games from the dead. Its only disadvantage is that it takes a huge amount of cpu time, but when you're scaling the images in advance rather than in the game, that doesn't matter. There is a nice comparison of the algorithms here.
HTML5 Canvas Old School RPG
HTML5 Canvas Old School RPG
Great News!!!
I finally found a hqnx program that works on pngs with transparency support. Unfortunately it is command line only at this point, but here it is. It is LGPL too, so if someone wants to finish the job and turn it into a GIMP filter...
Anyway here are the results of scaling by 2x on http://opengameart.org/content/twelve-16x18-rpg-sprites-plus-base Feel free to compare to http://opengameart.org/content/antifareas-rpg-sprite-set-1-enlarged-w-tr...
Enjoy!
Gaurav
HTML5 Canvas Old School RPG
Here is a rotsprite scale/rotate tool: http://www.pineight.com/pc/
Very interesting site, devnewton. Thanks for sharing. I'm going to look into that bmp2tiles app.
As for pixel scaling, I just use a straight square scale. It is best not to scale up, though. Always better to make higher resolution images and scale them down when you need to. Performance-wise, lower resolutions are better, but right now, computers simply do not need us to limit ourselves very much unless we're developing for mobile devices, like phones and Nintendo 3DS systems.
Syrsly
Twitch Streamer, Web/Game Developer, & Artist
syrsly.com - contact me for commissions, thanks!