Making Sense of Color Management

Making Sense of Color Management Book Cover

After over two years of work, my book on color management is now available for purchase. People I know and respect are saying some really nice things about my writing. It makes me happy when doing hard things pays off.

Previously, I’ve written about how displays are changing and how color affects the things we build for these devices. Whether you build on the web, or with native apps, your work in the coming years will be affected. You can learn more about the book at the Iconfactory.

But don’t just take my word for it. Here’s what Mike Krieger, Cofounder and CTO at Instagram, has to say about the book:

For years, engineers and designers have mostly stumbled through color management, understanding it ‘just enough’ to ship an asset to the web or an app. As devices move to wide color, a deeper and more practical understanding is vital, and Craig’s book provides exactly that. In fact, I’ve put his advice to use for Instagram.

As a developer, you might be interested in taking a look behind the curtains at the book’s mini-site. You’ll find additional articles, new markup for the web, and sample code for both iOS and macOS. The book provides essential background for these examples, but it will give you a taste of what you’ll be learning.

I also have some more advanced code examples for iOS in the works. If you work with raw pixels in bitmaps, process photos with Core Image, or do analysis with vImage, this will be right up your alley, so stay tuned!

Sticker Accessibility

The popularity of Stickers was no surprise to us. What did surprise us was that these graphical elements are a hit with customers who have vision difficulties.

In retrospect, it makes sense. You want to let friends know that poo is hitting the fan even if you can’t see well. As always, Apple has thought about making their products accessible from day one, and the new features in Messages are no exception.

But it doesn’t work like you’d expect for the default apps created by Xcode. Take Parakeet’s excellent Snacks collection as an example. What would you expect to hear VoiceOver say with this configuration?

Bacon

Congratulations if you said “Bacon P-N-G Accessibility Label”. Technically, that’s the “same” as the Bacon.png file that was dragged into the Asset catalog, but it’s not what you or your customer expects. When you add “Bacon” in the Accessibility field as well, it’s read correctly and everyone wins. As you know, you can’t have too much bacon.

As for our own Sticker packs, we implemented custom view controllers and don’t suffer from this particular problem. We have identified some other small accessibility issues throughout our work and will be issuing updates soon. Parakeet will also be updating their release with improved labels.

If you’ve released Stickers for iMessage without Accessibility labels, we suggest that you do the same.

Pretending You’re Not Busy As Hell

You know those last few weeks of a project where it seems like every ball you own is up in the air? Your desktop looks like bomb went off: stuff like “website comp (with hero)-20160414-final-2.1 copy.psd” and “DO NOT DELETE YET” scattered all over the place. You’re busy as hell.

And then you realize that you need to take product screenshots. Or do a screencast.

While doing screenshots for my upcoming book, I solved this problem by writing a simple shell script. It updates an undocumented Finder preference that controls whether the desktop is created or not. Without the desktop, all of your icons disappear (don’t worry, the files are still there!)

Simply typing finder_icons off in your Terminal lets you pretend that you’re working in complete zen and take the shots you need. Doing finder_icons on quickly brings you back to reality and lets you create an even bigger mess.

Enjoy!

Updated April 29th, 2016: Dr. Drang points out that this technique also works well for screen sharing. I try to avoid the use of killall when dealing with the Finder because you never know when it’s in the middle of a file operation (such as copying a file or deleting a folder.) Using the AppleScript quit command lets the Finder determine when it’s safe to shut down.

A Responsive Factory

Back in May 2014, we introduced a new Iconfactory home page. One of the main design goals for that site was to make the layout a responsive web design: the same site looked great whether you were looking at it on a desktop PC or an iPhone. Reading Ethan Marcotte’s book was a revelation.

Of course, that site was just a beginning. We run a lot of web sites (including some you’ve probably never heard of before). Clearly we had to pick our responsive battles.

We started with an update to our blog in January 2015. In October, we updated our iOS and OS X app catalog. And yesterday we launched a responsive design portfolio.

A year and a half after our first responsive design, we’ve hit a milestone. All of the sites listed in the Iconfactory’s red navigation bar are responsive designs and will display correctly on any device. Woo hoo!

Along the way, we cleaned up some of our branding elements and worked toward a more consistent experience across all the sites. Check out the post at the Iconfactory about the new SVG icons in Safari to see what that’s all about.

It’s clear we’re at a point in time where the vast assortment of screens is daunting. If you haven’t thought about how your site works on this wide variety of devices, now is a great time to start.