Kyle Leve-Project-04-String-Art

sketch

// 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.

Leave a Reply