Shariq M. Shah – Project 06 – Abstract Clock

shariqs-06-project




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

}

function draw() {

    background(0);

    // get the current time
    var H = hour();
    var M = minute();
    var S = second();

    // map times to canvas proportions
    var mappedH = map(H, 0,23, 0,width);
    var mappedM = map(M, 0,59, 0,width);
    var mappedS = map(S, 0,59, 0,width);
    var timeArray = [mappedH, mappedM, mappedS]

    var x = width / 2 - 20;

    push();

    translate(width / 2, height / 2);

    noFill();


  for(s = 0; s < 60; s++) {

    strokeWeight(0.1);

    stroke(0 + mappedS, 300, 20);

    ellipse(0, 0, mappedS, x);

    rotate(radians(s * 0.2));

  }


    for(m = 0; m < M; m++) {

    strokeWeight(0.1);

    stroke(0 + mappedM, 60, 20);

    ellipse(0, 0, mappedM, x);

    rotate(radians(m * 0.2));

  }

    for(h = 0; h < H; h++) {

    strokeWeight(0.1);

    stroke(200, 60, 20);

    ellipse(h, 0, mappedH, x);

    rotate(radians(H * 0.1))


  }

    pop();


    text(H, (width / 2 )- 6, height / 2);
    fill(300);

    text(M, (width / 2) - 6, height / 2 + 15);
    fill(300);

    text(S, (width / 2) - 6, height / 2 + 30);

    fill(300);



}

In this project, I explored the practices of timekeeping in relation to abstract line geometries that rotated and overlapped based on the corresponding time. Different colors represent the different time increments, and complex geometries emerge as a result of the time keeping computation. These processes result in a clock that is dynamic and presents interesting and complex geometries as a result of time.

Leave a Reply