Difference between revisions of "PNG"

Latest revision as of 17:55, 29 November 2014

PNG is a bitmap file type used in game development. For more information see the Wikipedia page Portable Network Graphics.

This format is often used for web games, because it can be highly compressed for faster download. After the download it is usually converted into a different in-game format to use in the game.

Developed as a patent-free alternative to GIF, Portable Network Graphics (PNG) format is used for lossless compression and for display of images on the web. Unlike GIF, PNG supports 24‑bit images and produces background transparency without jagged edges; however, some web browsers do not support PNG images. PNG format supports RGB, Indexed Color, Grayscale, and Bitmap mode images without alpha channels. PNG preserves transparency in grayscale and RGB images.

Warning: This is a bad format to use during while creating the source assets because it may be compressed, so you may lose image quality. It should only be used as a final step when publishing the game.

PNG Alpha in Photoshop

Photoshop has historically handled PNG files badly for artists, because it would not load the alpha as a separate channel. It would force the alpha as a transparency for the RGB layer, which would kill some of the RGB data. This was bad if you needed to redo the alpha because you wouldn't have any RGB data to work with.

In CS5 and later, you can use "Layer > Layer Mask > From Transparency" to recover the RGB, see Adobe forums. This restores the original RGB, and stores the alpha in a Layer Mask.

SuperPNG is another option. Load the PNG, then when you save using SuperPNG you can disable the transparency. This restores the RGB in partially-transparent areas, but all the empty areas are forced to white instead of the original background color. "Layer > Layer Mask > From Transparency" is better.