function setup() {
createCanvas(400, 300);
}
function draw() {
// changing background color based on mouse position
background( mouseX, mouseY, 245);
// creates pattern on top right
for (var i = 0; i < 300; i++) {
strokeWeight(0.5); // for thin lines
var x1 = width - i * 5; // x1 for curve 1
var x4 = width + 50; // x1 for curve 4
var y1 = height - i * 5; // y1 for curve 1
var y2 = height + i * 50; // y1 for curve 2
var y3 = height - i * 6; // y2 for curve 3
var y2y4 = height - i * 15; // y2 for curve 4
var y1y4 = height - i; // y1 for curve 4
//curve #1
stroke("red");
line(x1, mouseY, mouseX, y1);
//curve #2
stroke("blue");
line(0, y2, x1, mouseY);
//curve #3
stroke(255);
line( x1, mouseY, 0, y3);
// curve #4
stroke("yellow");
line(x4, height - i, mouseX, y2y4);
}
}
This project allowed me to better understand the way loops can be used. I may have struggled but I am becoming more comfortable with the concept of loops and what I can do with them. I had lots of fun integrating color and design as I grew more familiar with the concept of for loops and “i”.