Alessandra Fleck – Project 03 – Dynamic Drawing

sketch

//Name: Alessandra Fleck 
//Class Section : B
//Email: afleck@andrew.cmu.edu
//Project-03

var angle = 0;

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

    // set background to night color
    background(28, 41, 74);
    noStroke();

    //change background color
    if (mouseX < (width / 2)) {
        background (148, 236, 223); //change background to day when mouse is in left of halway
    }

    //Create the Sun and Moon
    //Moon
    fill(215, 215, 215);
    var m = max(min(mouseX, 400), 0);
    var size = m * 200 /400;
    ellipse(450 + m * 190.0 / 480, 100.0, size, size);

    //Sun
    fill(214, 212, 161);
    size = 100 - size;
    ellipse(200 + m * 190.0 / 480, 200.0, size + 10, size);


    //rolling hill-01 (left)
    push();
    translate (100,600);
    rotate(radians(angle));
    fill(115, 99,87);
    ellipse(-200,150,500,500);
    pop();

    //rolling hill-02 (right)
    push();
    translate (100,600);
    rotate(radians(-angle));
    fill(115, 99,87);
    ellipse(200,50,500,500);
    pop();

    fill(51,41,32); // dark back hill
    ellipse(0, 500, 750, 800);

    //First Tree left
    fill(95, 150, 124);
    rect(opp -50, 40, 20, 400);

    //Hill in the far back
    fill(80,66,56);
    var m = max(min(width - mouseX, 800), 400);
    var size = m * 100 / 450;
    ellipse(100 + m * 100 / 480, 400, size + 400, 300);

    //Hill on the right that moves against cursor
    fill(115, 99,87);
    var m = max(min(width - mouseX, 800), 400);
    var size = m * 100 / 450;
    ellipse(500 + m * 100 / 480, 400, size + 300, 200);
    

    //Solid to cover the hills

    fill(176, 169, 138);
    rect(0, 400, 700, 100);
    fill(176, 169, 138); // solid hill on left (brown)
    ellipse(0, 400, 700, 100);
    fill(115, 99,87); // solid hill on left (brown)
    ellipse(0, 400, 650, 80);
    
    fill(150,125,107); // solid hill on right (brown)
    ellipse(400, 450, 650, 90);

    
    //Bushes
    var opp = width - mouseX; 
 
    fill(87, 129, 59); // bush front
    ellipse(mouseX-500, 350, 800, 60);

    fill(73, 83, 65); //ground floor
    ellipse(mouseX - 300,380,600,80);

    fill(107, 147, 88); // bush behind
    ellipse(mouseX-400, 400, 800, 80);
    

    angle = angle + 3;
 
    //Tree_01
    fill(42, 22, 33); //tree trunk
    rect(opp, 200, 40, 400);
    fill(18, 70, 43); //tree top
    ellipse(opp,200,250,200);
    ellipse(opp,300,350,200);

    //Tree_02
    fill(83, 71, 65); //medium tree trunk
    rect(opp + 95, 100, 30, 400);
    

    //Tree_03
    fill(42,22,33);
    rect(opp + 50, 50, 30, 400);
    fill(100, 120, 69); //tree top-02
    ellipse(opp+100,100,150,200);

    //Tree_04
    fill(98, 66, 36);
    rect(opp -50, 40, 20, 400);
    fill(87, 129, 59); //tree top
    ellipse(opp - 80,100,100,100);
    fill(100, 120, 69); //tree top-02
    ellipse(opp,200,150,200);

    fill(107, 147, 88); //tree top-light
    ellipse(opp,150,100,100);

    fill(77, 83, 65); //tree top
    ellipse(opp+100,200,150,200);

    fill(107, 147, 88); //tree top-light
    ellipse(opp - 60,300,100,100);

    fill(107, 147, 88); //tree top-light
    ellipse(opp + 150,250,80,60);

    fill(96, 166, 104); //ground floor
    ellipse(opp - 60,480,500,100);
    

}

For this project I wanted to use the simple movements we learned with rotation and translation of objects and use ellipses to make rolling hills and scenery. The inspiration for this project came from me working on it indoors and wanting to go outside.