My Sketch

var x;

var m;

var n;

var o;

var p;

var diametroPupila;

var bocaAbierta;

​

function setup ( ) {

    //We'll tell the computer to load the uploaded picture, in order to make a jumping man.

    img = loadImage('SHP1.png');

    //We create a background declaring its dimensions: 900x500 pixels (horizontal x vertical, as always).

    createCanvas (900,500);

​

    // start the Audio Input.

    mic = new p5.AudioIn();

    // By default, it does not .connect() (to the computer speakers)

    mic.start();

​

} 

​

function draw( ) {

    //We'll tell it to give us a specific graphics speed in frames per second.

    frameRate(240);

  //Fixed variable for the diameter of the pupils.

    diametroPupila=2;

  //Here we declare variables in order to be able to get different colors on different parts of the face depending on the mouse position.

    m=map(mouseX,0,800,0,255);

    n=map(mouseY,0,600,0,255);

    o=255-n;

    p=255-m;

    q=map(0,254,0,255);

    r=map(0,254,0,255);

    //Here we make the mouth height be directly proportional to the audio volume recieved by the microphone

    var vol = mic.getLevel();

    var bocaAbierta = map(vol, 0, 0.075,2,8);

    //Colors for the background

    background (o,m,p);

    //Main face shape:

    fill(0,0,0);

    ellipse(mouseX,mouseY,60,70);

    //These are the eyeballs:

      //"White part"

      noStroke();

      fill(o);

        ellipse(mouseX+11.5,mouseY-5,12,6);

        ellipse(mouseX-11.5,mouseY-5,12,6);

      //Iris

      fill(255-o,255-m,m+p);

        ellipse(mouseX+11.5,mouseY-5,6,6);

        ellipse(mouseX-11.5,mouseY-5,6,6);  

      //Pupils

      fill(0);

        ellipse(mouseX+11.5,mouseY-5,diametroPupila,diametroPupila);

        ellipse(mouseX-11.5,mouseY-5,diametroPupila,diametroPupila); 

    //Mouth

    fill(255);  

    arc (mouseX,mouseY+17.5,25,bocaAbierta,0,PI);  

    //Nose  

    triangle(mouseX,mouseY-6,mouseX-3,mouseY+8,mouseX+3,mouseY+8);

    //Eyebrows

    noStroke();

    arc (mouseX+13, mouseY-9,22,5,PI,TWO_PI);

    arc (mouseX-13,mouseY-9,22,5,PI,TWO_PI);

    //Headphones

    fill(255-o,255-m,m+p);

      arc(mouseX-30,mouseY,15,20,0.5*PI,1.5*PI);

      arc(mouseX+30,mouseY,15,20,1.5*PI,2.5*PI);

    noFill();

    stroke(0);

      arc(mouseX,mouseY-8,70,70,PI,TWO_PI);

    //moustache

    noStroke();

    fill(255);

      arc(mouseX,mouseY+15,38,5,PI,TWO_PI);

      //beard

      arc(mouseX,mouseY+30,10,15,0,PI);

​

}