Scaling up images?

H

Hamon911

Guest
I've tried looking up tutorials about how to scale up sprites/images, but the only ones I seem to find are for pixel art. Considering I'm using more detailed images, these methods make the images look blurred or pixelated. My question is how would I go about scaling the game/sprites while using high detailed images. Thanks!

(An example of the art style I'm going with is Crashlands.)
 
Last edited by a moderator:

JackTurbo

Member
You dont.
If you're using hi-res art then dont scale it at all ideally, but if you do have to then scale down.
 

Geoff Jones

Member
Unless you scale them by factors of whole numbers, then you are going to get pixel distortion. It's just the way it is.
 

Rayek

Member
Scaling up a bitmap image won't magically create more detail, and will always result in a more blurred version. Having said that, the final result may be improved by sharpening techniques, and also depends heavily on the resampling algorithm that is used: for example, scaling DOWN a detailed sprite generally works best with Catmull-Rom (which is unsupported in most popular image editors like Photoshop, unfortunately).

Upscaling a detailed sprite with Lanczos 3 or 8 will often result in edge artifacts, which are difficult to remove, and just look bad when the result is sharpened. Scaling up with Cubic Spline results in a fuzzier result, but can be improved quite a bit by applying adaptive sharpening. Bicubic resampling is terrible for upscaling, and always results in very fuzzy upscaled images.

But with dedicated pixel art upscale resampling methods very painterly results can be achieved:

Original sprite:



Upscaled twice using the Supereagle algorithm in 2dimagefilter, noise partly removed and a saturation adjustment in PhotoLine:



This version could serve as a foundation for some detail painting now. Less work than starting from scratch ;)
Quick two-minute overpaint in Krita as an example. Just blend and pick up colors for hairs (oops, the hump is a bit much :p):




A nice tool to check and compare the various resampling options together with input (before scaling up/down) and output (after scaling up/down) sharpening is Color Quantizer. It's free, and the scaling options are pretty good. Color Quantizer is probably the best PNG optimizer tool available (and it is free) - an essential tool in anyone's toolkit for PNG optimization.


However, to have some real fun with various combinations of upscale resample algorithms, anyone ought to try out 2dimagefilter, which offers just about any upscaling option:


(sorry for the graphic links, this is only my fifth post)

For quite acceptable results try HQ2/3/4x when upscaling sprites in 2dimagefilter. It also has some interesting scanlined upscale methods. And these can be combined as well for interesting upscale effects.
 
H

Hamon911

Guest
You dont.
If you're using hi-res art then dont scale it at all ideally, but if you do have to then scale down.
so do games like Crashlands simply expand the view size and keep the sprites the same size?
 

Rayek

Member
Just checked Crashlands, and it seems it does do exactly that. Many games allow the viewport to expand while keeping the base graphics the same scale.

Many games also allow the user to zoom in and out of the game's playfield - in that case you should prepare your graphics/sprites at the highest zoom level. But it depends a bit on the type of graphics: for example, fuzzy clouds, spell effects, or mist sprites often does not need to be that high resolution for a good visual effect. Also depends on the amount of time an effect or sprite is displayed on the screen - if only for a split second, it's a waste of resources to use a highest resolution sprite.
 
Top