6

I'm exporting PSD layers to PNGs for a game's texture atlases.

When I'm doing Copy -> New File (RGB 8-bit) -> Save As PNG, the resulting PNG is quite heavy and Finder shows white background instead of transparent.

But when I'm using Export Layers to Files (24-bit PNG), the resulting PNG is 70-95% smaller.

images

I don't need any compression by Photoshop - my texture creating software can do it well by itself. But I'd like to export layers by script instead of saving them manually.

  1. What makes Saved As PNG that heavy? Do exported images lose any color information or are reduced in quality?
  2. Why is transparency different?
5
  • 1
    Do you mean a file size on disk of 70% smaller, or do you mean the image has smaller pixel dimensions? The sample image you show, the image labeled "saved.png" looks physically smaller, but that may be an OS zoom effect.
    – horatio
    Dec 12, 2012 at 18:27
  • 1
    If you feel like getting heavy on the theory part, read this article - which, by the way, is hosted on a website that offers a standalone compression tool that does the same thing that "save for web" does in Photoshop (there is quite some programs like that, just search online for png compression)
    – kontur
    Dec 12, 2012 at 20:06
  • @horatio File size, dimensions are equal: 72*80.
    – Ivan Mir
    Dec 13, 2012 at 1:55
  • @kontur thanks for the link, I tried pngcrush to get information about ancillary chunks in PNG.
    – Ivan Mir
    Dec 13, 2012 at 3:02
  • 1
    Fireworks and Illustrator are much better tools for making transparent pngs. Illustrator makes the smallest files, follwed by Fireworks. Dec 20, 2012 at 3:07

2 Answers 2

5

Copying 54kb PNG file to Windows XP VM decreased file size to 5kb. OS X Photoshop version adds "com.apple.resourcefork" attribute to file during regular saving. You can see it by ls -l@ filename.png. The attribute is not included in file, but the file system shows total size. The white background from the screenshot seems to appear because of this attribute. PNGs with normal file size are displayed with transparent backgrounds.

Without the attribute the size of PNG is about 5kb. It was reduced to 1.6kb by removing iTXt(870b), pHYs (9b), iCCP (2.64kb) and cHRM (32b) chunks with pngcrush.

When "Saving for Web & Devices" Photoshop still adds ancillary tEXt/zTXt chunks to the file: 0 Software: Adobe ImageReady and about 2000 XML symbols like: 1 XML:com.adobe.xmp (: ): <?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?> <x:xmpmeta xmlns:x="adobe:ns:meta/"...

UPD: I missed "Metadata" option in "Save for Web & Devices" dialog window. "None" adds only 0 Software: Adobe ImageReady to the file. File size reduced from 3.6kb to 2.5kb.

So, the end file sizes are:

  • Photoshop "Save as": 5.4kb (and OS X uses 90% more space to store it)
  • Photoshop "Save for Web", Metadata=None: 2.5kb
  • pngcrush (-rem alla -rem text): 1.6kb
3

When you "save as" you also include metadata as well as hidden application specific data.

By using the Export to PNG you strip metadata and any application specific data from the file and therefore get a smaller file size.

There should be no quality loss between the two. The primary difference is metadata.

I'm not showing any difference in transparency here. Either method results in a 32 bit PNG for me, provided the originating file had transparency. Your'e image above shows Finder/Explorer icon previews. Previews may not have transparency, but chances are the actual image does have transparency. Preview icons are generated from a composite of layers and they do not always translate transparency correctly. But that's only the file preview generated by the operating system in most cases.

1
  • Actual images are transparent. I'm now using heavy ones with white background in Finder in my game.
    – Ivan Mir
    Dec 13, 2012 at 2:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.