Raymond Pai-Project 06 – Abstract Clock

sketch

///RAYMOND PAI
///SECTION D
///RPAI@ANDREW.CMU.EDU
///PROJECT 06

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

}

function draw() {
    strokeWeight(0);
    background(255);

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

    //diameter variables
    var sd = 200;
    var md = 400;
    var hd = 550;

    //angles of arcs
    c = 2 * PI;
    var sa = s * c;
    var ma = m * c;
    var ha = h * c;

    //seconds
    angleMode(DEGREES);
    noFill();
    stroke(255, 0, 0);
    strokeWeight(50);
    arc(width/2, height/2, sd, sd, 0, sa);

    //minutes
    angleMode(DEGREES);
    noFill();
    stroke(0, 255, 0);
    strokeWeight(50);
    arc(width/2, height/2, md, md, 0, ma);

    //hours
    angleMode(DEGREES);
    noFill();
    stroke(0, 0, 255);
    strokeWeight(49);
    arc(width/2, height/2, hd, hd, 0, ha);
}

Inspired by Apple Watch rings:

Image result for apple watch rings

Each ring represents a different aspect of time. Red is seconds, Green is minutes, and blue is hours.

Leave a Reply