How To: Create audio-reactive effects for GrandVJ with Quartz Composer

Author: Gorgull

About: Software engineer at ArKaos
Web: http://www.arkaos.net/

---

In GrandVJ 1.2 we have introduced the support for Quartz Compositions, either as visual or as effect. Note that MediaMaster 1.2 will also support Quartz Compositions, so you can use this with MediaMaster 1.2 too (the beta can be found on our forums)

Quartz Composer is a free graphics and imaging tool on the Mac platform which is available as an optional install that can be found on your Mac OS X DVD since version 10.4.

It allows very easy creation of complex audio-reactive animations or effects which can now be played in GrandVJ (read the previous article about GrandVJ and Quartz Composer). As I’m writing these lines, the last version of Quartz-Composer is 4.0 on Mac OS 10.6 (Snow Leopard).

In this article we will demonstrate how to quickly create a bass-reactive Zoom/Blur effect like the one you can see below:

Important: This tutorial requires that you have some basic knowledge of Quartz Composer: if you have never used it, you really should first go through the “Getting Started”. You will also find some helpful readings at the Apple Developer Connection web site about Quartz Composer.

To create our effect we will simply edit Quartz-Composer’s default template named “Image Filter” to make it audio reactive. Basically, we will connect bass levels of the computer’s audio input signal to the “Amount” parameter of our Zoom/Blur filter. (Read more below..)

• Start the Quartz-Composer.app which is located in /Developer/Applications/

• From the menus, choose (File –> New from Template –>) Image Filter :
  

• Here’s the patch that will open:

• In the menus choose Editor –> Edit Protocol Conformance

• We will now tell the ArKaos software what inputs must be transmitted to the Composition. The ArKaos engine can send visuals or sound for processing by the Composition but only if he knows that these feeds will be accepted.
  To enable this you must check “Music Visualizer” and click “Done”

• You’re back to the Composition and several input modules have been added on the left:

• Remove every unnecessary input modules, so they won’t be listed as input parameters in GrandVJ‘s effect parameter panel:

• Quartz composer can hide blocks inside blocks, it’s called macros. It’s very powerful and in this case it holds the most important part of our composition: the processing part, which will affect the visual before copying it to the output.
  Double click on the “Process Image” macro to open it, Quartz Composer details each block contained in the macro:

• We want to connect the audio volume to the “Amount” input of the “Zoom Blur” filter contained in this macro. To do that we need to make the “Amount” parameter available in the macro block so that it can be accessed from the top level, it’s called publishing an input.
  Publish the “Amount” input as in this screenshot:

• When it’s done, we can go back at the top level to add some processing.
  In the top bar, click the “Edit Parent” button to go back the parent patch:

• Now we will add a processing block to create a value from the sound input.
  From the Library, add an “Audio Processor” module:

• You’re back to the patch with the “Audio Processor” module added. The magical thing about Quartz Composer is that you can connect the modules in many different ways, when you add a module you just have to tell Quartz Composer how to feed the inputs and connect the outputs.

• First we want to process the audio received from the ArKaos engine. To do that we connect together the “Audio Spectrum” and the “Audio Processor” module:

• Now the audio processor will create three values from the audio we are feeding, Lows, Mids and Highs. For this effect we just want to use the lower value which is the one reflecting the bass volume. So we connect the Lows output from the “Audio Processor” module to the “Amount” input we just published in the “Process the Image” macro:

At this point we need to get an audio signal so we can test our effect within Quartz Composer. For this purpose we will add an “Audio Input” that we will disconnect in the end so GrandVJ can input its own audio signal into the “Audio Processor” module.

• From the Library, add an “Audio Input“ module..

• ..and connect its “Audio Spectrum” output to the input from “Audio Processor”

Now we can see the image reacting to the audio input signal, but the effect is definitely too low, so we need to boost the audio signal values. A simple way to do that is to add a new processing module, specifically a math module:

• From the Library, add a “Math Module”..

• ..and configure it to operator Multiply, set Operand #1 to value 100:

• Connect the Lows output from “Audio Processor” to “Multiply” then connect “Multiply” to the “Amount” input from “Process the Image”

• You can now disconnect the “Audio Input” from the “Audio Spectrum” so that, once this composition is loaded in GrandVJ, the software will automatically send the audio input signal directly to “Audio Spectrum”.

• Finally save the composition as “MyBassZoomBlur.qtz” in /Users/MyAccount/Library/Application Support/ArKaos/GrandVJ/Quartz Composer/Effects/

Now is time to start GrandVJ and find your hard work rewarded by playing with your very own brand new effect. You will find it located in the Effects panel under the “Quartz-Composer (User)” effect category.

Notice how GrandVJ has made available the X and Y effect parameters from the Composition in the Effect parameter panel so you can use them to control the behavior of your effect in real time.

Now, that wasn’t hard, was it? If you want to go further, a good start will be to create new effects based on this Composition by replacing the “Zoom Blur” effect by another filter.

Don’t hesitate to share your creations on the forums :)

Be Sociable, Share!

• 

If you enjoyed this article please consider subscribing to our rss feed!