For instance, the great Magical Otoge Ciel game is 144Mo big, including 61Mo of images. While images are correctely resize (step 1), they are all in PNG and are not optimized. As I converted this game to HTML5, I had to reduce the size of the image. I therefore modified the format of certain files (step 2) and used an image optimizer (step 3). In less than one our of work, the global image size was divided by four (15Mo instead of 61Mo) without any visible quality loss. If this changes had been made directely in the final Ren'Py release, the game size would have been 98Mo instead of 144Mo. I've chose this game as an example, but the results were similar for almost all the other games I've worked on.
It is not complicated and doesn't take a lot of time. There is just few simple steps to follow.
Step 1: Resize your images
Screen definition is defined in the configuration variable. It is by default 800x600 but can be changed to other values like 1024x768 (3:4) or 1280x720 (16:9). Except if you're planning to zoom on an image, there is no reason to use a higher definition than the display one. If the game is in 800x600, all background and CGS should be in 800x600 and sprites should be resize accordingly.
Images can be easily downsized, but will appeared pixelated if enlarged. It is therefore adviced for graphist and illustrator to work on high resolution images and reduce the file dimension at exportation. By doing so, you leave open the possibility of increasing the screen resolution later. As you can see here, about 97% of people have a screen resolution of 1024x768 pixels or higher. Moreover, most computers have a 16:9 widescreen display instead of 4:3. So, why keep using of format that nobody uses anymore? That's the reason why most Ren'Py project are now made in 1280x720. With the democratisation of high definition, it could even be worthwhile to chose a higher resolution like 1600x900 or even 1920x1080. But it will highly increase the size of the game in Mo.
Step 2: Chose the correct format
There are two main formats: PNG and JPG.
- JPG: you can adjust the image quality to get a smaller file size. Unfortunately, JPG does not preserve transparency
- PNG: high quality but the largest file size. It should therefore only used on image with a transparent background or with really clean line art.
Step 3: Use an image optimizer
Image software like photoshop let you chose the image quality for JPG when saving. A 80-90% compression is in most case not noticeable to human eyes and can reduce the file size up to 50%.
PNG images are not compressed and are really large files. Any PNG should be therefore optimized. Optimizers can greatly reduce the size of an image, by taking off informations that are not seen by human eyes. In most case, you can reduce an PNG image file size up to 75% without any quality lose.
List of image optimizers:
- JPG: File Optimizer (Windows) and Image Optim (Mac)
- PNG: I tried many compression engine and pngquant gives the best result. You can install PNGoo (Windows), Pngyu (Mac/Windows) or use an online convertor like kraken.io and tinypng.com. This engine will only conserve 256 colors (or less) and will work wonderfully on most sprites. This color limitation can lower the quality on sprites with many gradients. In this case, you can use a less aggressive lossless compressor like File Optimizer (Windows), Image Optim (Mac) and others. If this lossless compression is not enough, you can use JCC compression that gives great result (see Jibus message below) but is much more complicated to deal with. You should therefore use JCC compression only if all the other solutions failed
Warning: some software replace the files when optimizing them. You should therefore always make a back up of your images before using batch conversion. Moreover, image can suffer from quality loss, so you should always check the results after.
Of course, there are other solutions to greatly reduce file size like using LiveComposite for character expressions.
As I said before, audio files contribute as well largely to the final size of the project. I don't know anything about audio compression, but it could be great if someone could write a tuto about this!
