Month: October 2017

sketch

//Jonathan Perez
//Section B
//jdperez@andrew.cmu.edu
//Project-6



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

function draw() {
    var y1 =-50
    var y2 = -200
    var dy1 = random(-1, 1);
    var dy2 = random(-1, 1);
    var irisColor = 0 //lower bound on random greyscale for second hand
    var irisColor2 = 10 //upper bound on random greyscale for second hand
    var irisFill; // iris coloring
    var brightCap; // max greyscale value iris color can be

    //iris darkness caps
    if(hour() >= 0 & hour() < 7) { //almost black at night-time
        brightCap = 100
    } else if(hour() >= 7 && hour() < 8) { //light grey during sunrise
        brightCap = 200
    } else if(hour() >= 8 && hour() < 19) { //light grey to white during the day
        brightCap = 300
    } else if (hour() >= 19 && hour() < 20) { //same as sunrise
        brightCap = 200
    } else { //same as night-time
        brightCap = 100
    }

    push();
    translate(width/2, height/2);


    push();
    rotate(minute() * TWO_PI/60);
    stroke(0);
    strokeWeight(1);
    line(0, 0, 0, -height); //minute hands
    pop();

    //pupil detail
    push();
    if(hour() <= 12) {
        rotate(hour() * TWO_PI/12);
    } else {
        rotate(hour() * TWO_PI/12 + TWO_PI/24); //offsets to continue creating more vertices
    } 
    stroke(0);
    fill(0);
    rect(-30, -30, 60, 60); //stacked squares to create a star-pupil shape
    pop();


    //iris detail
    push();
    rotate(millis() * TWO_PI/60000);
    for(i = 0; i < 80; i++) {
    if(irisColor2 < brightCap) { 
        irisColor += 3.5
        irisColor2 += 3.5
    }
    irisFill = random(irisColor, irisColor2);
    strokeWeight(2);
    fill(irisFill);
    point(0, y1); //inner detail
    point(0, y2); //outer detail
    if(y1 + dy1 < -120) {
        dy1 = random(1.5); //max range is 120
    } else if(y1 + dy1 > 0) {
        dy1 = random(-1.5);
    }
    if(y2 + dy2 < -200) { //max range is 200
        dy2 = random(1.5);
    } else if(y2 + dy2 > -100) {
        dy2 = random(-1.5);
    }
    y2 += dy2;
    y1 += dy1


    }

    pop();
}

For this project, I wanted to mimic the circular shape of the traditional clock in something organic. Incidentally, while playing around with some random behavior, I stumbled across the human eye as inspiration.

This project feels pretty incomplete, and I would like to implement some changes relating color to time. For instance, perhaps the color of the iris could mimic the color of the sunset or something.

nayeonk1

//Na-yeon Kim
//15-104, B section
//nayeonk1@andrew.cmu.edu
//Project-06 (Abstract clock)


var x = [];
var y = [];

function setup() {
    createCanvas(400, 480);
    frameRate(15);
    angleMode(DEGREES);
}

function draw() {
    background(20, 40, 60);
    noStroke();

//variables for times
    var H = hour();
    var M = minute();
    var S = second();

    var mappedH = map(H, 0, 23, 120, 300);
    var mappedS = map(S, 0, 59, 0, 30);

//small stars
    fill(250);
    for (var i = 0; i < x.length; i++) {
        var ex = x[i];
        var ey = y[i];
        ellipse(ex, ey, 5, 5);
    }

//wall
    fill(80, 65, 30)
    rect(0, 350, width, 130)

//moon
    fill(250, 255, 90)
    ellipse(120, 80, 100, 100);

//moon eclipse by hours
    fill(10, 30, 50);
    ellipse(mappedH, 80, 100, 100)

//star
    fill(230, 230, 30);
    var a = [250, 260, 280, 270, 270, 250, 230, 230, 217, 240];
    var b = [138, 157, 163, 180, 202, 193, 202, 180, 163, 157];
    var nPoints = a.length;

    beginShape();
    for (var i = 0; i < nPoints; i++) {
        var px = a[i] + random(-1, 1);
        var py = b[i] + random(-1, 1);
        //star goes down by minutes
        vertex(px, py + M);
    }
    endShape(CLOSE);

//window
    push();
    strokeWeight(50);
    stroke(0, 115, 130);
    noFill();
    rect(0, -25, width, 350)
    pop();

//table
    fill(80, 28, 10);
    arc(370, 440, 400, 150, 0, 180, CHORD);
    fill(150, 78, 60);
    ellipse(370, 440, 400, 100);

//ashtray shadow
    push();
    rotate(5);
    translate(300, 420)
    fill(80, 28, 10);
    ellipse(0, 0, 130, 50)
    pop();

//ashtray
    fill(80, 100, 100)
    arc(250, 430, 100, 30, 0, 180, CHORD)
    rect(200, 410, 100, 20)
    fill(100, 120, 120);
    ellipse(250, 410, 100, 20)
    fill(50, 60, 60);
    ellipse(250, 410, 80, 10)

//cigarretts
    push();
    rotate(20);
    translate(310, 300)
    fill(230, 230, 230);
    rect(0, 0, 50, 10);
    fill(200, 200, 50);
    rect(30, 0, 20, 10);

//cigarrett smoked by seconds
    fill(0);
    rect(0, 0, mappedS, 10)
    fill(250, 20, 20);
    rect(mappedS, 0, 2, 10);
    pop();

//smokes come up by seconds
    fill(250, 250 - 7 * S);
    ellipse(170, 370 - S, mappedS + 10, mappedS + 15)
    ellipse(190, 390 - S * 1.5, mappedS + 15, mappedS + 10)
    ellipse(180, 375 - S, mappedS, mappedS)
    ellipse(200, 380 - S * 3, mappedS + 10, mappedS)
    ellipse(200, 385 - S * 2, mappedS + 10, mappedS + 10)
    ellipse(190, 383 - S * 3.5, mappedS + 30, mappedS + 30)

//flower pot
    fill(120, 50, 10)
    quad(50, 250, 150, 250, 130, 300, 70, 300)
    rect(45, 230, 110, 30)

//flower patel shows up every 5 min
    push();
    fill(230, 100, 100)
    translate(100, 180)
    var i = (M - (M % 10))/5;
    for (var f = 0; f < i + 1; f++) {
      ellipse(0, -20, 10, 30);
      rotate(30);
    }
    pop();

//hours text
    fill(240);
    text("hour : " + H, 30, 400);
    text("Minute : " + M, 30, 420);
    text("Second : " + S, 30, 440);
}

//small stars show up when click
function mousePressed() {
  x.push(mouseX);
  y.push(mouseY);
}

My favorite time of the day is smoking at very late night while watching stars and moon. During the day, it’s too busy to feel the time. But night, every smokes from cigarett tells me of every moment of time.