Claire Lee – Project 06 – Abstract Clock

project06

var starX = [];
var starY = [];
// star position arrays

function setup() {
    createCanvas(600, 600);
    for (i = 0; i < 100; i++) {
        starX[i] = random(width);
        starY[i] = random(height);
    } // randomizing star x and y positions
}

function draw() {
    background(0, 0, 10);

    noStroke();
    fill(255, 210, 10); 
    ellipse(300, 300, 50, 50);
    //sun

    stroke(200);
    strokeWeight(1.5);
    noFill();
    ellipse(300, 300, 500, 500);
    // outer orbit

    stroke(200);
    strokeWeight(1);
    noFill();
    ellipse(300, 300, 350, 350);
    // middle orbit

    stroke(200);
    strokeWeight(0.5);
    noFill();
    ellipse(300, 300, 250, 250);
    // inner orbit

    var S = second();
    var M = minute();
    var H = hour();
    var mappedS = map(S, 0, 59, 0, 354);
    var mappedM = map(M, 0, 59, 0, 354);
    var mappedH = map(H, 0,23, 0, 354);
    // time variables

    push();
    //stars
    for (i = 0; i < 100; i++) {
        noStroke();
        fill(255, 255, 255, 75);
        ellipse(starX[i], starY[i], 2, 2);
    } 
    translate(300, 300);
    // red planet
    rotate(radians(mappedH));
        noStroke();
        fill(230, 50, 15);
        ellipse(0, -250, 20, 20);
    // grey planet
    rotate(radians(mappedS));
        noStroke();
        fill(150);
        ellipse(0, -125, 10, 10); 
    pop();

    var moonX = 300 + -175 * (cos(radians(mappedM)));
    var moonY = 300 + -175 * (sin(radians(mappedM)));
    // circle math!
    push();
    translate(moonX, moonY);
        noStroke();
        fill(70, 210, 200);
        ellipse(0, 0, 25, 25);
        // blue planet

        stroke(200);
        strokeWeight(0.5);
        noFill();
        ellipse(0, 0, 60, 60);
        // moon orbit

        rotate(radians(mappedS));
        noStroke();
        fill(150);
        ellipse(0, -30, 10, 10);
        // moon
    pop();
}

This project was really interesting to do because I got to revisit and experiment with the translate() and rotate() functions. I also incorporated arrays into my piece, and was really satisfied with the result. One thing I learned that I don’t think I remember seeing before is the map() function, which I think made it a lot easier to convert measures of time into evenly-spaced coordinates without hard-coding in the math.

Leave a Reply