Xu Xu – Project 03 – Dynamic Drawing

sketch

var cable = 640;
var finger = 480;
var fingercolour1 = 350;
var fingercolour2 = 380;
var light1 = 0;
var light2 = 0;
var light3 = 0;
var light4 = 0;
var light5 = 0;
var light6 = 0;
var ow = 0;

function setup() {
    createCanvas(480, 640);
}

function draw() {    
    background(50);
//light
    noStroke();
    fill(255,267,13,light1);
    ellipse(width/2, height/3, 80,80);
    fill(255,267,13,light2);
    ellipse(width/2, height/3, 155, 155);
    fill(255, 267, 13,light3);
    ellipse(width/2, height/3, 250, 250);
    fill(255, 267, 13,light4);
    ellipse(width/2, height/3, 370, 370);
    fill(255, 267, 13,light5);
    ellipse(width/2, height/3, 600, 600);
    fill(255, 267, 13, light6);
    ellipse(width/2, height/3, 800, 800);
//Finger
    strokeWeight(3);
    fill(227,mouseX-fingercolour1,mouseX-fingercolour2);
    ellipse(finger, 200, 40, 20);
    circle(finger + 50, 220, 50);
    noStroke();
    rect(finger, 190, 50, 20);
    rect(finger + 50, 190, 300, 40);
    fill(208, 156, 158);
    ellipse(finger-10, 198, 15, 10);
//cable
    stroke("black");
    fill("gray");
    beginShape();
    vertex(220, cable);
    vertex(230, cable - 30);
    vertex(250, cable - 30);
    vertex(260, cable);
    endShape();
    line(237,cable-30, 232, cable);
    line(243, cable - 30, 247, cable);
    rect(220,cable,40,55);
    fill("yellow");
    rect(199, cable + 55, 80, 20);
    rect(210, cable + 75, 60, 30);
    strokeWeight(15);
    rect(235, cable + 111, 10, 100);
//lightbulb
    strokeWeight(5);
    noFill();
    arc(width/2, height/3, 200,200, 300,0);
    arc(width/2, height/3, 200,200, 180,150);
    strokeWeight(5);
    stroke("black");
    line(140,height/3, 190,350);
    line(340,height/3, 290,350);
    fill("black");
    rect(170,350,138,10);
    strokeWeight(15);
    line(290, 375, 190, 385);
    line(290, 400, 190, 410);
    line(290, 425, 190, 435);
    fill("black");
    rect(220, 440, 40, 30);
//lightbulb interior
    strokeWeight(3);
    noFill();
    beginShape();
    vertex(220, 350);
    vertex(180, 220);
    vertex(195, 205);
    vertex(210, 220);
    vertex(225, 205);
    vertex(240, 220);
    vertex(255, 205);
    vertex(270, 220);
    vertex(285, 205);
    endShape();
    if (mouseY > 420){
    	cable = mouseY + 50;
	}	
    if (cable < 490 & cable > 370){
		light1 = 100;
		light2 = 75;
		light3 = 55;
		light4 = 35;
		light5 = 15;
		light6 = 5;
	}
    else{
		light1 = 0;
		light2 = 0;
		light3 = 0;
		light4 = 0;
		light5 = 0;
		light6 = 0;
	}
    if (mouseX > 355){
		finger = mouseX;
	}
    if(finger < 365 & cable<490 & cable > 370){
		textSize(20);
		textFont("old english");
		fill("white");
		text("OW!",420, 50);
	}
}

I wanted to create dynamic drawing that incorporates the change of mouseX and mouseY, so I created a lightbulb that will be turned on when the cable is plugged in, and the finger is able to reach the lightbulb. If the finger touches the bulb while it’s on, the person will scream “ow”.