Nina Yoo Project-06-Abstract Clock

sketch

/* Nina Lee Yoo
Section E
nyoo@andrew.cmu.edu
Project-06-Abstract Clock*/

var prevSec;
var millisRolloverTime;
var change = 10

//--------------------------
function setup() {
    createCanvas(300, 300);
    millisRolloverTime = 0;
}

//--------------------------
function draw() {
    background(255,200,200); // My favorite pink
    
    // Fetch the current time
    var H = hour();
    var M = minute();
    var S = second();
    
    // Reckon the current millisecond, 
    // particularly if the second has rolled over.
    // Note that this is more correct than using millis()%1000;
    if (prevSec != S) {
        millisRolloverTime = millis();
    }
    prevSec = S;
    var mils = floor(millis() - millisRolloverTime);
    
    
    var hourBarWidth   = map(H, 0, 23, 0, width);
    var minuteBarWidth = map(M, 0, 59, 0, width);
    var secondBarWidth = map(S, 0, 59, 0, 178);

   

    // the sun is radiating
        noStroke()
        fill(255,205,109)
        ellipse(0,0,mils,mils)

     //sun grows at every hour
      noStroke()
        fill(237,242,109)
        ellipse(0,0,hourBarWidth,hourBarWidth)

        
	 //for the puddle growing every minute
        noStroke();
		fill(108,158,234);
        ellipse(150,200,minuteBarWidth,20);
    

     //for raindrop falling at a rate of a second
        noStroke();
        fill(255);
        triangle(140,secondBarWidth-5,160,secondBarWidth-5,150,secondBarWidth-20);
        fill(255);
        ellipse(150,secondBarWidth,22,22);








    


}



    /*noStroke();
    fill(40);
    ellipse(0, 100, hourBarWidth, 50);
    fill(80);
    ellipse(0, 150, minuteBarWidth, 50);
    fill(120)
    ellipse(0, 200, secondBarWidthChunky, 50);
    fill(160)
    ellipse(0, 250, secondBarWidthSmooth, 50);*/

I wanted to make a raindrop to fall into a puddle because rain is something that has a rythm to it so it reminded me of time. From there on I just added more elements to it pertaining to weather by making the puddles minutes, the drops seconds, the sun the hour, and the radiating part of the sun milliseconds. It was fun doing this project and playing around with the limits in order to create different images.