String Art-04-sehenry

While working on this project, I became very comfortable with the for() function in p5.js. I started off just writing random for() functions but then saw how easy it was to manipulate the distances and lengths and positions of my shapes and variables. I spent a little too long on this because I wanted to make an eye in the middle of the frame but it was fun!

CLICK ON THE EYE!

sketch

//Seth Henry

//Section B 10:30 Tuesday

//sehenry@andrew.cmu.edu

//Assignment-String Art


function setup() {
    createCanvas(640, 480);
   
    text("p5.js vers 0.5.2 test.", 10, 15);
}

function draw() {
	background(220);
	fill('violet blue'); //randomcolors
	rect(0, 0, width, height); //background rectangle
	if (mouseIsPressed) {
	fill(255);
	strokeWeight(2);
	ellipse(width/2, height/2, 250, 250); //eyeball
	fill(0);
	ellipse(width/2, height/2, 100, 100); //pupil
	fill(255);
	ellipse(width/2+20, height/2-30, 10, 10);//whiteball
	strokeWeight(2);
	line(width/2-75, height/2-100, width/2+75, height/2-100); //top eyelid
	line(width/2-75, height/2+100, width/2+73, height/2+100); //bottom eyelid
	line(width/2-40, height/2-100, width/2-40, height/2-120); //eyelashes
	line(width/2, height/2-100, width/2, height/2-125);
	line(width/2+40, height/2-100, width/2+40, height/2-120);
	}
	
 	else {
 	strokeWeight(3);
 	fill(102,51,150);
	ellipse(width/2, height/2, 250, 250); //eyeball
	strokeWeight(3);
	line(195, 240, 444, 240); //eyelid
	line(220, 240, 180, 260); //eyelashes
	line(260, 240, 230, 280);
	line(380, 240, 410, 280);
	line(420, 240, 460, 260);
	for (var ln = 280; ln < 380 ; ln+=40){ //middle eyelashes
		line(ln, height/2, ln, height/2 + 50);
	}
	
	
	}
	strokeWeight(1)
	stroke(random(255), random(255), random(255));
	// for(var i = 1; i<640; i+=10){ //Makes a sequence of straight lines from the top left to the bottom right
	// line(i,50,50,i);	
	// }
	for(var e = 1; e < 640; e += 5){ //Makes a curve arching to the top left of the screen
	line(width-e, 50, 50, e);
	}
	for(var a = 1; a < 640; a += 10){ //Makes a curve arching to the top right 
	line(a, 50, width - 50, a);
	}
	for(var o = 1; o < 640; o += 10){ //Makes a curve arching to bottom right
	
	line(width-o, height -50, width - 50, o);
	}
	for(var p = 1; p < 640; p += 10){ //Makes a curve arching to the bottom left. 
	
	line(p, height - 50, 50, p);
	}

	
}
	//Previous curves that I decided to exclude

// 	for(var y = 1; y<640; y+=10){
// 		line(y,height-y, width-50,y);
// 	}
// 	for(var x = 1; x < 640; x+=5){
// 		line(width-x, height-x, 50, x);
// }

	
	

Leave a Reply