Volume del frammento in esecuzione

Si ricava con la classe p5.Amplitude, senza distinguere le frequenze: un solo valore a ogni fotogramma, che può controllare qualsiasi proprietà geometrica o cromatica.

    let sound;
let amplitude;   // analisi del volume

async function setup() {
    createCanvas( 670, 200 );
    sound = await loadSound( 'liszt.mp3' );
    amplitude = new p5.Amplitude();
    sound.connect( amplitude );
}

function draw() {
    background( 255 );
    let level = amplitude.getLevel();
    let diam = map( level, 0,0.1, 0,width );
    circle( width/2, height/2, diam );
}

function mousePressed() {
    userStartAudio();
    if (sound.isPlaying()) {
        sound.stop();
    } else {
        sound.play();
    }
}

Files

Algoritmo

all'avvio:                                                        setup()
    caricare il brano e creare l'analisi del volume               p5.Amplitude
    collegare il brano all'analisi                                connect()

a ogni fotogramma:                                                draw()
    leggere il volume del frammento in esecuzione                 getLevel()
    trasformarlo in un diametro, fra 0 e la larghezza della tela  map()
    disegnare il cerchio al centro

a ogni clic:                                                      mousePressed()
    avviare il brano, o fermarlo se è in esecuzione

Istruzioni

Crea l’analisi del volume e le collega il brano: senza connect() il volume resta sempre a zero.

Restituisce il volume del frammento in esecuzione, un valore fra 0 e 1 che di solito resta molto più basso: con questo brano, nei primi 20 secondi, arriva al massimo a 0.08.

Per questo l’intervallo di partenza di map() si ferma a 0.1, che corrisponde a un diametro largo quanto la tela. Nei momenti più forti il cerchio ne esce, e la tela lo taglia.

Variazioni

Con questa riga in setup(), dopo new p5.Amplitude(), il volume cambia in modo più graduale e il cerchio pulsa meno (il valore predefinito è 0.8):

Con il secondo audio della cartella, più forte, il cerchio esce quasi sempre dalla tela:

Con un diametro massimo più piccolo, l’ultimo parametro di map(), il cerchio resta quasi sempre dentro:

Approfondimenti:

Crediti: