A long time ago, in an office far, far away there was an idea; an idea about one tool that can generate a complete set of compressed iOS assets without a loss of quality, and that is so easy to use your Grandmother could do it. Droptimizer is the realization of this idea.
Optimizing the memory size of your iOS assets helps you not only by reducing the overall size of the app, but can also improve its speed and smoothness as elements are able to load more quickly. Droptimizer is our solution for what is often a long and tedious process.
What does it do?
The conversion which takes place within Droptimizer reduces file size significantly (often by as much as 70%) and preserves full alpha transparency if some part of an image is transparent. Otherwise, it disables the alpha channel (if an image has no transparent parts) for an even greater size reduction. The effect is nearly invisible but it makes a very large difference in file size.
Can you see the difference?
Don’t worry, neither can I, and that is the beauty of this tool.
What sorcery is this?
Droptimizer uses smart PNG quant for the lossy compression of PNG images. It is a combination of vector quantization algorithms which generates a high-quality palette enabling the reduction of unnecessary image channels. Droptimizer quantizes one or more PNGs to an 8-bit RGBA-palette PNGs using a specially modified Floyd-Steinberg diffusion dithering. By selectively decreasing the number of colors in the image, less memory is occupied to store it. The app is mostly written using the Cocoa framework, but for optimization it uses the PNG quant C library, which is available under a BSD license.
How to resize your iOS assets using Droptimizer? Following the resizing of input images and their conversion to png, comes the flow of optimization:
- Create an attributes object and configure the library.
- Create the image object from RGBA bitmap or data source.
- Perform quantization (generate palette).
- Store remapped image and final palette.
- Free up a ton of memory.
It looks something like this:
[c]liq_attr *attr = liq_attr_create(); liq_image *image = liq_image_create_rgba(attr, bitmap, width, height, 0); liq_result *res = liq_quantize_image(attr, image); liq_write_remapped_image(res, image, bitmap, bitmap_size); const liq_palette *pal = liq_get_palette(res); // use image and palette here liq_attr_destroy(attr); liq_image_destroy(image); liq_result_destroy(res); [/c]
Of course, it’s much more complicated in the source code of Droptimizer, but the above is still the core of the optimization. As you can see, the magic happens in:
[c]liq_result *liq_quantize_image(liq_attr *attr, liq_image *input_image);[/c]
This PNG quant function performs quantization (palette generation) based on settings in attr and the pixels of the image.
Afterwards, the following bit of code remaps the image to the palette and writes its pixels based on the given buffer, 1 pixel per byte. The buffer must be large enough to fit the entire image, i.e. width×height equals the required byte size.
liq_write_remapped_image(res, image, bitmap, bitmap_size)
In Droptimizer for iOS, this cycle is done three times for each given asset.
I have not laid out the complete process because the library is already very well documented.
“Lost time is never found again.”
– Benjamin Franklin
If you are a designer, then you probably already know how boring and time consuming it is to export iOS assets in three, five or who knows how many scales in order to look splendid on each and every display with their differing pixel densities. The size of those iOS assets is also very important, and manipulating them represents one more thing that takes up time that could be better spent on the design itself.
Let the beautiful, simple, and most importantly free Droptimizer developed by 12Rockets save you time and memory.