Alessandra Fleck – Project 06 Clock

sketch

//Name: Alessandra Fleck 
//Class Section : B
//Email: afleck@andrew.cmu.edu
//Project-06


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

function draw() {
    background(255);

    //set for for hour,minutes and seconds
    var h = hour(); 
    var m = minute();
    var s = second();

    //blue waves going down
    for (var i = 0; i < (s*10); i ++) { //increments at x10 the distance
        stroke(179,223,222);
        strokeWeight(0.3);
        line(i*4, 0, width, i); 
        line(i*2, 0, height * 2, i); 
        line(i*4, 0, height * 4, i); 
        line(i*2, 0, height * 0.75, i + 20); 
        line(i*4, 0, height * 0.6, i + 20); 
        line(i*2, 0, height * 0.5, i + 100); 
    }

    //brown waves going down
    for (var i = 0; i < (s*20); i +=5) { //increments at x20 the distance
        stroke(255);
        strokeWeight(0.5);
        line(i*2, 0, width, i); 
        line(i*2, 0, height * 2, i); 
        line(i*2, 0, height * 4, i); 
        line(i*2, 0, height * 0.75, i + 200); 
        line(i*2, 0, height * 0.6, i + 200); 
        line(i*2, 0, height * 0.5, i + 600); 
    }

    //black waves going down for the minutes
    for (var i = 0; i < m; i +=5) { //strings will slowly branch out black for every minute
        stroke(0);
        strokeWeight(0.3);
        line(i*2, 0, width, i); 
        line(i*2, 0, height * 2, i); 
        line(i*2, 0, height * 4, i); 
        line(i*2, 0, height * 0.75, i + 200); 
        line(i*2, 0, height * 0.6, i + 200); 
        line(i*2, 0, height * 0.5, i + 600); 
    }

    //white circle_01
    fill(100,10+(s*50),255);
    noStroke();
    ellipse(50,s*10,30,30);

    //white circle_01_hour
    fill(255);
    stroke(0);
    strokeWeight(1);
    ellipse(50,h*10,30,30);

    




}

For this project I wanted the abstraction of the clock to be something that is completed as time passes. Instead of the long skinny arms of a clock being the seconds passing, I instead made them the minute hands and had the seconds move down in a parametric curve to create a wave in the background.

The sketch above shows a bit of the process in the form of the clock.

Leave a Reply