Vicky Zhou – Project – 03 – Dynamic Drawing

sketch

/*Vicky Zhou
Section E 
vzhou@andrew.cmu.edu
Project-03 Dynamic Drawing*/

var lineA;  
var r = 2; 
var g = 220;
var b = 340; 
var leftelWidth = 460;
var leftelHeight = 640;
var offset = 10; 
var ballX = 400;
var ballY = 400; 
var boxX = 200;
var boxY = 200;
var diffX = 0;
var diffY = 0;


function setup() {
    createCanvas(480, 640);
    ellipseMode(CENTER);
    rectMode(CENTER);
    lineA = width/ 2;
}

function draw() {

	//changes the background depending on mouse location 
	bg1 = mouseX; 
	bg2 = mouseY; 
	background(bg1/3, g, b);

	//constrainments for left ellipse 
	var leftelWidth = constrain(mouseX, 0, 460);
	var leftelHeight = constrain(mouseY, 0, 640)


	//ellipse that moves in response to mouseX and mouseY location
	push();
	noStroke();
	fill(bg1, bg2, bg2);
	ellipse(0, 0, leftelWidth*1.3, leftelHeight*3);
	fill(bg2, 30, 40);
	pop();

	//having the line follow the mouse
	if (mouseX > lineA) {
		lineA += 3;
		offset = 10;
	}

	if (mouseX < lineA) { 
		lineA -= 3;
		offset = 10;
	}

	//lag in first ball that follows
	diffX = mouseX - ballX;
	diffY = mouseY - ballY;
	ballX = ballX + 0.1*diffX;
	ballY = ballY + 0.1*diffY;

	//lag in second box that follows
	diffX = mouseX - boxX;
	diffY = mouseY - boxY;
	boxX = boxX + 0.05*diffX;
	boxY = boxY + 0.05*diffY; 

	ellipse(mouseX, mouseY, 10, 10); //cursor mouse
	strokeWeight(10);
	stroke(200, 400, 10);
	line(mouseX, 0, lineA, height); // first line that follows
	ellipse(ballX, ballY, 20, 20); // first ball that follows
	rect(boxX, boxY, 30, 30); // second box that follows

	//"ouch" text that appears when you prod the circle
	push();
	textSize(40);
	fill(490, 20, 35);
	noStroke();
	if (dist(50, 50, mouseX, mouseY) < width/2) 
		text("ouch", 30, 50);
	pop();


}

Due to the combination of such an open-ended prompt and the introduction of so many new functions and/or forms of writing visual code, I struggled quite a lot with this project on what I wanted to achieve as well as how to write it in a way so that it would not be extremely cluttered. Ultimately I decided to recreate a childhood favorite simulation of having a series of shapes and/or objects follow your mouse as you move it across the screen. I also thought it would be funny if there was a stick to be included that would squish a circle blob to one side. She says ouch and glows red when you do so.