How to keep consistent between image quality, device range support and final size of the game?

Question

I am developing a game with the LibGdx framework, but I would like to discuss a more theoretical question.

Criteria:

1. I want to support as many devices as possible for my game (phones and tablets)
2. I want to see the same image quality for each device (it is a different topic about scaling or aspect ratio)
3. I want my game to not freeze (support devices with a low amount of RAM).
4. I want to make my game as small as possible.

For example, let's take a look at the Samsung Galaxy Tab S4 10.5. It has a resolution of 2560x1600.

If I take this resolution as standard, and make all other textures dependent on this background resolution, it will make a huge size for images. Also, It won't work on slower and older devices with small resolution. (800x480, etc). So it does not satisfy criteria #1, #2 and #3.

I suppose I can make different quality versions of the same images for different devices. It may affect only the #4 criteria, but it's not as critical as others.

What strategies do you guys use to satisfy the above criteria?

Answer 1

There's not perfect answer that cover everything you've asked for. However I have some tips that can help.

• If you are focusing on Android, you can upload images of different sizes for different screen densities. This ensures that images display with roughly the same quality/size without any blurriness. This also means that a small-screen phone will load the smaller asset, requiring less memory (RAM). You can read more on Android Developers - Support different screen sizes.
• To support multiple screen sizes, simply make sure that when placing assets on the screen, you don't use absolute pixels. So if you want a button on the right side of the screen, do not set it on pixel 470, set it on pixel SCREEN_WIDTH -10 (assuming 10 is the desired padding). This ensures the button will be on the right side of the screen regardless of screen size.
• Unfortunately for android, if you support small screens and bigger screens, you will need separate assets. When the game is installed on a small-screen device, it will also install the assets for the bigger screen. As far as I understand, that's in case you plan to connect your phone on a bigger screen, it will user bigger assets. That means if you decide to support a massive screen (TV?) with 4k quality, and big density, you will need big assets, which contribute to the installation size even on smaller devices.
• If you want to support older android versions, if your app doesn't use any new feature, there is no reason to declare in your manifest that you only support the latest version. For most games, the only thing they do is draw pixels on the screen, which the oldest android versions could do as well. If you want to have optional new features, make sure you check it in the code, something like if (supports_notifications) { showNotification(); }. This ensures your game runs on most android versions.
• If you have an asset that has a simple shape, take a look at Android Developers - Add multi-density vector graphics. The idea is basically you describe an asset using vector graphics, and it works on all device sizes/densities. I made a simplistic game in the past using this technique, that was less than 500kb in size. Keep in mind that really complex assets might take longer to load using this method.
• For background, you can't have an image that is exactly the size of the screen. I mean, you can, but you'd need 100+ different assets, each customised for each screen, but that's just very wasteful. There are many techniques to handle that, you can for example make a background image that is big enough, but has an internal "safe zone", that is a rectangle that everything inside it will be shown no matter what. Then when placing the background, make sure you resize it, so that at least one side of the safe zone touches one side of the screen, and the other side is bigger than the screen. This means some pixels of your image will never be shown, but that the whole screen is constantly filled. Alternatively you can fit the image to the background with some black border either on top and bottom or left and right, depending on the screen's aspect ratio. The only link I could find relevant to this is V-Play Engine - How to create mobile games for different screen sizes and resolutions. It explains in details what I mean, in a way that can be used on any project.

Unfortunately you can't have both support for most devices and small game size. But I've followed these tips in the past and made games smaller than 2MB, that are still running on modern versions and support a lot of old android versions.