Jamie Park – Project – 03

sketch

//Jamie Park           jiminp@andrew.cmu.edu
//15-104        Section E        Project #3

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

//angle variable for the rotating square
var angle = 0;

function draw(){
    background (0);
    noStroke();
    rectMode(CENTER);

    //rectangle on the right top corner that changes colors
    fill(100, mouseX, 200);
    rect(540, height / 6, 200, 160, 30, 0, 15, 20);

    //square on the left bottom that rotates when the mouse is moved
    push();
    translate(80, 390);
    rotate(180 + mouseX / 50, 300 + mouseY / 50);
    fill(mouseX, mouseX, mouseY);
    ellipse(30, 30, 70, 70);
    pop();
    angle = angle + 2;

    //bottom right square that changes size and color when the mouse is moved
    fill(mouseX, mouseY, 245);
    rect(width * 0.7, height * 0.7, mouseY, mouseY, 20);

    //ellipse on top of a rectangle that changes size and color
    fill(mouseX, mouseY, mouseY);
    ellipse(width * 0.7, height* 0.7, mouseX / 2, mouseX / 2);

    //the rectangles that shift y axis when the mouse is moved
    fill(255, 110, 163);
    rect(mouseX + 50, height / 3, 70, 300, 10);
    fill(194, 252, 3);
    rect(mouseX, height / 3, 100, 220, 10);
    fill(82, 217, 255);
    rect(mouseX + 150, height / 7, 60, 40, 10);
}

I had a lot of fun manipulating the colors, size, position and angle of various elements using x and y coordinates of the mouse. It’s interesting to see the various things one can do through using mouse coordinate!