Hi, I’m just getting into Pixel Art for one of my projects (or it might be accurate to say that I’m just getting into art in general so apologies if this is a silly question) that I’m working on and I’ve decided to try and approach doing art for the environment in one Aseprite document (one screen per area, kinda like oddworld). I want this to be in 1080p when I export it, however I’ve read that you’re better to work in lower resolutions and then export at a higher resolution depending on the style, so I’ve done an environment in 192x108 pixels (10% of 1920x1080) but when I export this at 1000% scale it looks somewhat less sharp and crisp than when its in Aseprite at 192x108. I’ve also tried changing the sprite size in Aseprite and then exporting but this just gives the same issue and also looks blurry in Aseprite. Please can someone help with this on how to not lose the sharpness of the image? Do I need to be doing this art in a higher resolution, is 1000% too much?
Can you post your results? Aseprite’s scale feature uses Nearest Neighbour scaling, as sharp as it gets. Are you sure your viewer isn’t scaling it up/down, causing the apparent blur?
Hiya, sorry I’ve managed to figure this out now. Since you mentioned about the viewer I thought I’d try putting it into the editor and playing with the compression features and managed to get it looking real crisp. Thanks.
Hey, I am having the same issue. I need to scale up my 660 x 360 by 300% to get to 1920 x 1080 resolution. How did you get it to look crisp in the end? Thanks.
hi there, Jessie_Yin!
scaling by nearest neighbor won’t introduce blurred edges. i believe it’s default option for sprite → sprite size and the only option for resizing during export.
however, in your case there is one issue: 660x360 is not same aspect ratio as 1920x1080.
to resize it three times to get 1920x1080 you need a sprite size to be 640x360. or scale up what you have to 1980x1080 and crop it.
Hi all,
I’m wondering if this issue could be related:
https://blog.johnnovak.net/2016/09/21/what-every-coder-should-know-about-gamma/#image-resizing
http://www.ericbrasseur.org/gamma.html
A caveat: these articles focus on scaling down more than scaling up. But since you could be looking at a 1920x1080 upscaled image at 50% zoom, seemed worth bringing up.
This looks hard to test, because we’re talking about export, so the issues could be in Aseprite or another image software or both. The issue could be from the zoom level or the resizing methods or both (if the other software has editing capabilities). Lastly, some pixel art effects, like dithering, are designed to trick your eyes and brain at a given scale and some pixel art aesthetic constraints change which scaling methods you’ll prefer.
Anyway, I gave it a shot… If I take the test image of the Dalai Lama provided in the second link
and open it in Aseprite, it looks like this when viewed at 100% zoom:
When viewed at 50% zoom, it looks like this:
When I go to Sprite > Sprize Size and select 50% with nearest neighbor, I get this:
When I scale by 150% with nearest neighbor I get this:
There are two other methods for sprite scaling – Bilinear and Rotsprite. I’ll not post all the variations so as to keep the number of images in this post to a minimum.
Arguably, it may have been better to post the images from the Bilinear, as you could have predicted before testing that nearest neighbor would give poorer results relative to that. I posted nearest neighbor because it’s discussed above and, as pointed out, the default. Even with bilinear, the scaled down image doesn’t match the second article’s; and the scaled up image also looks hue shifted… to my eye anyway.
There are other test images available. Some produced the accepted results for zooming in Aseprite, but crazy results when using sprite scaling, no matter the method. Or they were fine with scaling up, less fine when scaling down (which is to be expected). You may even have inconsistent visuals between an image’s zoom, it’s thumbnail in the file browser, and its preview:
There are other variables to toggle, such as color profiles, different file formats or color modes, that I didn’t try.
I don’t know if any of that helps. But it was fun to look into.
Best,
Jeremy
Update:
Going to Sprite > Properties, changing the color profile to None, clicking Convert, then resizing the sprite, then returning to sprite properties, changing the color profile to sRGB and clicking Convert fixed some issues with sprite resize.