Project-04

For this project, I started with a basic pattern I wanted to achieve, then kept modifying it and exploring what I could do with mouse movements as well. Move your mouse around to reveal the hidden face 😀

zimmy string



function setup() {
    createCanvas(400, 300);
    background(0);
    stroke(255);

}

function draw() {
	var xL1 = 0;
	var xL2 = 0;
	var y1 = 0;
	var y2 = 400;
    
    stroke(255, 131, 100);
    var y = 0
    for(var x = 0; x <= 400; x += 10){
        line(x, y, mouseX, mouseY);
    } // orange lines that follow mouse and fill in the background

    noStroke();
    fill(0);
    circle (130, 130, 10);
    circle(150, 130, 10);
    arc(140, 140, 30, 30, 0, PI, CHORD);
    // hidden smiley face :D

    stroke(255, 210, 235);
    for (var y1 = 0; y1 <= 300; y1 +=10) {
    	line(xL1, y1, xL2, y2);
    	xL2 += 40;
    } // pink lines in bottom left corner

    var xR1 = 400;
    var xR2 = 400;
	var y1 = 0;
	var y2 = 400;
    for (var y1 = 0; y1 <= 300; y1 +=10) {
    	line(xR1, y1, xR2, y2);
    	xR2 -= 40;
    } // pink lines in bottom right corner

    stroke(255);
    xL2 = 0;
    for (var y1 = 0; y1 <= 300; y1 +=10) {
    	line(xL1, y1, xL2, y2);
    	xL2 += 30;
    } // white lines in bottom left corner
    
    stroke(200, 0, 200);
    xR2 = 400;
    for (var y1 = 0; y1 <= 300; y1 +=10) {
    	line(xR1, y1, xR2, y2);
    	xR2 -= 30;
    } // purple lines in bottom right corner
    
    stroke(239, 29, 255);
    xR2 = 400;
    y2 = 0;
    for (var y1 = 300; y1 >= 0; y1 -=10) {
    	line(xR1, y1, xR2, y2);
    	xR2 -= 10;
    } // purple lines in top right corner
    
    stroke(255, 131, 199);
    xL2 = 0;
    y2 = 0;
    for (var y1 = 300; y1 >= 0; y1 -=10) {
    	line(xR1, y1, xR2, y2);
    	xR2 -= 10;
    } // pink lines in top right
    

}

Leave a Reply