How-to: Create dithered 16-bit graphics for WP7

Here’s a common problem when developing WP7 applications, solved.

Problem
The Windows Phone 7 platform, and apparently especially Samsung phones, require you to use 16-bit graphics. Photoshop only writes 8-bit or 24-bit PNG files.

Of those, 24-bit gets dropped down to 16bit by force. The OS/device seem to simply drop random colors off. This leads to somewhat similar effect as if the graphics had been mega-overly-compressed with a JPG algorithm.

8-bit PNG graphics, instead, just have 256 colors, and not 16 million like the 24-bit ones. Oh the amount of pixel-level dithering. It’s like a flashback from 10—15 years back! You’ll soon learn that none of the 3 dithering modes in Photoshop will create good enough graphics with 256 colors. At least if you’re doing something challenging like a nice long gradient-colored Panorama background.

(You’ll have good vibes remembering some oldskool Lucasfilm/Sierra games, when you recognize the similarity of dithering patterns to game graphics from the 256 color days, though.)

Solution
The solution is to use the ReduceBitDepthCPP tool by Sc4Freak from Melbourne. The tool takes an input 24-bit/32-bit image in .png or .bmp format, and reduces it to 16-bit (R5G6B5) colour using the Floyd-Steinberg algorithm.

The tool is a Windows command line executable with the simplest syntax, and is very easy to use. If you’re on a Mac like me, fire up your virtual Windows installation/partition and do it there, or ask if a fellow coder/economist would run it on their PC.

The end result has really beautiful dithering, which often is almost or actually impossible to even differentiate from the 24bit original in the small mobile display and behind all other content in the Panorama. Problem solved.

Extra tip
Sadly the file size can grow when using the Floyd-Steinberg method. If you go over the line and your app turns slow, you can re-save that file from ReduceBitDepthCPP in Photoshop as 8-bit PNG. Even though it becomes somewhat ugly again, it will still look better than a file saved directly from a 24-bit to 8-bit in Photoshop. Magic!

Update 1

The download link on the original authors site doesn’t seem to be working anymore. ZIP.

Update 2

In Mango you might want to try forcing 32 bit mode on to avoid dithering altogether, but that might affect performance. Here’s how.