Plate folio 20 (interactive) [HW2]

​

//function preload() {

//  img = loadImage("assets/paper_texture_v5_by_bashcorpo.jpg"); }

​

var fr = 13

​

function setup() {

  createCanvas(700, 1000);

  frameRate(fr)

 // image(img, 0, 0);

} 

​

function getRndInteger(min, max) {

    return Math.floor(Math.random() * (max - min) ) + min;

}

​

function draw() {

  background('#DFD5BB'); 

  stroke('#A9A391');

  strokeWeight(4);

  noFill();

  rect(0, 0, 700, 1000);

  var varx = mouseX

  var vary = mouseY

  //red

  noStroke();

  fill('#D94832');

  quad(varx,vary,550,175,400,75,100,450); // make point 1 a variable and connect with shape 2 and mouse

  //blue

  noStroke();

  fill('#439AA9');

  quad(varx,vary,575,550,625,950,300,900);

  //blackshape

​

  noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

    noStroke();

  fill('#2C2629');

  translate(0,getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  //scale(getRndInteger(0.5, 1), getRndInteger(0.5, 1))

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

  noFill();

  stroke('#2C2629');

  strokeWeight(1);

  translate(getRndInteger(0, 100),getRndInteger(100, 900));

  rotate(getRndInteger(0, 360));

  beginShape();

  vertex(12, 238);

  vertex(14, 252);

  vertex(53, 248);

  vertex(76, 466);

  vertex(90, 465);

  vertex(65, 247);

  vertex(176, 234);

  vertex(146, 465);

  vertex(157, 467);

  vertex(188, 233);

  vertex(687, 173);

  vertex(685, 158);

  endShape(CLOSE);

​

  //outlineshape

}