Free Birds




"Born free, as free as the wind blows"



Chinmay - Audio Guy, Sonoport
Joshua Koo - Troublemaker, Zopim
(For the interactive bokeh edition)

Background





Stab at Art Installation Project  




Collaboration to create a visual and aural experience

We had really little time...

But we wanted to try creating something...

Release something...

And hopefully help start a new scene in Singapore.

Concept

Lonely Birds

They are trapped in your mobile devices

Free them!

Let the birds interact as a flock!

Architectural


installation vision

Audio


  Controls for Synthesized Birds

Bird Sounds

Add sounds to :

Sounds


Realistic?  - Maybe


Interactive?  Definitely!


Browser Based?  Definitely!


YAY!! I GET TO USE WEBAUDIO API !!!!!

Sound Design

Andy Farnell - http://obiwannabe.co.uk/

Bird Sound Synthesis

Modeling Bird Syrinx

Moar Bird Sounds!

Amplitude Modulation + Frequency Modulation

Pure-Data -> WebAudio

Psst.. Wanna see some code?

Oscillators
  // Create Oscillators
  var carrierOsc = audioContext.createOscillator();
  var modOsc = audioContext.createOscillator();
  var amOsc = audioContext.createOscillator();

  var modOscGain = audioContext.createGain();
  var amOscGain = audioContext.createGain();

AM + FM
  // Create the AM/FM structures
  var fm = new fmSynth(audioContext, carrierOsc, modOscGain);
  var am = new amSynth(audioContext, fm, amOscGain);

Moar Code!

Envelopes
 // Create control envelopes
 this.mainEnvelope = new paramEAD(audioContext, mainGain.gain);
 this.fmFrequencyEnvelope = new paramEAD(audioContext, modOsc.frequency);
 this.amFrequencyEnvelope = new paramEAD(audioContext, amOsc.frequency);
 this.fmGainEnvelope = new paramEAD(audioContext,  modOscGain.gain);
 this.amGainEnvelope = new paramEAD(audioContext, amOscGain.gain);
 
Connections
 // Connect the AM output to destination
 am.connect(mainGain);
 mainGain.connect(panner);
 panner.connect(audioContext.destination);

Profit??

Lets make some NOISE!

Chirrp

Visuals

Three.js, WebGL, Shaders, GPGPU

Visual Experiments

Demo!!!

Contact Us!


Chinmay - http://about.me/chinpen
Joshua Koo - joshuakoo.com

Links

Google Dev Art Page

Our DevArt Project Entry

Project Code in Github