Sound Responsive Face

Processing — paolo @ 1:28 am

For this assignment, you’ll add sound-interactivity to your face using the Minim audio library.

Check and see if Minim is already installed (under Sketch->Import Library).
If not, you’ll need to download and install Minim, from here

The following files can be downloaded from here.

Your Processing project will have two files.
The first, main app file will be:


void setup(){

void draw(){

  // Draw the mouth.
  getVolume(); // this call fetches the mic volume for the current frame.
  float Y = map(volume, 0,100, 2,120);  // now we can use it for something!

  ellipse(200,200, 100,Y); 

  // The rest of the code just draws the Eye:
  float ex = 200;
  float ey = 100;
  ellipse(ex,ey, 60,60);
  float dx = constrain((mouseX-ex)/20, -14,14);
  float dy = constrain((mouseY-ey)/20, -14,14);
  ellipse(ex+dx,ey+dy, 20,20);

Now click on the little (+) to create the second file, which will get its own tab.
Name this file MyAudioHandler.pde, and input the following text.
Don’t otherwise change this code:

// Don't worry about understanding the stuff below!
import ddf.minim.*;

Minim minim;
AudioInput in;
float volume = 0;
float volumeF = 0; 

void setupAudio(){
  minim = new Minim(this);
  in = minim.getLineIn(Minim.MONO, 512);

void getVolume(){
  volumeF = in.right.level()*1000;
  volume = 0.8*volume + 0.2*volumeF;

void stop(){

Please note that the resulting app will not work in a browser because of security restrictions.
That’s OK.

The map function is crucial for this assignment.

float myVariable = map(volume, 0,100, 1,200);

In this snippet, myVariable will assume a value between 1 and 200 in relation to the value of volume.
0 (silence) -> 1
200 (maximum noise) -> 200
All the in-between values will be scaled proportionally.

Map can produce negative values

float myVariable = map(volume, 0,100, -100,100);

Or invert the scale

float myVariable = map(volume, 0,100, 500,0);



Make a face responsive to the microphone activity. It can be your previous one or a new one. If your static face it too complex to animate or it’s kinda ugly you should consider starting from scratch.


  • If stylized character design is not one of your strengths, look for inspirations in the pictoplasma Flickr pool
  • Sometimes a good color scheme can really push a design piece to da next level. Try to steal some cool schemes from the colourlovers community
  • Volume can affect colors, positions, sizes, portion of arcs, control points in curves
  • Always backup your projects. Careful the name of the folder must correspond to the name of the main file. es: soundFaceBackup must contain soundFaceBackup.pde and MyAudioHandler.pde.
  • The easiest way to mash up this sketch with the previous one is copy the instructions from the static face to the dynamic example and not viceversa.
  • Don’t put other .pde files in your folder unless you know what you are doing, it may confuse Processing. You should have only 2 open tabs, the face sketch and the microphone handler.
  • Don’t get too obsessed if some shape breaks or overlaps, the microphone handler is not 100% reliable and may occasionally shoot some weird levels. The function constrain(var, min, max) can also be used to limit values.

Bonus points if:

  • you add mouse interactivity.
  • you make a better face. 

Due Date: Monday 12
Bring the folder to class, unfortunately the browser version on openprocessing won’t be sound responsive.


No comments yet.

RSS feed for comments on this post.

Sorry, the comment form is closed at this time.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.
(c) 2020 CMU Electronic Media Studio II, Fall 2011, Section B | powered by WordPress with Barecity