: I can't seem to make these png image sequences small enough! So, long story short, we are developing an app. We have a couple of animations which are roughly 200 png's long. We are no

@Holmes874

In short PNG, just like GIF, is based on color reduction for compression. And by rescaling, you're increasing the amount of colors.

A regular bitmap is saved as 24 (or 32, including transparency) bits per individual pixel, which gives RGB channels of 8 bits, and a total of 256x256x256 = 16 million colors.

GIF says wait. I'm going to use less colors (256 in total), and I'm creating a list of all the colors I am using. So your colors can be picked from those 16 million, just not too many of them. This makes it much more efficient than a bitmap, with the downside that you can't use the whole 16 million colors in a single image. But for simpler images that's fine.

A GIF is at least ~3 times as efficient (8 bits vs 24 bits), but potentially more. Because if you only use 16 colors instead of 256, it only needs 4 bits per color. And GIFs also don't store every single pixel. A bitmap will say 1, green, 2, green, 3, green, 4, green, 5, blue, 6, red, 7 blue, 8 blue. Whereas a GIF will say 1, green, 5, blue, 6 red, 7, blue.

PNG is almost the same as a GIF, but it says; yeah I like the idea of using less colors, and just listing the first out ouf a series of same-colored pixels... but what if I do need more than 256 pixels? PNG will use less bits if possible, so 4 bits if you use 16 colors, 8 bits if you use 256 colors or less, and 24 bits if you're actually using all 16 million colors because it's a photo of a holi celebration.

What this boils down to is this; the less colors you use, and the larger your flat areas are; the smaller your filesize is.

When exporting the artwork from flash, your artist (or an algorithm) looked at the work and said; okay I am currently using a lot of colors, but if I reduce it to about 32, it will look pretty much the same to the naked eye.

Then you took the image and resized it, which creates more unique pixels. Because instead of a clean cut between color A and B, the border is now halfway between a pixel, so photoshop creates a new color that is a mix of A and B. This has two main effects:
- it creates more colors, so writing down each color takes more bits
- it creates more color changes per row

Both make the image file larger.

Take a simple circle for example:

Goes from 16 to 17 pixels, and from 2 to about 8 colors.
I can write down the (firs few lines of) first circle as

1, white, 6, blue, 12, white, end
1, white, 4, blue, 14, white, end
1, white, 3, blue, 15, white, end


Whereas the second circle is

1, white, 6, lightblue, 7, darkblue, 8, blue, 11, darkblue, 12, lightblue,13, white, end
1, white, 4, lightblue, 5, lightishblue, 6, blue, 12, lightishblue, 13, lightblue, 14, white, end
1, white, 3, lightblue, 4, blue, 14, lightblue, 15, white, end


Which is well over twice as long.



Other people mentioned header data, and exponential growth (scale by 105% means you get 110% amount of pixels) but I believe the bitdepth is the primary cause of the size increase in this case. Imagine writing down a class of schoolchildren by first name only, or by both first and last name.

Vote Up Vote Down