Millores avançades a la cara interactiva amb p5.js i micròfon

Fer que el color de fons variï amb sin i cos

Podem crear un fons més dinàmic amb canvis de color suaus mitjançant funcions trigonomètriques:

background(200 + sin(frameCount * 0.01) * 55, 150 + cos(frameCount * 0.01) * 55, 250);

Afegir parpelleigs aleatoris

Podem fer que els ulls es tanquin de tant en tant dibuixant línies en lloc de cercles:

let blink = random(100) < 2; // 2% de probabilitat cada frame
if (blink) {
    line(width / 2 - 65, height / 2 - 50, width / 2 - 35, height / 2 - 50);
    line(width / 2 + 35, height / 2 - 50, width / 2 + 65, height / 2 - 50);
} else {
    ellipse(width / 2 - 50, height / 2 - 50, 30, 30);
    ellipse(width / 2 + 50, height / 2 - 50, 30, 30);
}

Fer créixer orelles segons el volum

Podem afegir orelles que augmenten amb el volum del micròfon:

let earHeight = map(vol, 0, 1, 30, 80);
ellipse(width / 2 - 110, height / 2 - 30, 30, earHeight);
ellipse(width / 2 + 110, height / 2 - 30, 30, earHeight);

Afegir una llengua que surt amb el volum

Podem fer que una llengua surti cap avall si el volum supera un cert llindar:

if (vol > 0.1) {
    fill(255, 0, 0);
    rect(width / 2 - 10, height / 2 + 70, 20, 40);
}

Propostes addicionals per seguir millorant

• Fer que els ulls canviïn de color segons el volum.
• Fer que les orelles oscil·lin amb sinusoïdal.
• Fer que la llengua tingui moviment oscil·latori en sortir.
• Fer que el cap vibri segons el volum.

Codi complet amb totes les millores aplicades