Images: PNG or JPG and what size?

How do I...?
1

Hi

I’m struggling to get consistently sharp images across html and mobile.

I’ve noticed that I can use jpg to make things a little sharper but I’m not sure if this is the only option.

Is there an ideal size for images? Anything that’s too big? Any ratios that are better than others?

I know there are a few discussions about this already and there is the option to smooth but I’m just wondering on how to be consistent with making good looking images.

Cheers

2

Just some basic tips:

  • If your picture have transparent regions use PNG file format
  • If your picture DON’T have transparent regions use JPG file format
  • Choose a base “tile size” and make your pictures according to this size (example: if you choose 32x32 size, you can make your human character 3 tiles taller (32x96) and a car can be 2 tiles taller and 3 tiles wider (96x64). It helps to keep things looking coherent
  • I don’t recommend to choose a tile size greather than 64x64
  • Configure and set the grid in the Gdevelop GUI at the base tile size, that way pictures will snap to grid and it will be much easier to design levels and align pictures.
  • Never scale a picture in-game beyond the actual size of the picture, except if…
  • … you are scaling pictures beyond its actual size for pixel-art effect and purpouse, then do it with integers (don’t use decimals for scalation factor) and remember to uncheck the smooth option (in fact, do this always you’re scaling pixel-art—integer scale factor, uncheck smooth)
3

Thanks. Great tips.