​

// configuration variables

// how many points to use to draw our bent circle

let steps = 360 * 3;

​

// the radius of the bent circle

let r = 324;

​

// how much to dampen the noise by; makes it jagged or smooth

let noiseScale = 0.003;

​

// how far to offset based on the noise

const noiseAmount = 50;

​

function setup() {

  createCanvas(400, 400);

  noFill();

  stroke(255, 50);

  // stroke(0, 0, 255, 50);

  background(0);

  r = 400 / 2.5;

}

​

function distortedCircle() {

  beginShape();

  for (let i = 0; i <= steps; i++) {

    // use cos and sin to draw our circle point by point

    x = width / 2 + r * cos((TWO_PI * i) / steps);

    y = height / 2 + r * sin((TWO_PI * i) / steps);

    x += map(

      noise(noiseScale * x, noiseScale * y, frameCount / 500),

      0,

      1,

      -noiseAmount,

      noiseAmount

    );

    y += map(

      noise(noiseScale * x, noiseScale * y, 1),

      0,

      1,

      -noiseAmount,

      noiseAmount

    );

    vertex(x, y);

  }

  endShape();

}

​

function draw() {

  background(0);

  // background(0, 5);

  stroke(255);

  distortedCircle();

  // noiseScale = map(sin(frameCount / 100), -1, 1, 0.001, 0.01);

  // steps = frameCount % 50;

}

​