Judy Li-Project-03-Dynamic-Drawing

judyli:Face Project 03

/*
Judy Li
Section A
judyli@andrew.cmu.edu
Project-03
*/

var angle = 0;
var x = 1;

function setup() {
    createCanvas(640, 480);
    x = random(1,5);
}

function draw() {
    background(0,0,0);
    //otherobjects
    fill(255,255,102);
    noStroke();
    var m = max(min(mouseX, 640), 0);
    var size = m * 200.0 / 640.0;
    //foreground
    if (mouseX < width/2) {
        background(153,204,255);
        ellipse(175, 200.0, 200, 200);
    }
    else background(0,76,153);
    fill(224,224,200);
    ellipse(350 + m * 120.0/640.0, 200.0, size, size);
    if (mouseX < width/2) {
        noFill();
    }
    else fill (255,255,155);
    push();
    translate(100, 50);
    scale(x/.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(250, 100);
    scale(x/2);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(400, 150);
    scale(x);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(550, 200);
    scale(x/3);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(100, 150);
    scale(x/1.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(250, 200);
    scale(x/.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(400, 250);
    scale(x/2);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(550, 300);
    scale(x);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(100, 250);
    scale(x/3);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(250, 300);
    scale(x/1.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(400, 350);
    scale(x/.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    push();
    translate(550, 400);
    scale(x/2.5);
    rotate(radians(angle));
    triangle(10, 7.5, 2.5, 20, 17.5, 20);
    triangle(10, 25, 2.5, 12.5, 17.5, 12.5);
    pop();
    angle = angle + 5;
}

I didn’t know where to begin with this project because there’s so much you can do. I liked the idea of day transitioning into night. So, I played with background and the foreground to create this. I wanted it to be a bit more playful and when you refresh the page, the sizes of the stars change with it!