selinal-Project-03

sketch

//Selina Lee
//Section C
//selinal@andrew.cmu.edu
//Project-03

var cx = 320; //center points for canvas
var cy = 240;

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

}

function draw() {
	background(50); //off black background

	var x = mouseX; //easy to write mouse variables and to be used in other functions
	var y = mouseY;

	var colorx = mouseX%255; //variables to alter color on canvas without going over 255 RGB limit
	var colory = mouseY%255;

	var oppy = width/2 - mouseY; //reacts opposite of other part in the y direction

	var rad = dist(cx, cy, x, y); //creating area between center point and outerpoint of ellipses for interaction

	//upward and downward moving rectangles
	fill(colorx, 200, colory);
	rect(0, y, 320, 480);

	fill(colory, 200, colorx);
	rect(320, oppy, 320, 480);

	//series of ellipses changing size and color
	fill(colorx, 200, 200);
	ellipse(cx, cy, rad + 150, rad + 150);

	fill(200, colorx, 200);
	ellipse(cx, cy, rad + 140, rad + 50);

	fill(200, 200, colorx);
	ellipse(cx, cy, rad + 50, rad + 140);

	fill(colory, 200, 200);
	ellipse(cx, cy, rad, rad);

	fill(200, colory, 200);
	ellipse(cx, cy, rad - 20, rad - 40);

	fill(200, 200, colory);
	ellipse(cx, cy, rad - 40, rad - 20);

	//series of lines to follow mouse with
	stroke(colory, colorx, colory);
	line(cx, cy, x, y);
	stroke(colorx, 200, 200);
	line(cx, cy, x + 5, y + 5);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 5, y - 5);
	stroke(colory, 200, 200);
	line(cx, cy, x + 5, y);
	stroke(200, colorx, 200);
	line(cx, cy, x - 5, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 5);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 5);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 15, y + 15);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 15, y - 15);
	stroke(colory, 200, 200);
	line(cx, cy, x + 15, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 15, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 15);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 15);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 25, y + 25);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 25, y - 25);
	stroke(colory, 200, 200);
	line(cx, cy, x + 25, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 25, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 25);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 25);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 35, y + 35);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 35, y - 35);
	stroke(colory, 200, 200);
	line(cx, cy, x + 35, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 35, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 35);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 35);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 45, y + 45);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 45, y - 45);
	stroke(colory, 200, 200);
	line(cx, cy, x + 45, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 45, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 45);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 45);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 55, y + 55);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 55, y - 55);
	stroke(colory, 200, 200);
	line(cx, cy, x + 55, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 55, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 55);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 55);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 65, y + 65);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 65, y - 65);
	stroke(colory, 200, 200);
	line(cx, cy, x + 65, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 65, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 65);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 65);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 75, y + 75);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 75, y - 75);
	stroke(colory, 200, 200);
	line(cx, cy, x + 75, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 75, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 75);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 75);
	
	stroke(colorx, 200, 200);
	line(cx, cy, x + 85, y + 85);
	stroke(colorx, colory, 200);
	line(cx, cy, x - 85, y - 85);
	stroke(colory, 200, 200);
	line(cx, cy, x + 85, y);
	stroke(colory, 200, 200);
	line(cx, cy, x - 85, y);
	stroke(200, 200, colory);
	line(cx, cy, x, y + 85);
	stroke(200, colory, colorx);
	line(cx, cy, x, y - 85);
}

The visuals for this project are based on a shadowed ray (the array assortment of lines which follow the position of the mouse but extend from the center of the canvas). The rest of the visuals were based on the centripetal movement of the lines, hence the creation of the ellipse series and their opposition to each other depending where mouseX and mouseY are. I noticed the project resembled an eye which was not intentional, but in order to balance the familiarity of the ellipses, the sliding blocks in the background were added as a more linear and angular contrast.