Quartz Composer.tv

Interaction design resources and videos for Quartz Composer and Origami.

QC.tv Episode 2: Scroll Patch →

In this episode, we focus on the Origami Scroll Patch. With the Scroll patch, your mockups can include more content than can fit on a single screen. We cover mutiple techniques for both full screen and regional scrolling within your mockups and how to use the Scroll patch to control other effects outside the scrolling regions.

Watch Episode →

Web Links for March 19


Currently the best known solution for accessing QC compositions on an iOS device. Using this utility, you can tether an iPhone or iPad via WiFi and interact with software prototypes and demos running on your Mac to communicate and iterate your concepts quickly.

Bringing design to life by James De Angelis

Interaction design is being pushed to the forefront. Ironically the biggest effect of iOS7 on visual design was to de-emphasize it by flattening it out, making it harder to differentiate on aesthetic.


jQC 0.8 – A UI framework for Quartz Composer. jQC is an open source framework complimentary to Origami.

Introduction to QC

I recently had the need to use a Particle System patch and I found this tutorial from John Park extremely useful in explaining how to configure the properties of the patch to suit my needs.

Facebook Origami 1.1 Released →

Highly recommended update to the Facebook Origami toolkit. In addition to all the bug fixes and improvements, this release includes a handy new Layer Group patch which works just like a Render in Image but doesn’t require a Clear patch.

Web Links for March 8, 2014

Facebook Paper Has Forever Changed the Way We Build Mobile Apps

A behind-the-scenes look at the team that created Facebook Paper and the design processes which lead them to use tools like Quartz Composer and Origami.

Prototyping 101

A helpful collection of Quartz Composer and Origami articles assembled by Kevin Hon Chi Hang using the Wayfinder service.

Building Facebook Home with Quartz Composer

In this series of 11 videos, David O’Brien does an excellent job of deconstructing interaction elements of the Facebook Home interface and then rebuilding them within Quartz Composer. Overall, this is an excellent resource for gaining an in depth understanding of some of the more advanced patches available within Quartz Composer.

Prototyping with Quartz Composer and Prototyping with Origami

A couple of presentations by yours truly on the topic of interaction prototyping.

QC Designers Forum

A great forum for designers, animators, and developers interested in creating more delightful experiences with tools like Quartz Composer.

QC.tv: The 4 Minute Guide to Quartz Composer →

In this screencast, we cover fundamental topics like: compositions, patches, ports, and how to efficiently navigate the Quartz Composer user interface. If you’re interested in using the Facebook Origami toolkit but find yourself getting lost in Quartz Composer, this brief instructional video is for you.