BleatBlobb

var zoff = 1;

var angle = 0;

var spinSpeed = 0.0025;

var noiseSpeed = 0.25;

var noiseLevel = 0.75;

var noiseGap;

​

function setup() {

  let cnv = createCanvas(windowWidth, windowHeight);

  noStroke();

  cnv.mousePressed(userStartAudio);

  input = new p5.AudioIn();

  input.start();

}

​

function draw() {

  let value = input.getLevel();

  let noiseGap = value * 25 + 1;

​

  background(255);

  translate(width / 2, height / 2);

  rotate(-angle);

​

  push();

  translate(noiseGap, noiseGap);

  fill(255, 0, 0);

  makeBlob(value);

  pop();

​

  push();

  translate(-noiseGap, noiseGap);

  fill(0, 255, 0);

  makeBlob(value);

  pop();

​

  push();

  translate(-noiseGap, -noiseGap);

  fill(0, 0, 255);

  makeBlob(value);

  pop();

​

  angle += spinSpeed;

}

​

function makeBlob(value) {

  zoff += value * noiseSpeed + 0.001;

  blendMode(EXCLUSION);

  beginShape();

  for (let a = 0; a < TWO_PI; a += radians(1)) {

    let xoff = map(cos(a), -1, 1, 0, noiseLevel);

    let yoff = map(sin(a), -1, 1, 0, noiseLevel);

    let r = map(noise(xoff, yoff, zoff), 0, 1, 100, height * 0.6);

    let x = r * cos(a);

    let y = r * sin(a);

    vertex(x, y);

  }

  endShape(CLOSE);

}