let mouthHeight=40;

function setup(){

  mic=new p5.AudioIn();

  mic.start();

createCanvas (800,600);//creem un canvas que es un espai per a dibuixar de 800 pixels d'ample que és el primer argument i 600 pixels és l'alçada de la zona de dubuix i és el segon argument de la funció createCanvas

//setup significa la configuració de la meva pantalla i del meu dibuix i és una funció que té dintre instruccions com createCanvas i dintre de cada instrucció hi ha els arguments o pràmetres que en aquest cas són l'amplada i l'alçada de la pantalla on dibuixaré*/

}

​

function draw(){

  let vol=mic.getLevel();

let eyeHeight=70; 

mouthHeight=map(vol,0,1,0,800);

eyeHeight++;

  //És una funció per dibuixar dintre té instruccions com fill que significa omplir de color, el primer paràmetre o argument és un número que correspon al color vermell, el segon paràmetre és un número que correspon al color verd i el tercerparàmetre és un número que correspon al blau. Els números van desde zero que no hi ha color fins al 255 que és el màxim . Així el color vermell pur seria fill(255,0,0); el color verd pur seria fill(0,255,0); i el blau pur seri fill(0,0,255); en el nostre cas és fill(154,0,245); té el màxim de blau, molt vermell i una mica menys de verd i això dona un color lila.Sempre es una barreja dels color bàsics que son vermell verd i blau i donen 255 per 255 per 255, igual a 16.000.000 colors diferents. El color també es pot fer d'una altra menera amb números no decimals els números decimals són del 0 al 9 i els números que utilitzrem es diuen hexadecimals(base 16): 0 al 9, A,B,C,D,F. El color FF0000

//cara

background ('white');

fill(224,177,255);// L'elipse té quatre pràmetres o arguments el primer número és la posició X del centre, el segon númer és la posició Y del centre, del tercer número és l'amplada i el quart número és l'alçada. Les diferents elipses estan en diferents posicions per exemple l'ull esquerre té una alçada i amplada molt més petita que la cara i la posició del centre de l'ull que són els primers dos números han d'estar més a l'esquerre sumo 70 pixels a la X i més amunt que el centre de la cara menys 50 pixels.

ellipse (mouseX,mouseY,300,410);

//ull esquerre

//Per moure's amb el ratolí hem de substituir el valor del centre de la el.lipse per mouseX i mouseY. En aquest cas mouseX=400 i mouseY=300

fill(147, 0, 243);

ellipse (mouseX+70,mouseY-90,70,45);

​

//ull dret

fill(147, 0, 243);

ellipse (mouseX-70,mouseY-90,eyeHeight,45);

//boca

fill(147, 0, 243);

arc(mouseX,mouseY+100,110,mouthHeight,0,PI);

}