// Kyle Leve
// Section A
// kleve@andrew.cmu.edu
// Project-04-String Art
var cirX = 200;
var cirY = 150;
function setup() {
createCanvas(400, 300);
background(0);
}
function draw() {
// Creates red lines
for (var a = 0; a < 1.5; a += 0.04) {
strokeWeight(0.4);
stroke('red');
x1 = lerp(0, width / 2, a);
y1 = lerp(0, height * 2, a);
x2 = lerp(width * 2, 0, a);
y2 = lerp(height / 2, 0, a);
line(x1, 0, width, y1);
line(x2, height, 0, y2);
line(x1, height, width, y2);
line(x2, 0, 0, y1);
}
// Creates white fade at the bottom
for (var b = 0; b < 300; b++) {
strokeWeight(0.5);
stroke(255);
line(b * 10, 10, b, 310);
}
// Creates ellipse in the center
fill(0);
ellipse(cirX, cirY, 100, 100);
// Creates gray lines
for (var c = 0; c < 1.2; c += 0.03) {
strokeWeight(0.2);
stroke(170);
x1 = lerp(0, width / 5, c);
y1 = lerp(0, height * 5, c);
x2 = lerp(width * 5, 0, c);
y2 = lerp(height / 5, 0, c);
line(x1, 0, width, y1);
line(x2, height, 0, y2);
line(x1, height, width, y2);
line(x2, 0, 0, y1);
}
// Creates two dark red triangles in the circle
for (var d = 0; d < 0.75; d += 0.08) {
strokeWeight(1.25);
stroke('darkred');
x1 = lerp(150, 200, d);
y1 = lerp(150, 200, d);
x2 = lerp(150, 200, d);
y2 = lerp(150, 200, d);
line(x1 + 25, 120, 175, y1 - 30);
line(x2 + 50, 150, 200, y2);
line(x1 + 50, 150, 200, y2);
line(x2 + 25, 120, 175, y1 - 30);
}
nofill(); // I am not sure what this does but it makes the picture look cool!
}
I found this project to be really difficult since I did not know where to start. I ended up just trying to use the lerp() function until something showed up on the canvas, but once it did I began to understand what I was doing. Throughout the project I was able to learn how to grow and shrink lines and move them around. Overall, I found this project to be very informative and interesting to learn.