What is the best size of PNG pictures to be used for games?

Inkscape lets me export SVG files into PNG pictures, by letting me choose the width and the height of the output image. As I’m ignorant in graphics, please can You tell me what is the best size to export images to?
Thanks :slight_smile:

1 Like

Well. 8x8 ? ;D
As little as you possible can get away with.
Graphic memory is the biggest bottleneck in game development so try to use every single pixel optimal. That’s why we keep it tile based, reuse reuse and reuse.
Bonus points for getting as many different objects stucked into the same atlas.

But for looks, try to keep the actual visible pixels at 1:1 to the prefered screen-resolution for optimal visual eyepopping awesomeness.

3 Likes

Power of two (128x128, 512x512, 64x64 and so on)

Also: Square atlases no larger than 2048x2048 pixels if you are developing on iOS and want iPhone 4 users to be able to use your stuff. Square because of an issue with texture compression on iOS (PVRTC)

On atlases: Assets that are loaded at the same time in the game (example, all textures for a particular level) should be on the same atlas. One single atlas > One material > One draw call for all objects using said material = Good for performance.
Several different atlases > Several different materials > A lot of draw calls = Bad for performance.

If you use a lot of alpha textures, then another common practise is to separate the atlases into one opague (RGB) and one with transparency (RGBA), instead of mixing opague and transparent textures on the same atlas. I’ve done this in Unity in the past to save extra perfromance.

6 Likes

@Martin_Dahlin (and others willing to chime in) What is the prevailing wisdom for persistent assets like textures used for GUI elements such as a HUD? Their own atlas? Part of a larger whole? It seems tempting from an organizational point of view to have an atlas with say, all enemies on it, or all floor-tile types (assuming they can’t all fit on one large atlas with everything else). If only some of those enemies will exist on a given level though, is it then better to have a number of small atlases , one per enemy type? This all boils down to paging a certain amount of texture info in and out of working available gpu memory, is that right?

There is nothing special about the textures used in a GUI compared to what is used on say, a sprite or a model. Instead what it all comes down to is how many materials that are used at the same time and how many texture maps that are read into memory. How hard you chose to optimize is entirely up to you, and varies from platform to platform. (Texture optimization is critical when developing mobile games - while for PC you can afford to be sloppy). The general rule of thumb is that it’s always more expensive to load many maps into memory than it is to load just a few - even if the actual pixel space is the same. (So four 512x512 maps are more expensive than a single 1024x1024 map).

But there are exceptions ofc. If you are loading a level that only uses 5% of a certain texture atlas, then maybe it’s better to move that 5% texture space into another atlas that’s specific for that particular level? At least it should be considered.

Another exception is with tiled textures on 3D surfaces where you want repetition along both two axises (ground or a brick wall). In that case, if the UV-projection is larger than the default range (0->1), the texture will repeat on the mesh. In that case, if we want said texture on an atlas we will have to add splits to the 3D mesh (which ups the polycount) so that we can split up the UV-shells so they don’t go outside whatever range they need to be on in the atlas.

You can see how devs treat atlases vs individual textures if you data-extract from say, any modern FPS, You will notice that - for example - a wall texture of a house are not placed on an atlas, while all the detailing of a house (window, door, rims, etc) will be. That atlas in turn is usually asset- or area-specific in order to avoid the 5%-problem I described above (you dont want your level designers to have to think about such silly things when placing out assets in the game - like: If I add this barrel to level02, will all textures in level03 be loaded? Yes they will - if they are on the same atlas!).

In Defold, the problem of texture repetition and UV’s outside the normal range, is only an issue that needs to be considered if you are working with meshes (models).

EDIT: Also a clearification on opague vs transparent textures/atlases. The reason you can split them up is due to the fact that the amount of color channels on a texture is the same for all pixels. You cannot have a small area with only three channels (RGB) while the rest of the the texture has four (RGBA).

7 Likes

It’s probably worth mentioning that there is nothing to gain by putting the game (sprite, spine, pfx) and gui images in the same atlas since they are rendered in separate passes in the render script. You’ll end up with two draw calls no matter what.

4 Likes