project- 06 – clock

sketch

var circlecenter = 0;

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


function draw() {

    // variables for time, hour, minute, second
    var h = hour();
    var m = minute();
    var s = second();

    // variables for color mapping
    var colorR = map(h, 0, 23, 0, 255);
    var colorG = map(m, 0, 59, 0, 255);
    var colorB = map(s, 0, 59, 0, 255);
    // variables for lighter color mapping
    var lightcolorR = map(h, 0,23, 180, 255);
    var lightcolorG = map (m, 0, 59, 180, 255);
    var lightcolorB = map (s, 0, 59, 180, 255);

    // time keeping seconds
    var exactSecond = (h*60)+(m*60)+s;



    // background to change color as day progresses
    background(colorR, colorG, colorB);

    // interlapping pattern of circles that change color with the time
    for (var y = 0; y < height+50; y += width/2) {
        for (var x = 0; x < width+50; x += width/3) {
            fill(255-colorG,255-colorB, 255-colorR,30);
            ellipse(x, y, width/2, width/2);
            noStroke();
        }
    }

    // tiny little dots
    for (var y = 0; y < height+10; y += 2) {
        for (var x = 0; x < width+50; x += 2) {
            fill(lightcolorR,lightcolorG,lightcolorB);
            ellipse(x, y, 1, 1);
            noStroke();
        }
    }

    // mapping for exact second along the x axis 
    var secondMapX = (exactSecond, 0, 86400, 0, width);
    // mapping for exact second  along the y axis 
    var secondMapY = (exactSecond, 0, 86400, 0, height);

    // circle for current second
    ellipse(secondMapX,secondMapY,2,2);
    fill(255, 255, 255);

}

I wanted to create a clock that emphasized how time is a fluid progression of movement, difficult to conceptualize at times. I decided to do this through a slow gradient of color, that shifts with the time. I wanted to create something that would emphasis both the fluidity of time, as well as how it can be broken into the tiniest of chucks. I did this through overlaying the smallest of dots on top of the work.

Ideally, I would like to make a clock that was rooted to the moon cycles of Lithuania, where my family is from. I think it would be interesting to show how our ancestry, what we adopt from those before us roots us especially in the way it affects our unconscious and when we sleep. I had some trouble figuring out how to embed API data into processing, but I would love to learn this sometime.