Sofia Syjuco – Project-04

sketch

var strokeColorR = 0; // stroke color R value
var strokeColorG = 255; // stroke color G value
var strokeColorB = 0; // stroke color B value

function setup() {
    createCanvas(640, 480); // make a canvas 800x200
    background (244, 120, 100); // background color
    
  for (var i = 1; i < 10; i++) {// add 1 to i every loop, 10 times
    strokeColorR += 30;// add 30 to stroke R color
    strokeColorG -= 20;// subtract 20 to stroke G color
    strokeColorB += 30; // add 30 to stroke B color
    stroke(strokeColorR, strokeColorG, strokeColorB); // stroke color
    strokeWeight (8); // thicker lines at 8
    line(i*20, 200, 200, 200-(i*20)); // top left quadrant lines
    line(200, 200-(i*20), 400-(i*20), 200); // top right quadrant lines
    line(i*20, 200, 200, 200+(i*20)); // bottom left quadrant lines
    line(200, 200+(i*20), 400-(i*20), 200); // bottom right quadrant lines
  }
 }
function draw() {
}

In my process for this assignment, I sketched out all the points on a piece of paper for one quadrant of the piece, and slowly worked from there. Once I had figured out how the for loop would work with one quadrant, I worked on trying to better understand how altering the values of the first quadrant could accomplish drawing the next three.