Tutorial

This browser does not have a Java Plug-in.
Get the latest Java Plug-in here.

Draw Sync - Play notes when drawing Reload page to restart example
Notes are played inside the draw() method enabling the syncrhronisation of drawing and music.



The first two lines import and initialise the SoundCipher library.

The setup() method sets the framerate for Processing - how often it calls the draw() method - to 8 frames per second.

The draw() method first clears the drawing area with the background() command. It then draws a line from a random location to the current mouse position. It then sets soundcipher to a random instrument sound, changes the pan location to the current horizonal mouse position, and plays a note. Notes take three arguments; pitch, dynamic, and duration. The note pitch is randomised but relative to the virtical mouse position, has a random dynamic, and a fixed short duration of 0.2 beats per minute (equal to 0.1 seconds at the default tempo of 120 bpm).

While this is an easy method of syncing sound and image, the drawing regularity does not provide flexible tempo control. The draw() method is called at Processing's framerate (e.g., 10 times per second). This means that the speed of music playback is also quantised to the framerate. The spacing of framerates, 1, 2, 3, ... 10, 11, 12, ... 30, 31, 32, etc. provides an uneven tempo distribution. SoundCipher provides the SCScore class that can play notes (and schedule drawing) at more musically useful intervals - beats per minute.

Playing notes inside the draw() method is a quick and convenient way to add music and sound to Processing sketches when complex musical timing is not required. See also the SoundEffects tutorial example.