Stefanie Suk – Project 03 – Dynamic Drawing

sketch

//Stefanie Suk
//15-104 D
//ssuk@andrew.cmu.edu
//Dynamic Drawing

var a = 251; //background color
var b = 224; //background color
var c = 233; //background color
var angle = 0;

function setup() {
    createCanvas(640, 480);
}
function draw() {
    a, b, c = mouseX/4; 
    // background color change when mouse is moved 
    background(a, b, c);
    noStroke();
    push();
    translate(mouseY + 75, width/2)
    rotate(radians(angle));
    ellipseMode(CENTER);
    fill(130, 175, 255);
    stroke(217, 255, 147);
    strokeWeight(20);
    ellipse(0, 0, 200, 500);
    pop();
    angle = angle + 5
    // rotating oval position change; left when mouse moves up right whien mouse moves down
    let circlex = width - mouseX;
    let circley = height - mouseY;
    fill(230, 111, 183);
    ellipse(circlex, height/2, circley, circley); 
    // pink circle size and position change; left when mouse moves right, right when mouse moves left, big when mouse moves up, small when mouse moves down
    let cirx = height - mouseY;
    let ciry = width - mouseX;
    fill(185, 111, 230);
    ellipse(mouseX, height/2, mouseY, mouseY); 
    // purple circle size and position change; moves along the mouse, big when mouse moves down, small when mouse moves up
    fill(111, 208, 230);
    ellipse(cirx, height/2, ciry, ciry); 
    // blue circle size and position change; left when mouse moves down, right when mouse moves up, big when mouse moves left, small when mouse moves right 
    translate (mouseX + 10, height/2);
    ellipseMode(CENTER);
    fill(255, 147, 147);
    stroke(213, 68, 98);
    strokeWeight(15);
    ellipse(mouseX - 150, mouseY - 200, mouseX/2, mouseY/2); 
    // pink orange oval shape position change; long when mouse moves down and left, wide when mouse moves up and right,
}

For this project, I studied the various possibilities in the change of the shape, ellipse. Ellipse is one of my favorite shape to study because although it is a simple, single lined structure, there are so many varieties of different ellipse we can create. I tried to incorporate as many different aspects of image elements possible, like the changes in sizes, angles, colors, and position as I move the cursor around different places within the canvas. 

Leave a Reply