Pixel Envy

Written by Nick Heer.

You Don’t Design Something Like Facebook Home Using Photoshop

Julie Zhuo, product design director at Facebook:

How can we talk about physics-based UIs and panels and bubbles that can be flung across the screen if we’re sitting around looking at static mocks? (Hint: we can’t.) It’s no secret that many of us on the Facebook Design team are avid users of QuartzComposer [sic], a visual prototyping tool that lets you create hi-fidelity demos that look and feel like exactly what you want the end product to be. We’ve given a few talks on QC in the past, and its presence at Facebook (introduced by Mike Matas a few years back) has changed the way we design.

Due to the initial impression of its complexity, I’ve never bothered to learn Quartz Composer, preferring to mock up interactivity in Keynote or with HTML/CSS. The latter is particularly nice for the web, because the code can simply be copied into the final product.

After reading this article, however, I think it would be imperative to learn how to use Quartz Composer. Unfortunately, it isn’t bundled with Xcode any more. If you are a registered Apple developer, you can grab it from the developer downloads area, in “Graphics Tools for Xcode”.