Claire Lee – Project 03 – Dynamic Drawing

project – 03 – seoyounl

var canvasW = 480
var canvasH = 640

function setup() {
    createCanvas(canvasW, canvasH);

}

function draw() {
    var drinkY = 300;
    var drinkH = 200;
    var drinkOpacity = 200 - (mouseY / 8);

    background(100 + (mouseX / 10), 150 + (mouseX / 10), 255);
    // background color changes with mouseX
    
    noStroke();
    fill(255, 200, 200);
    ellipse(canvasW / 2, 240, 300, 300);

    noStroke();
    fill(0);
    ellipse(180, 160, 15, 15);

    noStroke();
    fill(0);
    ellipse(300, 160, 15, 15);

    noStroke();
    fill(0);
    rect(235, 190, 10, 305);

    stroke(0);
    strokeWeight(4);
    line(210, 190, 270, 190);



    noStroke();
    fill(240, 130, 30, drinkOpacity);
    rect(170, drinkY + (mouseY / 4), 140, drinkH - (mouseY / 10));
    // drink height and opacity changes with mouseY
  
    noStroke();
    fill(60); 
    rect(0, 500, canvasW, canvasH - 500); 

    stroke(255);
    strokeWeight(4);
    noFill();
    rect(170, 250, 140, 250); 

    push();
    translate(0, (mouseY / 4.3));  
    rectMode(CENTER);
    noStroke();
    fill(255, 255, 255, 100);
    rect(200, 292, 50 - (mouseY / 100), 50 - (mouseY / 100), 5);
    pop(); 

    push();
    translate(0, (mouseY / 5)); 
    rectMode(CENTER);
    noStroke();
    fill(255, 255, 255, 100);
    rect(250, 320, 50 - (mouseY / 100), 50 - (mouseY / 100), 5);
    pop();

    push();
    translate(0, (mouseY / 4.3)); 
    rectMode(CENTER);
    noStroke();
    fill(255, 255, 255, 100);
    rect(280, 292, 50 - (mouseY / 100), 50 - (mouseY / 100), 5);
    pop();
    // ice cubes change size and position





}

This project was a really interesting way to experiment with changing shapes, colors, opacity, size, and position in a piece. I really enjoyed learning some new functions, and some other things I wish I could’ve implemented are rotations (in the ice cubes) and some more complex figures.