Image Processing with Quartz Composer

I was certain to find on the internet many people, and their respective blogs, performing image processing with Apple’s Quartz Composer. Quartz Composer is a great tool for creating stunning visual effects with Core Image, visually programming. One does not write code,but rather draws it by dragging and dropping boxes and connections between boxes. It’s my favourite kind of programming: Focuses on the idea, the implementation is just an artifact, an afterthought.

Well, a few Google searches later, and guess what? I could find great sites on Q.C., such as Sam’s Quartz Composer blog, but nobody processing images with Q.C.

What I needed was a Core Image Filter to calculate the Mean Square Error (MSE) between two images. Sure, Q.C. didn’t have one out of the box, but that was easily fixed by using a generic GPU-accellerated Core Image Filter. This generic Core Image Filter is based on the CIKernel language (a subset of the OpenGL Shading Language, OpenGLSL). That was all the code I had to write. About 10 lines of C-like code, and a tiny amount of javascript (mostly modified from the Core Image Filter template).

Then I used an averaging filter, to compute the average of the square error. Tada! There I had my MSE calculator. Re-factoring was a bliss, by simply selecting the MSE boxes, and clicking on “Create Macro”. That selection became a box with its own inputs (original image, estimated image) and outputs (each component of the averaged pixel). Sweet, really sweet!

MSE patchBut, this still doesn’t close the gap to this post’s title. How do we use Quartz Composer as an Image Processing tool? Well, it can be employed quickly as an Image Processing lab. For example, I created a patch to compare two images, side by side, taken with the Mac’s built-in camera, where you would compute the MSE between the images.

MSE between two shots

The original image is stored on the left-hand side. Every time the user left-clicks on the Viewer window, the original image is updated. The estimated image (camera’s output image) is shown on the right-hand side, masked with the original image. At the middle bottom of the viewer there is the computed MSE. This lab allows you to develop your image processing algorithm, and see that it works before trying to code or optimize it.

To play with this small lab, download the Quartz Composer file.

Please comment if it this helps, or if have other cool patches or filters in Quartz Composer to share.

Respond to this post