Jasmine Lee – Project 03 – Dynamic Drawing

jasminedrawing

//Jasmine Lee
//Section C
//jasmine4@andrew.cmu.edu
//Project-03 (Dynamic Drawing)

var r = 10;
var g = 100;
var b = 50;
var angle = 0;
var sizeX = 10; 
var sizeY = 15;
var circlesize = 80;

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


function draw() {
    //change background color
    background(r + mouseX , g + mouseY, b);

    noStroke();


if (mouseX > width / 2) {
    rectMode(CENTER)
}
    push();
    translate(width / 2, height / 2);
    rotate(radians(angle));

    //rectangle
    fill(r + mouseX - mouseY, g + mouseX, b + mouseY)
    rect(mouseX, mouseY, sizeX, sizeY);
    rect(mouseX + 5, mouseY + 2, sizeX + 2, sizeY + 2);
    rect(mouseY - 100, mouseX - 220, sizeX, sizeY)
    rect (mouseY - 150, mouseX - 130, sizeX - 30, sizeY - 30);

    //rectangleset2
    fill(r - mouseX + mouseY, g - mouseX, b - mouseY)
    rect(mouseX + 50, mouseY - 50, sizeX / 2, sizeY / 2);
    rect(mouseX - 50, mouseY - 60, sizeX / 3, sizeY / 3);
    rect(mouseY - 100, mouseX - 220, sizeX / 4, sizeY / 5);
    rect(mouseX - 150, mouseY - 130, sizeX - 30, sizeY - 30);

    //rectangleset3
    fill(r - mouseX + mouseY, g - mouseX, b - mouseY)
    rect(mouseX / 2, mouseY / 2, sizeX / 2, sizeY / 2);
    rect(mouseY / 5, mouseX /5, sizeX + 100, sizeY - 100);
    rect(mouseX, mouseY, sizeY, sizeX);
    rect(mouseX - 150, mouseY - 130, sizeX - 30, sizeY - 30);



    pop();

    //constraining size of the ellipses
    var m = max(min(mouseX, 640), 0);
    var size = m * 350.0 / 640.0;

    //ellipse 1
    fill(r + mouseX / 2, g + mouseX / 2, b + mouseX / 2);
    ellipse(width / 2, height / 2, size, size);

    //ellipse 2
    fill(r + mouseX / 2, g + mouseX / 2, b + mouseX);
    ellipse(width / 2, height / 2, size * 0.9 , size * 0.9);

    //ellipse 3
    fill(r + mouseX, g + mouseX / 2, b + mouseX / 2);
    ellipse(width / 2, height / 2, size * 0.7 , size * 0.7);

    //ellipse 4
    fill(r + mouseX / 2, g + mouseX, b + mouseX / 2);
    ellipse(width / 2, height / 2, size * 0.5 , size * 0.5);


    angle = angle + 0.5;
    sizeX = width - (0.5 * mouseX);
    sizeY = height - (0.5 * mouseY);
}

I was inspired to create this dynamic drawing by the animations that show music beats. I tried to convey a bright, energetic atmosphere by using different variations of colors and undulating shapes.