• Advertisement
Sign in to follow this  

Pixel Art and Screen Resolutions

This topic is 671 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hey there. I'm sure this has been asked before, but I haven't yet found a satisfactory answer. I'm working on a game in java that is supposed to look retro, you know, with pixels and such. So I draw my sprites to a small image (320 x 180) and scale it up to the largest multiple of that resolution that will fit on the user's screen. I heard some people say that you should scale to a power of two, but I don't see why it can't just be a multiple, since that will preserve the pixels as well.

 

Anyway, this works okay on some screens, but on others it wastes a lot of space around the edges of the screen. Say, for example, that the user's screen is 1440 pixels in width, and the game is rendering at 320 pixels wide. The largest multiple that will fit on the user's screen is 1280. This will waste 160 pixels of the user's screen width!

 

Now, you are probably familiar with the game "Doukutsu" (commonly referred to as "Cave Story"). That game, when played on my Mac, can be put into full screen mode. When this is done, it scales up to the maximum size that will fit on the screen (in other words, until it hits the maximum width or height). The game still has it's awesome pixelly art, but somehow it can scale up to the exact size of my screen (while still preserving aspect ratio, of course).

 

My question is, how can this be done? Thanks in advance for any advice!

Share this post


Link to post
Share on other sites
Advertisement

In my understanding, tthere are 2 things you can do.

 

If you wish to keep the sprites aspect ratio (scale in multiples of the initial size only, like you say you currently do), you can enlarge the amount of level the user can see.

The player would see more of the world, where it would otherwise be unused (the 160 pixels, in your example).

 

The other is to simply scale the sprites to non-multiples of their size (scale to fullscreen), if necessary. You will get uneven scaling (how much depending on the user's screen), but your game will look the same on every resolution.

 

Basically, in my opinion, either you compromise screen real-estate (to achieve aspect correct scaling), you compromise your game world's view (again, also achieving correct sprite aspect) or you compromise the sprite's aspect ratio (to get full screen coverage and identical game world view).

 

Also, the uneven stretching (stretch to full screen) is, by far, the simplest.

 

As a last note, keep in mind that you may want to keep your game's aspect ratio constant, even across multiple monitors/resolutions.

For example, if your game runs in a 16:9 aspect ratio, in order to maintain it, you'd want to put letterboxes on 4:3 or 5:4 monitors, otherwise, you'd either have to show more of the game's world (possibly compromising gameplay balance), or get a pretty uneven stretching going on.

 

Don't know if it's the answer you are hoping for, but I hope it helps, and if my explanation is confusing, I'm happy to clarify.

Edited by __SKYe

Share this post


Link to post
Share on other sites

Thanks for the reply. I think I'll look into that idea of showing more of the game world to fill unused screen space. That just might work, given my current design.

Share this post


Link to post
Share on other sites

I heard some people say that you should scale to a power of two, but I don't see why it can't just be a multiple, since that will preserve the pixels as well.


They (or you) are confusing two different ideas. Textures are usually powers of two - mostly for historical reasons, where power-of-two sizes were either required or, later, necessary for speed reasons.
If you are scaling up or down textures, and your texture was already a power-of-two, you'd scale to the next power of two (which would also be a multiple of the texture size).

If you image isn't power of two, then scaling to a power of two would distort the aspect ratio, as you point out.

Share this post


Link to post
Share on other sites
JimmyNeutron, what you probably meant to say was "should scale by a power of two". At least that is the way all pixel art games I have seen do it. You want to preserve the blocky charm (or curse, depending on who you talk to) and that really requires that all upscaled pixels appear the same size.

All pixel art games I can think of right now (JRPGs á la RPG Maker, Terraria, ...) are tile based though. They can vary both their upscale factor and the currently visible amount of tiles in either direction to create a visually pleasant result. They don't always display the exact same content but when all three parameters (upscale factor, visible tiles in horizontal and vertical direction) are picked in a smart way it will look very similar.

If you have a fixed size background or don't want scrolling you are left with some harder choices:
  • leave out some part of the image until it fits into the viewport.
  • have black bars at at least two edges. Since pixel art usually requires scaling by powers of two, possibly at all four edges.

Share this post


Link to post
Share on other sites

...what you probably meant to say was "should scale by a power of two".... You want to preserve the blocky charm (...) and that really requires that all upscaled pixels appear the same size.[/*]


The later does not force you to use a power of two as scaling factor though. Just a non fractional number.

Share this post


Link to post
Share on other sites
I agree with the non power of 2 part being necessary. But at the same time, the good looking results in visuals for that matter are also a subproduct of anti-aliasing (being accelerated by the ever more powerful processors). So, human eye get it harder

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement