Advertisement

Scaling down UI/world for lower resolutions?

Started by October 17, 2018 07:05 AM
3 comments, last by suliman 6 years, 3 months ago

Hi!

Im making 2D games for directx using an old game engine. Typically the user can choose common resolutions (between 1360x768 to 1920x1080) and run in both window and fullscreen mode.

I simply show less of the world in lower resolution, and place ui elements such as panels as I can along the borders (doing mostly strategy games so imagine starcraft or age of empires). 

A better solution would be to render all unto a texture and scale that one down if the user has chosen a lower screen setting. But the quility gets crappy (rendering to 1920x1080 and scale down to 1360x768 for example). I was given the advice to try to render to a much larger texture such as 4k x 4x and scale that down instead.

Would that work? How is this normally handled? And wouldnt i get a stretched image that looks bad if the aspect ratio for the setting the player chooses isnt what I had in my original render?

You're correct that aspect ratio can be an issue regardless of what approach you take. Aspect ratio and window resolution are to a certain extent orthogonal issues. As you said, using a fixed aspect ratio for the game content could result in stretching/distortion, which I think would be undesirable under most circumstances. So even with the downsampling approach you mentioned, you'd still need a way to handle that. With your e.g. 4kx4k approach, the simplest option might be to clip off the sides or top/bottom of the rendered image as appropriate based on the window aspect ratio (since you're already ok with showing less of the world under certain circumstances, it seems like this would be acceptable).

Is there any particular reason you think the quality is or would be poor when downsampling from e.g. 1920x1080 to 1360x768, as you mentioned? I'm not questioning it - I'm just curious as to whether you've tried it, and if so, what sort of negative effects you're seeing.

Maybe the downsampling approach is desirable for reasons I'm not thinking of, but it seems like it could have some cost in terms of texture memory and rendering effort.

An alternative would be to use art appropriate for the largest resolution you want to target, and then render directly to the selected resolution while letting mipmaps handle the downscaling. That could still result in a lot of wasted texture memory though. A further refinement would be to load art based on the selected resolution (similar to how platforms like iOS and Android provide ways of selecting differently-sized images based on screen size).

Also, you may already have thought about this, but showing less of the world on lower resolutions isn't the only option. You could just allow everything to scale with the resolution instead (although as mentioned before you'd still have to deal with differences in aspect ratio).

Advertisement

I've hit a similar issue in my game, it's a puzzle solver where visibility of the whole puzzle is useful and the level designer has assumed that it's a 1920x1080 screen with 64x64 blocks. For the other resolutions, typically lower spec PCs, the choices as mentioned above:

1. Draw to an off-screen texture at 1920x1080 resolution and then scale on screen (maybe with the text overlays rendered at the native resolution for simplicity)

2. Draw directly to the scaled ratio

The advantage of #1 is that it's the simplest (I do this for my UWP version so users can resize the window without killing my puzzle aspect). The disadvantage is that you're burning compute cycles to do so. Whether this is important depends on the rest of the load on your GPU. For me, it appears to be irrelevant though. 

#2 allows a much greater flexibility, but does require greater resources (i.e. those for 32x32, those for 64x64 etc.) Along with probably slightly more complicated rendering logic.

Reading your post more though, you talk about a strategy game - and hence I'm assuming that being able to see as much of the battle field as you like is important. I'd almost argue that users would expect to be able to zoom in / out regardless of screen resolution, so I'd be inclined to go for option #2. You could do as @Zakwayda points out and use standard mip-maps and if you're allowing zooming to be done dynamically, I'd go down this route. Otherwise, you could do this in the resource generation stage of your pipeline, so you only ever load in a single resource set rather than loading multiple and subsequently deciding which texture set to use per frame.

Also, for the aspect ratio, for my game (puzzle in a space station), if a user resizes to a weird ratio, I just add black bars on the appropriate side. Again, for a strategy game, I'd be inclined to let them play with whatever ratio they have.

Regarding what the problem with downscaling from 1920x1080 to 1360x768: It just looks ugly. Blurry sort of. I think it's because it's not a integar scaling factor so it skips some lines, but it's not uniform.

I think i need to continue with my scaling and moving around gameplay elements into the screen res that the has chosen...

A side note: Do you think allowing only resolutions between 1920x1080 to 1360x768 is ok for a indie 2d game? Im not selling it anyway but still. Do screens of 1440p or 1920x1200 look crap with this? (you can always play in windowed mode but still...

This topic is closed to new replies.

Advertisement