Moire Spin

// Gutiérrez Hardt Gestaltung

//

// Spin 01 (as seen on https://teia.art/objkt/237113)

//

// Interactive moiré animation. 

// Press mouse to randomly change the rotation/speed.

// Press any key to save jpg.

// 

// For more stuff check out: https://pacohardt.myportfolio.com/work

// Insta: @paco.hardt

//

// Have fun!

​

​

var v = 1;

var hu;

​

function setup() {

  createCanvas(1112, 834);

  colorMode(HSB, 360, 100, 100, 100);

  hu = random(360);

  background(0);

  noFill();

}

​

function draw() {

​

  let shiftX = map(sin(radians(frameCount)), -1, 1, 125, width - 200);

  let shiftY = map(cos(radians(frameCount)), -1, 1, 50, height - 200);

  let sW = map(cos(radians(frameCount)), -1, 1, 5, 20);

  let t = 50+map(cos(radians(frameCount * 2)), -1, 1, 0, 50);

  let r = map(cos(radians(frameCount * 1.23)), -1, 1, 1, 2);

​

  translate(width / 2, height / 2);

  rotate(PI/2);

  stroke((hu + frameCount/3)%360, 80, 100, t);

  rotate(r * v)

  ellipse(0, 0, shiftX, shiftY);

}

​

function keyPressed(){

  save("img_" + month() + '-' + day() + '_' + hour() + '-' + minute() + '-' + second() + ".jpg");

}

​

function mousePressed(){

  if(v === 0){

    v = random(-10, 10);

  } else {

      v = 0;

  }

}

​

​