Alina Perdomo 

**User Interface **

​

12/02/22

*/

​

​

var circleS = 70; //circle size

var sizeSlider; 

​

function setup() {

  createCanvas(400, 400);

  var newPatternButton = createButton("New Pattern")

  newPatternButton.mousePressed(pattern);

  var saveImageButton = createButton ("Save Image")

  saveImageButton.mousePressed(saveImage);

    createElement('label', 'Change Size');

  sizeSlider = createSlider(70, 150, 70);

  sizeSlider.input(pattern);

  //sizeSlider.position(10,10);

  //don't froget to call patern after interface***

   pattern ()

   }

​

​

​

  function saveImage () {

    save("useInterface.jpg");

  }

​

  function pattern (){

 background(0);

  circleS = sizeSlider.value();

​

  for (let x = 0 + 35; x <= width; x += random(20, 100)) {

    strokeWeight(random(0.5, 2));

​

    var r = random(0, 255);

    var g = random(255);

    var b = random(200, 255);

​

    fill(r, g, b);

​

    push();

    var yUp = random(35, 130); //first half

    translate(x, yUp);

​

    ellipse(0, 0, circleS);

    ellipse(0, 0, circleS - random(0, 15));

    ellipse(0, 0, circleS - random(15, 30));

    ellipse(0, 0, circleS - random(30, 45));

    ellipse(0, 0, circleS - random(45, 60));

    pop();

​

    push();

​

    var yDown = random(200, 400); //second half

    translate(x, yDown);

​

    ellipse(0, 0, circleS);

    ellipse(0, 0, circleS - random(0, 15));

    ellipse(0, 0, circleS - random(15, 30));

    ellipse(0, 0, circleS - random(30, 45));

    ellipse(0, 0, circleS - random(45, 60));

​

    pop();

  }

}

​