IOS – Photoshop to iPad color profile woes

adobe-photoshopcoloriosipad

This is driving me insane.

I always design in Photoshop with my monitor profile as the active profile. My PSD's are never color managed. This is the way I've designed since I can remember and I have always had great results. Until now.

I'm designing an iPad interface and while my blues are blue in Photoshop and soft blue/greys are soft blue/grey – saving as a PNG (not converting to sRGB), emailing them to my ipad and previewing them in the Photo app makes my blues dull and my soft blue/greys more like a brown grey.

Any help would be appreciated.

Best Answer

2017 update: Display P3 Macs will display incorrect colours if you use the strategy below. I should write more about the setup required for the 5K iMacs and 2016 MacBook Pros.

You're well on track if you use "Don't Color Manage This Document" for your PSDs. That's part of the issue solved. And by disabling "Convert to sRGB" in the Save For Web window, you've solved another big issue (profile conversion on export shifting colours).

Emailing photos isn't really the best way to do on device previews though. If you can, use something else (there's a few apps that do it).

iOS devices have a gamma that's identical to OS X and Windows, so the main difference you're seeing is a difference in the display and their profile. Do not listen to anyone who thinks you should be assigning a colour profile in Photoshop or trying to saving colour profiles in exported images — they don't know what they're talking about. PNGs and other image formats have their embedded colour profiles ignored by iOS at runtime (in some cases, Xcode may display with colour management, so you should make sure you test on the device itself, or at the very least, in the iOS Simulator).

The real goal when designing app interfaces is to perfectly match the colours displayed on screen in Photoshop and saved in files with what’s displayed in other applications, including the iPhone Simulator. You want the colours to not just look the same, but the actual values saved into files to match the colours we defined in Photoshop perfectly.

So what you're after is for colour values entered into Photoshop (i.e. #FF0000) to remain that value on in the PSD, in the exported PNG and to be on the device, in memory as #FF0000.

It's possible and actually not that difficult.

Full instructions can be found here (I'm the author of the article, I hope it's ok to post it here): http://bjango.com/articles/photoshop/

However, the displays found on various iOS devices (even of the same generation/type) can be subtly or quite different. The absolute best way to get good results is to do realtime device testing, using an appropriate app for that (and one that knows enough about this stuff to get it right).