sunmink-project06-Abstract Clock

sketch

//SunMin Kim 
//Section E
//sunmink@andrew.cmu.edu
//Project 06 

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

function draw() {
    //show the current time 
    var h = hour(); 
    var m = minute(); 
    var s = second(); 
    
    //color of the ocean changes depending on hours 
    var mapH = map(h, 0, 25, 0, 255);
    background(mapH, 220, 250); 

    noStroke();
    //tail 
    fill(230, 150, 70);
    rect(365, 270, 80, 100, 40, 20, 20, 40);
    //body
    fill(230, 150, 70);
    rect(50, 230, 320, 180, 20, 20, 20, 20);
    //eyes 
    fill(255); 
    ellipse(120, 300, 50, 50);
    //pupill
    fill(0);
    ellipse(122, 292, 30, 30);
    //bubble1
    fill(255);
    ellipse(110, 50, 20, 20);
    //bubble2
    fill(255);
    ellipse(105, 160, 20, 20);
    //bubble3
    fill(255);
    ellipse(130, 110, 20, 20);


    //changes form 24 hour to 12 hour clock 
    if (h == 0){ 
        h = 12; 
    } else if (h > 12 & h < 24){ 
        h -=12; 
    } else{ 
        h = hour(); 
    }
   
    //draw hair every second 
    for (var c = 0; c <= s; c++){
        strokeWeight (2.5); 
        stroke(255); 
        line(80 + 6 * c, 190, 63 + 5 * c, 230);
    }

    //size of mouth gets larger depending on the minutes
    var mapM = map(m, 0, 100, 0, width); 
    noStroke(); 
    fill(230, 80, 100);
    rect(50, 350, mapM, 50, 5, 5, 5, 10);
  
    fill(0);
    textSize(8);
    text( h + " hour(s) " + m + " minute(s) " + s + " second(s) ", 20,20);
}

    

After finishing assignments using index variables, I was excited to create an abstract clock that transforms according to hours, minutes, and seconds. Thus for the abstract clock, I wanted to take benefit of making a clock that is interesting to watch more than few seconds.  Throughout this project, I struggled the most when coming up with triangle coordinates. I feel good with the outcome that I successfully used triangles for this wallpaper which was the most challenging part during the project.

Throughout this project, I struggled the most to come up with types of design that allows me to indirectly display the time flow. However, I felt great to successfully use different parts in the fish to represent the time flow.