Category: Uncategorized

Andrej Bauer’s random art generator

Andrej Bauer’s random art generator

Alexia Forsyth

Bauer’s random art generator utilizes pseudo-random numbers to construct a mathematical formula. This formula is responsible for each pixel color and sequence of random choices. I really admire the semi formed appearance of Bauer’s pieces. Though random, his series have a particular look and create distinct, colorful visuals. His generator is able to transform into completely new and unique pieces with one word change in the program. I appreciate the versatility. For example, this particular piece, can be interpreted in many different ways; for me, it looks like a stingray.The artist uses an acyclic directed graph coded in the python coding language and implemented in ocaml.

Link: https://www.random-art.org/about/

LO-06 Randomness

Random generation in music/synthesis has always confused me a bit, because part of the point of music (at least, what Western music theory says), is that music wants to fit into a pattern that is pleasing for the human ear, and that’s how tunes get stuck in our head and how we end up attached to a certain song. Randomness doesn’t often lean in the acoustically pleasing direction, because our ears are so attuned to patterns and tones. Even someone with little musical training or ability can guess if a note is incorrect, and will often have a visceral reaction to a wrong note played in a familiar melody. I was intrigued by this tutorial because it showed how to use randomness along with other elements within the Ableton software (confining notes to a certain scale, randomizing the note value within a number of choices, etc) to create something that, however randomly generated, still sounds pleasing to our ear.

P-06 Abstract Clock

sketch
// Bridget Doherty
// bpdohert@andrew.cmu.edu 
// 104 Section C


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

function draw() {
    background(0); // black background
    translate(width/2, height/2); // center-based coordinates

    let s = second();
    let m = minute();
    let h = hour();

    drawStars(h);
    drawEarth(s);
    drawSun(h);
    
}

function drawSun(h){
    if (h == 0) { // eclipse every night from 00:00 - 00:59
        fill('black');
        strokeWeight(2);
        stroke('white');
        circle(0, 0, 100);
    } else {
        fill('yellow'); // the sun!
        noStroke();
        circle(0, 0, 100);
    }
}

function drawEarth(s){ // the earth completes a rotation every minute
    noStroke(); // and moves every second
    push();
    rotate(s*6);
    fill('blue');
    circle(150, 0, 70);

    // triangles to approximate land on earth 
    fill('green');
    triangle(170, 0, 120, 0, 150, 20);
    triangle(170, 10, 130, 10, 120, 20);
    triangle(175, -10, 130, -20, 120, 10);

    // ellipse to approximate Antarctica
    fill(220);
    ellipse(150, -30, 30, 10);
    pop();
}

function drawStars(h){ // the amount of stars increases every hour
    for (var i = 0; i<(h*10); i++){ // there are no stars between 00:00 and 00:59
        stroke('white');
        point(random(-width/2,width/2), random(-width/2, width/2));
    }
}

This is obviously based on Earth’s rotation around the sun, but condensed so it makes one revolution every minute. The number of stars increase with every hour passed. Every night from 00:00-00:59 there is a solar eclipse which is so naturally impossible with how I’ve set up the scene but looks cool nonetheless.

Project 06- Abstract Clock

Graham Murtha

Section A

For this project, I wanted to document time with an apple tree/ deciduous tree. As the minute passes, the leaves change color from green to red, and at the end of each minute wilt off and blow away. As the hour passes, the ground that the tree is on grows more and more red as the leaves/apples fall to the ground. As the day passes, the background color (sky) gets darker and darker, until the last hour of the day, where it goes totally black. There is also a person under the tree trying to collect the falling foliage/apples.

sketch
// Graham Murtha
//Section A
//gmurtha@andrew.cmu.edu
//Project 06 Abstract Clock


// IF YOU STICK AROUND FOR A BIT THE LEAVES WILL WILT AND BLOW AWAY!!

var y = 0
function setup() {
    createCanvas(420, 480);
    background(200,200,255);
    text("p5.js vers 0.9.0 test.", 10, 15);
    angleMode(DEGREES);
}

function draw() {

    //background color of sky// CHANGES THROUGHOUT THE DAY- DARKEST AT THE 24TH HOUR
    var h = hour()
    var sky = map(h,0,24,255,0)
    background(50,100,sky);

    // outline
    stroke(200)
    noFill();
    strokeWeight(.5);
    ellipse(width/2,height/2.75, 300);

    // Tree trunk
    noStroke();
    fill(100,60,0)
    rect((width/2)-10,height-100,20,-210)
    triangle(width/2,height-130,(width/2)-20,height-100,(width/2)+20,height-100)


    //GROUND COVER - CHANGES WITH EVERY HOUR- BECOMES MORE RED AS THE HOUR CONTINUES

    var m = minute()
    var g = map(m,0,60,0,255) // red for ground fill
   
    fill(g,255-g,0);
    rect(0,height-100,width,100);


//recentering origin to the middle of the tree circle
   translate(width/2,height/2.75);


//APPLE PICKER
    var s1 = second()
    var p = map(s1,0,60,-100,100) // changing position under the tree
    fill(10)
    rect(p,150,20,40);
    ellipse(p+10,140,20);
    strokeWeight(3);
    stroke(10);
    line(p+2,190,p,210)
    line(p+18,190,p+20,210)
    line(p,150,p-12,170)
    line(p+20,150,p+33,170);
   
    //basket
    strokeWeight(1);
    fill(255,255,140);
    rect(p-15,170,50,20);


// BRANCHES (STATIC)
    stroke(100,60,0);
    strokeWeight(6);
   

    line(0,0,150,0);
    line(100,0,150,-30);
    line(100,0,150,30);

    line(0,0,-150,0);
    line(-100,0,-150,-30);
    line(-100,0,-150,30);

    push(); //top left quad
    rotate(120);
    line(0,0,150,0);
    line(100,0,150,-30);
    line(100,0,150,30);
    pop();

   push(); // top right quad
   rotate(60);
   line(0,0,150,0);
     line(100,0,150,-30);
    line(100,0,150,30);
   pop();

   push(); // bottom right quad
    rotate(-60);
   line(0,0,150,0);
    line(100,0,150,-30);
    line(100,0,150,30);
   pop();

   push(); // bottom left quad
   rotate(240)
   line(0,0,150,0);
    line(100,0,150,-30);
    line(100,0,150,30);
   pop();



//APPLES

    var s = second()
    var rg = map(s,0,60,0,255) // changing color (red-green)
    var x = 150
    var r = .2 // fall rate

    for (var i= 0 ; i < 30 ; i++) {
        //base geometry for apples
        rotate(15); 
        x -= r*sin(15);
        noStroke();
        fill(rg,255-rg,0);
        ellipse(x,y,30,15);
        ellipse(x-50,y,15,10);
        
        // falling geometry for apples (wilting)
        if(s>50 & s<60){
            rotate(15);
            noStroke();
            fill(rg,255-rg,0);
            ellipse(x,y,30,15);
            ellipse(x-50,y,15,10);
            x -= r*sin(15);
            y+=r
          }
    }


}

Project 6 – Abstract Clock

Before we had clocks, we looked to the skies and celestial bodies above to tell time and orientation. For this project, I’ve plotted a night sky with 12 different constellations that appear as the day progresses, with meteor showers occuring every 5 minutes.

Basic Features:
– Stars that twinkle randomly
– Background color based on time of day (lightens as day progresses)
– 12 different constellations (accurate to Northern Hemisphere in August)
– Every hour a new constellation appears
– Meteor showers or ‘shooting stars’ that occur every 5 minutes to indicate the passing of 5 minutes

(Please note that in order to import the star data without using a csv (due to difficulties circumventing CORS policy) the first 495 lines of code are all star + constellation information.)

sketch
// Name: Tsz Wing Clover Chau
// Section: E 
// email: ctchau@andrew.cmu.edu
// Project-06



let data = [   //first constellation
            [[[-81.30973247,    45.89753673, "L"],   
              [-69.80657573,    27.25487531, "L"],
              [-83.5701992,     13.59553656, "L"],
              [-102.9353214,    33.81097102, "M"],
              [-81.30973247,    45.89753673, "L"]],
 
             [[-81.30973247,    45.89753673, "L"],
              [-83.21194136,    57.57386131, "M"],
              [-78.00737768,    70.19871847, "M"],
              [-65.52047168,    90.38733495, "M"]],
 
             [[-81.30973247,    45.89753673, "L"],
              [-79.00179591,    58.28543518, "S"],
              [-72.71622665,    66.82432172, "M"],
              [-56.23603836,    80.84899719, "M"]],
 
             [[-69.80657573,    27.25487531, "L"],
              [-63.09108408,    24.45143041, "M"],
              [-59.33124834,    12.51803871, "S"],
              [-53.67504909,    9.38172277 , "S"]],
 
             [[-69.80657573,    27.25487531, "L"],
              [-70.35891151,     20.90153254, "M"],
              [-70.22649991,     18.78294683, "S"],
              [-58.83910175,     0.068773112, "S"],
              [-51.8212866,     -0.549147718, "S"]],

             [[-83.5701992,     13.59553656, "L"],
              [-80.88006024,     5.718673925, "S"],
              [-80.74322899,     2.504256586, "M"],
              [-74.12860005,    -9.286504731, "M"],
              [-63.76642979,    -8.872286463, "M"]]],

             // second constellation
            [[[39.01312993,   70.78430398,   "L"],
              [47.35506114,   71.00498999,   "L"],
              [49.34123524,   60.19137546,   "L"],
              [43.77750399,   57.0099355 ,   "M"],
              [42.04897812,   50.0771234 ,   "L"],
              [40.28349003,   44.51583592,   "M"],
              [43.01999656,   36.48286513,   "M"]],
 
             [[43.77750399,   57.0099355 ,   "M"],
              [39.01312993,   70.78430398,   "L"],
              [33.53041101,   86.12662728,   "M"],
              [30.9148731 ,   97.89654786,   "M"],
              [41.18456465,   84.69474518,   "M"],
              [50.58589777,   91.84811645,   "M"],
              [51.67570523,   92.99241428,   "M"],
              [53.03796456,   104.6533541,   "S"],
              [55.49003134,   104.2719215,   "S"]],
                 
             [[85.42531527,   58.66254473,   "S"],
              [82.46534439,   59.53708159,   "M"],
              [58.44921701,   58.7298168 ,   "M"],
              [65.24369563,   67.20609705,   "M"],
              [71.43272565,   81.13141461,   "M"],
              [68.6072989 ,   83.14957657,   "S"]],
                 
             [[49.34123524,   60.19137546,   "L"],
              [58.44921701,   58.7298168 ,   "M"]],
                 
             [[41.18456465,   84.69474518,   "M"],
              [47.35506114,   71.00498999,   "L"]],
                 
             [[85.42531527,   58.66254473,   "S"],
              [82.46534439,   59.53708159,   "M"],
              [58.44921701,   58.7298168 ,   "M"],
              [65.24369563,   67.20609705,   "M"],
              [71.43272565,   81.13141461,   "M"],
              [68.6072989 ,   83.14957657,   "S"]]],
 
             // third constellation
            [[[1.458598798,   66.23616304,  "L"],
              [2.352193916,   60.74930789,  "S"],
              [4.368337719,   56.17211655,  "S"],
              [9.653903905,   52.95718454,  "S"],
              [16.19118114,   51.23449244,  "L"],
              [15.10294121,   47.50814724,  "M"],
              [8.564096444,   49.46980066,  "S"],
              [9.653903905,   52.95718454,  "S"]]],
            
             // fourth constellation
            [[[-6.590790179,   -83.80630313, "L"],
              [-0.615323792,   -77.31080679, "L"],
              [-5.71200542,    -76.35517899, "L"],
              [-8.064704903,   -69.53493942, "L"],
              [-13.86042784,   -71.60960823, "S"],
              [-17.56801424,   -70.75267342, "L"],
              [-21.50545029,   -72.71002812, "S"],
              [-20.14209587,   -76.22259689, "L"],
              [-6.590790179,   -83.80630313, "L"]],

             [[-13.86042784,   -71.60960823, "S"],
              [-20.14209587,   -76.22259689, "L"]],

             [[-5.71200542,    -76.35517899, "L"],
              [-6.590790179,   -83.80630313, "L"]],

             [[-5.71200542,    -76.35517899, "L"],
              [-6.590790179,   -83.80630313, "L"]],
             
             [[-8.064704903,   -69.53493942, "L"],
              [-3.082627727,   -63.36904156, "S"]],
 
             [[-17.56801424,   -70.75267342, "L"],
              [-20.38617647,   -63.6192995,  "S"],
              [-21.99497748,   -62.36800982, "S"],
              [-25.96335333,   -57.61310903, "S"]],
 
             [[-6.590790179,   -83.80630313, "L"],
              [-5.114574435,   -87.96959846, "M"]],
 
             [[-21.50545029,   -72.71002812, "S"],
              [-31.81704138,   -67.75307637, "S"],
              [-39.34651974,   -70.82585414, "S"],
              [-41.38721948,   -71.52954371, "S"],
              [-40.9202775,    -83.68265947, "S"],
              [-41.1347843,    -84.75519348, "S"],
              [-39.40063134,   -97.38439895, "S"],
              [-27.41782088,   -102.2813735, "S"],
              [-27.72946212,   -102.9794499, "S"]],
 
             
             [[-39.34651974,   -70.82585414, "S"],
              [-28.01323318,   -94.69202961, "S"]],
 
             [[-20.38617647,   -63.6192995,  "S"],
              [-18.02660164,   -62.86852569, "S"]]],
            
             //fifth constellation
            [[[51.68313157, -74.59487497,    "S"],
              [51.85688208, -71.58319946,    "S"],
              [49.91857688, -50.48883666,    "M"],
              [54.8517741 , -41.53970748,    "M"],
              [66.68054428, -49.44026667,    "M"],
              [64.1863709 , -65.64553098,    "M"]],

           
             [[49.91857688, -50.48883666,    "M"],
              [66.68054428, -49.44026667,    "M"]]],

              // sixth constellation
              [[[-28.25049035,    21.90763427, "L"],
              [-29.05237454 ,  -8.933976793, "M"],
              [-30.05337011,   -21.79845264, "L"],
              [-32.01340999 ,  -24.46854673, "S"],
              [-38.51780667 ,  -32.31873544, "S"],
              [-23.73184394 ,  -30.50911015, "S"],
              [-15.83268968,   -18.49868084, "M"],
              [-28.47445623,   -20.35135353, "M"],
              [-6.246178612,    7.80368656 , "L"],
              [-7.700470381,    9.046871459, "S"],
              [-28.25049035,    21.90763427, "L"]],
 
             [[-28.25049035,    21.90763427, "L"],
              [-27.20862688,    15.00847228, "L"],
              [-23.75429763,    7.316898561, "M"],
              [-19.5234676,    -1.520496344, "M"]],
 
 
             [[-42.86022433,    9.735155491, "M"],
              [-35.20115034,    10.69366795, "M"],
              [-27.20862688,    15.00847228, "L"],
              [-18.11568352,    17.26722891, "M"],
              [-13.08553401,    23.52012366, "M"],
              [-10.87867391,    24.49114211, "M"]],
 
             [[-15.83268968,   -18.49868084, "M"],
              [-14.51018108 ,  -17.07162404, "S"]],
 
             [[-23.73184394 ,  -30.50911015, "S"],
              [-19.20732445 ,  -40.8800735,  "S"],
              [-17.88320838 ,  -42.11591516, "S"]],
 
             [[-8.005402526,    6.677783255, "S"],
              [-10.13992754,    6.396307428, "S"],
              [-11.87569514,    1.963063164, "S"]]],

             //seventh constellation
            [[[60.54101784,   2.275816369, "L"],
              [48.47102481,    6.48703491 , "M"],
              [37.83395909,    9.664913466, "M"],
              [37.21603826,    18.80131432, "M"],
              [44.145579  ,    20.34611639, "M"],
              [49.35376885,    12.40142   , "S"],
              [60.54101784,    2.275816369, "L"]],

             [[49.35376885,   12.40142   , "S"],
              [49.08894564,    10.94489233, "S"]],

             [[56.89016285,   -7.804902645, "S"],
              [60.54101784,    2.275816369, "L"],
              [66.91639149,    4.836863903, "M"]]],

            //eigth constellation
            [[[61.03712532,   -23.51897245, "M"],
              [76.2399394 ,   -17.85197365, "M"],
              [87.20224289,   -16.41843998, "M"],
              [98.36940576,   -2.089490027, "M"],
              [108.4602156,   -5.991269825, "M"],
              [109.69881  ,   20.01815869 , "S"],
              [119.3328342,   23.67244373 , "S"]],
             
             [[65.55982628,  -32.94580699,  "M"],
              [75.53156455,  -30.43924983,  "M"],
              [98.62336421,  -31.35454998,  "L"],
              [108.4602156,  -5.991269825,  "M"],
              [116.0938088,   1.248421898,  "S"]],
             
             [[88.35446325,   6.729849457,  "M"],
              [98.36940576,  -2.089490027,  "M"]],

             [[76.2399394 ,   -17.85197365, "M"],
              [75.53156455,  -30.43924983,  "M"]],

             [[87.20224289,   -16.41843998, "M"],
              [98.62336421,  -31.35454998,  "L"]]],
            
            //ninth constellation
            [[[-27.97036149,    97.86651501, "S"],
              [-18.94048898,    94.12007854, "S"],
              [-9.09408544 ,    98.29879614, "S"],
              [-10.59327567,    108.0279711, "S"],
              [-16.74127398,    119.7956241, "S"]]],

            //tenth constellation
            [[[5.319571808 ,     15.27986704, "S"],
              [2.225986467 ,     5.831577348, "S"],
              [8.997290938 ,     6.071090008, "S"],
              [11.07069217 ,     5.894303006, "M"],
              [15.10868883 ,     0.099613614, "S"],
              [12.50228334 ,    -7.032641486, "M"],
              [8.481085936 ,    -5.839664643, "S"],
              [4.56767671  ,    -4.368466998, "M"],
              [2.171312707 ,    -2.838674937, "S"],
              [-0.355196297,    -3.244706657, "S"]],
                 
              [[2.171312707, -2.838674937,  "S"],
               [1.709621983, -1.653668745,  "S"]],
                
              [[26.18888289, 16.05781367 ,  "S"],
               [22.33741325, 17.38990091 ,  "S"],
               [19.76011401, 18.25865346 ,  "S"],
               [18.39717201, 13.36557494 ,  "S"],
               [17.32571053, 9.224521115 ,  "M"],
               [19.39550622, 1.749250539 ,  "M"],
               [24.48804677, -8.578746279,  "M"],
               [26.93450093, -10.89496905,  "M"],
               [27.19512669, -16.68665272,  "M"],
               [25.66033052, -20.2774966 ,  "M"]],
                
              [[12.50228334, -7.032641486,  "M"],
               [13.73443018, -18.42818892,  "S"],
               [24.48804677, -8.578746279,  "M"]],
                 
              [[15.10868883, 0.099613614,   "S"],
               [19.39550622, 1.749250539,   "M"]],
                   
              [[11.07069217, 5.894303006,   "M"],
               [17.32571053, 9.224521115,   "M"]]],

            // eleventh constellation
            [[[12.6209419,     -76.17543312, "M"],
              [14.31490933,    -68.88084874, "M"],
              [12.81336171,    -67.87981699, "M"],
              [14.8154252 ,    -63.08916507, "M"],
              [6.204943095,    -29.96074626, "M"],
              [8.275577271,    -20.3704406,  "L"],
              [19.03382074,    -23.72757948, "M"],
              [28.02080187,    -31.100746,   "M"],
              [34.45008626,    -37.57453788, "M"]],
 
             [[6.204943095,    -29.96074626, "M"],
              [5.314500086,    -32.52363291, "S"],
              [1.666573231,    -47.94643484, "M"]],   
 
             [[-14.81981548,   -29.73185186, "S"],
              [-4.719413958,   -39.09939645, "M"],
              [7.351003499,    -51.95056182, "S"],
              [8.924053384,    -55.20391499, "M"],
              [14.03646551,    -51.87905955, "S"],
              [17.70651702,    -55.28452075, "L"]],
 
             [[17.70651702,    -55.28452075, "L"],
              [28.15534601,    -47.71694618, "L"],
              [33.53711124,    -39.03884973, "M"],
              [34.45008626,    -37.57453788, "M"]],
           
 
             [[6.204943095,    -29.96074626, "M"],
              [1.144487844,    -32.23404872, "S"],
              [-0.129682563,   -32.90009235, "S"],
              [0.941778916,    -34.00051224, "S"]],
 
 
             [[19.03382074,    -23.72757948, "M"],
              [19.93153171,    -22.45340907, "S"]]], 
            
            // twelth constellation
            [[[-44.13070076,  -47.56894476, "S"],
              [-45.54745045,  -50.83836714, "M"],
              [-49.22571716,  -54.74951485, "S"],
              [-48.61759037,  -55.6182674 , "S"],
              [-57.2778691 ,  -66.24946712, "S"],
              [-60.10329585,  -68.26762909, "S"],
              [-65.55710623,  -64.4554043 , "S"],
              [-72.68365623,  -58.95743272, "S"],
              [-73.28305034,  -57.26823116, "S"],
              [-75.51715563,  -53.29043393, "S"],
              [-78.73208764,  -46.15219506, "M"],
              [-76.00756899,  -47.35098326, "S"],
              [-68.43340714,  -49.53059819, "S"],
              [-62.71191797,  -51.98266497, "S"],
              [-44.13070076,  -47.56894476, "S"]]],

            // single stars

            [[[104.9886578 ,     52.44117013 ,   "M"],
              [106.1322829 ,     32.59591081 ,   "M"],
              [113.6667542 ,     47.59758141 ,   "M"],
              [5.11024982  ,    -88.47011433 ,   "M"],
              [88.41769489 ,    -64.89519854 ,   "M"],
              [11.27889721 ,    -30.50408545 ,   "M"],
              [-3.37534974 ,     67.12602697 ,   "M"],
              [35.62895531 ,    -68.60804233 ,   "M"],
              [40.36506015 ,    -59.2406066  ,   "M"],
              [43.70513643 ,    -69.07280707 ,   "M"],
              [42.7175803  ,    -63.12573704 ,   "M"],
              [42.13375365 ,    -35.96420913 ,   "M"],
              [39.80992995 ,    -25.98964281 ,   "M"],
              [34.84245066 ,    -13.29661451 ,   "M"],
              [35.94287055 ,     -9.676812218,   "M"],
              [37.47766673 ,    -12.74640456 ,   "M"],
              [42.60330677 ,    -17.49558517 ,   "M"],
              [41.27916704 ,    -23.18270057 ,   "M"],
              [-19.04817726,    -88.46549279 ,   "S"],
              [-21.80293192,    -88.17308867 ,   "S"],
              [-22.75709275,    -89.55816084 ,   "S"],
              [-23.0636038 ,    -92.31056828 ,   "S"],
              [-22.43683664,    -94.61454593 ,   "S"],
              [-20.48514261,    -97.60750188 ,   "S"],
              [-15.55931565,   -100.4457165  ,   "S"],
              [-16.74127398,    119.7956241  ,   "S"],
              [-10.59327567,    108.0279711  ,   "S"],
              [-27.97036149,     97.86651501 ,   "S"],
              [-18.94048898,     94.12007854 ,   "S"],
              [-13.27280304,     86.72326807 ,   "S"],
              [-9.09408544 ,     98.29879614 ,   "S"],
              [-42.27589132,     -9.540592057,   "S"],
              [-41.9227937 ,    -11.52676616 ,   "S"],
              [-41.9227937 ,    -15.76393756 ,   "S"],
              [-43.79845795,     -8.625985361,   "S"],
              [-43.22467432,    -10.47974785 ,   "S"],
              [-13.72874433,     9.44562888  ,   "S"],
              [-14.54971549,     8.530832444 ,   "S"],
              [33.94988529 ,    13.19588964  ,   "S"],
              [69.46108546 ,    23.60510962  ,   "S"],
              [79.9786976  ,    12.72308656  ,   "S"],
              [78.64087004 ,    34.91748725  ,   "S"],
              [-47.60015863,   -30.24429763  ,   "S"],
              [-52.49938807,   -35.14352707  ,   "S"],
              [-57.26620591,   -18.76862507  ,   "S"],
              [-58.76687078,   -15.63488371  ,   "S"],
              [-54.57383658,   -12.85423997  ,   "S"],
              [-53.60281813,   -13.03078878  ,   "S"],
              [30.93918652 ,   -55.61717811  ,   "S"],
              [32.58373868 ,   -57.97675294  ,   "S"],
              [33.97803289 ,   -60.2648255   ,   "S"],
              [31.22519559 ,   -62.6959026   ,   "S"],
              [38.07330037 ,   -58.95429872  ,   "S"],
              [39.8021085  ,   -61.02328683  ,   "S"],
              [43.94435199 ,   -54.39176988  ,   "S"],
              [-8.005445306,   -105.0033915  ,   "S"],
              [-2.356766173,   -104.9318892  ,   "S"],
              [30.67780305 ,    -85.10779604 ,   "S"],
              [32.46048329 ,    -84.07571801 ,   "S"],
              [41.77341897 ,    -87.2819446  ,   "S"],
              [44.06113402 ,    -90.49632903 ,   "S"],
              [47.24656004 ,    -81.49026093 ,   "S"],
              [50.3451108  ,    -83.54630863 ,   "S"],
              [51.67719804 ,    -82.88026501 ,   "S"],
              [52.33248013 ,    -98.81150986 ,   "S"],
              [58.84812426 ,    -95.04691547 ,   "S"],
              [53.56322507 ,    -95.84327739 ,   "S"],
              [58.64277685 ,    -86.21382367 ,   "S"],
              [73.95741511 ,    -83.33540582 ,   "S"],
              [59.67565503 ,    -74.68175023 ,   "S"],
              [70.24547773 ,    -69.81673594 ,   "S"],
              [44.55936066 ,    -74.0157066  ,   "S"],
              [55.68343334 ,    -24.77410426 ,   "S"],
              [60.08082279 ,    -32.78235823 ,   "S"],
              [40.16744129 ,    -22.02126697 ,   "S"],
              [-28.65268571,    -34.7891396  ,   "S"],
              [-13.20466495,    -40.96834791 ,   "S"],
              [-9.497139968,    -45.60275414 ,   "S"],
              [-6.407535816,    -46.57377258 ,   "S"],
              [-7.96784617 ,    -54.24914286 ,   "S"],
              [-0.560136995,    -24.5197572  ,   "S"],
              [-10.68766986,    -14.29161588 ,   "S"],
              [-10.16641833,    -11.42473247 ,   "S"],
              [-4.606402005,    -10.72973043 ,   "S"],
              [-0.725973947,    -11.97494241 ,   "S"],
              [-25.80629245,    -24.41817625 ,   "S"],
              [-71.25040192,    -77.43958597 ,   "S"],
              [-64.2745821 ,    -77.98540056 ,   "S"],
              [-59.91294378,    -81.310256   ,   "S"],
              [-62.24452988,    -41.89702708 ,   "S"],
              [-71.38093073,    -34.2612911  ,   "S"],
              [69.51227912 ,      5.467669522,   "S"],
              [70.549062   ,      2.393072019,   "S"],
              [107.9486287 ,     57.55384711 ,   "S"],
              [80.51445449 ,     78.84416438 ,   "S"],
              [83.27260918 ,     86.91681224 ,   "S"],
              [83.47442537 ,     68.88789869 ,   "S"],
              [100.1578976 ,     62.90068486 ,   "S"],
              [64.64441402 ,    109.6664684  ,   "S"],
              [49.1146577  ,     98.60492271 ,   "S"],
              [11.49177673 ,     72.23870395 ,   "S"],
              [15.26641233 ,     54.31944387 ,   "S"],
              [-6.152714418,     52.61545832 ,   "S"],
              [-17.60771933,     30.85955337 ,   "S"],
              [-15.24825692,     22.06359599 ,   "S"],
              [-22.66330689,     22.15187039 ,   "S"],
              [-22.66330689,     20.65120552 ,   "S"],
              [-33.0796866 ,     19.01812904 ,   "S"],
              [-32.63831458,     22.68151682 ,   "S"],
              [-38.37615086,     19.76846147 ,   "S"],
              [-36.56652557,     17.91469898 ,   "S"],
              [-37.096172  ,     28.11039269 ,   "S"],
              [-36.21342795,     33.09789653 ,   "S"],
              [-41.37748061,     15.39887846 ,   "S"],
              [-38.50856246,     18.1795222  ,   "S"],
              [-26.84551443,    -11.1849741  ,   "S"],
              [-53.76052441,     21.78456178 ,   "S"],
              [-80.19844615,     27.63723148 ,   "S"],
              [-36.86304668,      7.09621255 ,   "S"],
              [-33.02311009,      4.756940835,   "S"],
              [-31.52244522,      6.390017315,   "S"],
              [-20.17918426,     -5.571164473,   "S"],
              [-17.48175884,     -9.226660678,   "S"],
              [-26.47267039,     -6.22969016 ,   "S"],
              [-24.87874372,    -11.90844128 ,   "S"],
              [-25.13676322,    -12.61213084 ,   "S"],
              [-50.85272315,     26.86216427 ,   "S"],
              [-48.56412749,     28.44238509 ,   "S"],
              [-54.06765516,     39.77638269 ,   "S"],
              [-48.67310823,     36.77941217 ,   "S"],
              [-48.45514674,     34.32734538 ,   "S"],
              [-43.71448429,     37.92371    ,   "S"],
              [-43.60550354,     35.85307583 ,   "S"],
              [-41.31690787,     40.70271903 ,   "S"],
              [-41.31690787,     38.46861373 ,   "S"],
              [-38.75586034,     40.53924791 ,   "S"],
              [-53.3639135 ,     50.0685607  ,   "S"],
              [-47.5289726 ,     66.29329569 ,   "S"],
              [-41.48054119,     69.01781434 ,   "S"],
              [-46.54814588,     73.81296717 ,   "S"],
              [-58.31806646,     73.21357306 ,   "S"],
              [-19.90235346,     76.59197619 ,   "S"],
              [-67.85380515,     80.87790581 ,   "S"],
              [-85.70244993,     56.09141573 ,   "S"],
              [-87.95576721,     69.31483029 ,   "S"],
              [-94.77501688,     71.50884975 ,   "S"],
              [-95.24939946,     56.0321179  ,   "S"],
              [-50.36555387,     98.81623761 ,   "S"],
              [-45.91821713,    105.3389982  ,   "S"],
              [-43.30911291,     98.40115285 ,   "S"],
              [-34.65060103,     66.54015533 ,   "S"],
              [35.35434846 ,     33.92570089 ,   "S"],
              [41.26219059 ,     29.41076463 ,   "S"],
              [30.45760312 ,    124.6731233  ,   "S"],
              [15.20672482 ,    111.9510896  ,   "S"],
              [6.102884206 ,    112.6124797  ,   "S"],
              [1.356437388 ,    122.2998998  ,   "S"],
              [-33.24663947,    117.5951965  ,   "S"],
              [-42.97148247,    113.9780293  ,   "S"],
              [-44.75041717,    112.4955837  ,   "S"],
              [-35.97433934,    122.1611289  ,   "S"],
              [-33.36523512,    122.5762136  ,   "S"],
              [-99.20350628,     67.5572706  ,   "S"],
              [-98.72912369,     59.25557535 ,   "S"],
              [-56.51147925,     49.43528664 ,   "S"],
              [-57.9610908 ,     47.85962192 ,   "S"],
              [9.815890457 ,    -91.30950062 ,   "S"]]]
  
            ];

let starDim = [7, 5, 3];

var bgColor;

var meteorShower = false;
let meteorStart = [];
let meteorEnd = [];
let shootOffset = [];
let shootWeight = [];

var shootCount_start = 0;
var shootCount_end = 0;

var n = 200;
var nMeteors;

function setup() {
    ellipseMode(CENTER);
    createCanvas(480, 480);
    frameRate(10);

    // each constellation
    for (var i = 0; i < data.length; i++){ 
        //lines within constellation
        for (var j = 0; j < data[i].length; j++){ 
            // indiv stars within constellation
            for (var k = 0; k < data[i][j].length; k++){ 
                star = data[i][j][k];
                star[0] = map(star[0], -113, 120, 0, width);
                star[1] = map(star[1], -113, 120, 0, height);

                var r;
                var star = data[i][j][k];

                if (star[2] == "L"){
                    r = starDim[0];
                } else if (star[2] == "M"){
                    r = starDim[1];
                } else {
                    r = starDim[2];
                }
                star[3] = r;
            }
        }
    }
}

function initiateMeteorShower(){
    meteorStart = [];
    meteorEnd = [];
    shootOffset = [];
    //meteor steup
    nMeteors = int(random(0, 10))
    for (var i = 0; i<nMeteors; i++){
        var start;
        var end;
        var dirX;
        var dirY;

        //var pathRand = random(0,2)

        if (int(random(0,2)) == 0){
            start = [0, random(0, height)];
            end = [width, random(0, height)];

        } else {
            start = [random(0, width), 0];
            end = [random(0, width), height];

        }
        meteorStart.push(start);
        meteorEnd.push(end);
        shootOffset.push(random(2, 15));
        shootWeight.push(random(1,4));
    }
}



function draw() {
    var curTime = (hour()*3600) + (minute()*60) + second();
    bgColor = map(curTime, 0, 86400, 0, 255);

    background(bgColor);

    //every 10 minutes initiate meteor shower
    if (minute() %5 == 0){
        if (!meteorShower){
            initiateMeteorShower();
        }
        meteorShower = true;
    } else {
        meteorShower = false;
    }
    
    if (meteorShower){
        for (var i = 0; i<nMeteors; i++){
            shootingStar(meteorStart[i], meteorEnd[i], 
                         shootOffset[i], shootWeight[i]);
        //noLoop();
        }
    }
    

    //go through each constellation, draw lines between each pt
    for (var i = 0; i < data.length; i++){ // each constelation
        //lines within constellation
        for (var j = 0; j < data[i].length; j++){
            if (i < hour()%12){
                drawConstellation(data[i][j]);
            }
            // indiv stars within constellation
            for (var k = 0; k < data[i][j].length; k++){ 
                drawStars(data[i][j][k]);
                twinkle(data[i][j][k]);
            }
        }
    }

    


}


function drawStars(star){
    var r = star[3];
    push();
    noStroke();
    var c = (bgColor+200) %255
    fill(c)
    circle(star[0], star[1], star[3]*1.5);
    pop();
}

function twinkle(star){
    //constraining star size
    if ((star[2] == "L" & star[3] >= starDim[0]) || 
        (star[2] == "M" && star[3] >= starDim[1]) || 
        (star[2] == "S" && star[3] >= starDim[2])){
        star[3] -= random(0.8, 0.8);
    } else {
        star[3] += random(-0.8, 0.8);
    }
    star[3] = abs(star[3]);
}

function drawConstellation(constellation){
    var c = (bgColor+200) %255
    stroke(c);
    beginShape(LINES);
    for (var i = 1; i < constellation.length; i++){
        vertex(constellation[i-1][0], constellation[i-1][1]);
        vertex(constellation[i][0], constellation[i][1]);
    }
    endShape();
}


function shootingStar(curStar, nextStar, offset, shootWeight){
    var dx = (nextStar[0] - curStar[0])/n;
    var dy = (nextStar[1] - curStar[1])/n;


    if (shootCount_end < n){
        shootCount_end ++;
    }
    if (shootCount_end > offset){
        shootCount_start ++;
        
    }

    if (shootCount_start == n){
        shootCount_end = shootCount_end % n;
        shootCount_start = shootCount_start % n;
        meteorShower = false;
    }

    push();
    strokeWeight(shootWeight);
    var c = (bgColor+200) %255
    stroke(c, c, c, 180);
    line(curStar[0] + (shootCount_start*dx), 
         curStar[1] + (shootCount_start*dy), 
         curStar[0] + (shootCount_end*dx), 
         curStar[1] + (shootCount_end*dy));
    fill(c, c, c, 200);
    circle(curStar[0]+ (shootCount_end*dx), curStar[1]+ 
          (shootCount_end*dy), 5);
    pop();

}
``

Project 06

This is my duck clock

the amount of ducks corresponds to the 24 hours and they spin once a minute and blink once a second

sketch
//Evette LaComb 
//elacomb@andrew.cmu.edu
// Section D 
// Project 06 - Duck Clock 

    //Concept: grid of 5 x 5, 24 ducks, every hour a new duck swims onto screen. 
    //each duck rotates once a minute.
    //need a function to draw the ducks
    //need a loop for the ducks- where do they enter from, where do they go each hour
    //need a transformation to roate each duck around its center axis- part of function
// b for bubbles in water:
var b = [];
//angle of roatation:
var angleR = 0;
var direction = 1;
//starting array for x position of ducks; 
var stx = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
//starting array for y position of ducks;
var sty = [200, 280, 200, 120, 280, 200, 120, 120, 280, 200, 120, 360, 40, 280, 40, 200, 360, 40, 280, 360, 360, 120, 40, 360];
//end position array for position of ducks;
var endx = [200, 120, 280, 200, 200, 120, 280, 120, 280, 40, 360, 200, 280, 40, 360, 360, 120, 200, 360, 40, 280, 40, 120, 360];
var speed = 1;

function setup() {
    createCanvas(400, 400);
    // object and Array for water texture: 
    for (i = 0; i < 1000; i ++) {
        b[i] = new Object();
        b[i].c = random(255);
        b[i].x = random(5, width-5);
        b[i].y = random(5, height-5);
        //speed that water moves: 
        b[i].dx = random(-0.1, 0.1);
        b[i].dy = random(-0.1, 0.1);
    }  
    frameRate(60);
}

function draw() {
    background("lightblue");
    var h = hour();
    //loops to create water texture
    for (i = 0; i <= 24; i ++) {
        bubble(b[i]);
        update_bubble(b[i]);
    }
    //loops t ocreate ducks corresponding to arrays 
    for (i = 0; i <= hour() - 1; i ++){
        duck(stx[i], sty[i]);
        stx[i] += speed;
        if(stx[i] >= endx[i]){ stx[i] = endx[i]};
    }
    //beach details:
    push();
    rotate(radians(-45));
    fill(255, 255, 255, 60);
    ellipse(0, 0, 320, 150);
    fill(200, 190, 160)
    ellipse(0, 0, 300, 130)
    pop();
    stroke(0);
    strokeWeight(2);
    //text('Current hour:\n' + h, 5, 50);
}


function duck(stx, sty){
//duck stuff: 
    //draw duck at coordinate x, y
    push();
    translate(stx, sty);
    //rotate the duck; 
    rotate(radians(angleR));
    angleR += 0.007;
    //cosmetics for duck:
    noStroke();
    fill("lightBlue");
    ellipse(0, 0, 80, 70);
    fill(230);
    ellipse(0, 0, 70, 60);
    fill(230);
    triangle(10, 30, 10, -30, 45, 0)
    fill("orange");
    ellipse(-25, 0, 30);
    fill("white");
    //stuff to make ducks blink according to seconds 
    ellipse(-10, 0, 40);
    var s = second();
    if (s % 2 == 0){
        fill("black");
    }else{
        fill("white");
    }
    ellipse(-15, 17, 5);
    ellipse(-15, -17, 5);
    pop();

}

function bubble(b){
//cosmetics of water texture:
    noFill();
    strokeWeight(10);
    stroke(255, 255, 255, 20)
    ellipse(b.x, b.y, 70, 70);
}

function update_bubble(b){
//tecnical stuff for water texture:
    //water movement:
    b.x += b.dx;
    b.y += b.dy;
    //if reach edge of screen change direction: 
    if ( b.x >= width || b.x < 0){
        b.dx = -b.dx;
    }

    if (b.y >= height || b.y < 0){
        b.dy = -b.dy;
    }
}

Project 06 – Abstract Clock – srauch

Here is my abstract clock. It’s a beach with tides: high tide is at noon and low tide is at midnight. The grass rustles in the breeze, and the beach is strewn with starfish and shells. It’s dark from 8 pm to 5am. Sunrise is from 6am to 7am, and sunset is from 7pm to 8pm.

sketch 

//Sam Rauch, section B, srauch@andrew.cmu.edu, project 06: abstract clock
//this code creates a beach with a tide. High tide is at noon, and low tide is at midnight.
//the grass rustles in the sea breeze. it gets darker from 7pm 8 pm and lighter from 6 to 7am. 

var grasslength = []; //length of blades of grass
var sandspotX = []; //x position of specks in sand
var sandspotY = []; //y position of specks in sand
var waveY; //height of the tide
var waveShift; //amount the water's edge fluctuates by 
var daytime; //the time of day in minutes
var darkness; //amount of darkness it is

function setup() {
    createCanvas(400, 400);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);

    //initializing x position of specks in sand
    for (var i = 0; i < 50; i++){
        sandspotX[i] = random(0, width);
    }

    //initializing y position of specks in sand
    for (var i = 0; i < 50; i++){
        sandspotY[i] = random(200, 400);
    }

    frameRate(5);

    //creating y position of tide. High tide is at noon, low tide is at midnight
    daytime = hour()*60 + minute(); //time of day, in minutes
    if (daytime < 690) { //if before noon
        waveY = map(daytime, 0, 690, 400, 200); //before noon, wave gets higher with time
    } else { //if after noon
        waveY = map(daytime, 690, 1380, 200, 400); //after noon, wave gets lower with time
    }

    //making it get lighter and darker at sunrise and sunset
    if (daytime >= 300 & daytime < 360) { //if from 5 to 6 am, it gets lighter
        darkness = map(daytime, 300, 360, 120, 0);
    } else if (daytime >= 1140 & daytime < 1200) { //from 7 to 8 pm, it gets darker
        darkness = map(daytime, 1140, 1200, 0, 120);
    } else if (daytime >= 360 & daytime < 1140) { //in the middle of the day, it's not dark
        darkness = 0;
    } else { //in the middle of the night, it's dark
        darkness = 120;
    }
}

function draw() {
    noStroke();
    background(155, 207, 207);

    //row of grass bunches
    for (var i = 0; i <2; i++){
        for(var j = 0; j<=width; j += 20) {
        grass(j, 220);
        }
    }
    
    //sand
    fill(196, 178, 122);
    rect(0, 200, width, 200);

    //little specks in sand
    strokeWeight(3);
    stroke(146, 128, 72)
    for (var i = 0; i<50; i++){
        point(sandspotX[i], sandspotY[i]);
    }
    noStroke();

    //assorted shells and starfish
    starfish(250, 250, color(120, 130, 120), 10);
    starfish(50, 340, color(50, 74, 64), 50);
    starfish(180, 370, color(120, 79, 97), 5);
    shell(140, 260, color(60, 50, 70), color(100, 80, 107), 60);
    shell(300, 300, color(80, 50, 50), color(120, 80, 97), -5);

    //waves
    waveShift = randomGaussian(1, 2);
    fill(30, 100, 155, 240);
    rect(0, waveY+waveShift, width, 300);
    fill(30, 100, 155, 100);
    rect(0, waveY-(random(1,3))+waveShift, width, 300);

    //rectangle that makes darkness and lightness of environment using alpha channel
    blendMode(MULTIPLY);
    fill(35, 50, 70, darkness);
    rect(0,0,width,height);
    blendMode(BLEND);
}

//makes starfish
function starfish(x,y, color, spin){
    push();
    translate(x,y);
    rotate(radians(spin));
    strokeWeight(4);
    stroke(color);
    for (var i = 0; i<5; i++){ //draw five arms from 0,0, rotating after each one
        line(0,0,0,-10);
        rotate(radians(72));
    }
    noStroke();
    pop();
}

//makes seashells
function shell(x,y, color1, color2, spin) {
    push();
    translate(x,y);
    rotate(radians(spin));
    strokeWeight(1);
    stroke(color1);
    fill(color2);

    var radius = 7; //radius of seashell, ie distance from circles to center
    var size = 12; //size of circles themselves
    var angle = radians(0); //theta of circle location
    for (var i = 0; i<20; i++) { //draw circles that get smaller as they get closer to the center
        ellipse ( cos(angle)*radius, sin(angle)*radius, size);
        angle-=radians(24);
        size -= i/20; //decrease size of circles
        radius -= i/30; //decrease radius of seashell       
    }
    noStroke();
    pop();
}

//makes a bunch of grass
function grass(x,y){
    push();
    translate(x,y);
    stroke(65, 100, 52);
    strokeWeight(2);
    rotate(radians(-40));
    for (var i = 0; i < 20; i++){ //creating each blade of grass in a bunch
        for (var j = 0; j < 20; j++){ //creating random lengths for each blade of grass
            grasslength[j] = random(35, 40);
        }
        line(0,0,0, -1*grasslength[i]);
        rotate(radians(4));
    }

    pop();
}

Project 06: Abstract Clock

sketch
sketch
var x=[]
var y=[]
var w=[] //height of rects at background
var a=[-50,0,150,250,300]
var b=[]
var l=[100,200,100,250,100]
var dx=[]
var dy=[]
var r
var spd
var theta
var sunposX
var sunposY

function setup(){
    createCanvas(480,300);
    background(220);
    for(var i=0;i<20;i++){          //setting up array for background gradiant
        y[i]=7.5*i;
        w[i]=height-15*i;
    }
    for(var n=0;n<5;n++){           //setting up the changes in x,y for reflection
        dx[n]=l[n]/20;          //the change in x
        dy[n]=l[n]/3*20;            //the change in y
        b[n]=200; 
    }
    r=height/2-20;
    //spd=1;
    //theta=90;



}

function draw(){
    BackColor();                                //draw backgrounds

    let Sec = map(second(), 0, 60, 0, radians(360)) - radians(90);
    let Min = map(minute() + norm(second(), 0, 60), 0, 60, 0, radians(360)) - radians(90);
    let Hour= map(hour(),0,24,0,radians(360))-radians(90);       // inspired by code here: https://p5js.org/examples/input-clock.html

    push();
    translate(width/2,height/2);
    drawingContext.shadowBlur=40;        
    drawingContext.shadowColor=color(251,114,39);       //glowing effect
    sunposX=r*cos(Hour);
    sunposY=r*sin(Hour);                           //polar coordinates
    fill(244,116,95);
    Sun(sunposX,sunposY); 
                          //draw sun
    drawingContext.shadowBlur=40;        
    drawingContext.shadowColor=color(255); 
    fill(238,243,196);
    Moon(sunposX,sunposY);                      //draw moon
    pop();



    Mountain();                                 //draw mountains
    WaterColor();

    ReflectionMount();
    

}

function Mountain(){            //draw mountain
    noStroke();
    fill(40);                   //color dark grey 
    for (var n=0;n<5;n++){
        triangle(a[n],b[n],a[n]+l[n]/2,b[n]-l[n]/3,a[n]+l[n],b[n]);
    }                   
}

function ReflectionMount(){
    noStroke();
    fill(140);                   //color dark grey
    for (var n=0;n<5;n++){
        triangle(a[n],b[n],a[n]+l[n]/2,b[n]+l[n]/6,a[n]+l[n],b[n]);
    }
    
}



function Sun(x,y){
    ellipse(-x,-y,40,40);
}

function Moon(x,y){
    ellipse(x,y,40,40);
}


function BackColor(){
    noStroke();
    let h=hour()
    if (h>=6 & h<8){                           //6am-8am sunrise
        for(var i=0;i<20;i++){
            fill(178+i*3,206-i*5/2,245-i*6);
            rect(0,y[i],width,w[i]);
        }
    }else if(h>=8 & h<18){                     //8am-6pm day time
        for(var i=0;i<20;i++){
            fill(120+i*5,200+i*3/2,239-i*0.5);
            rect(0,y[i],width,w[i]);
        }
    }else if(h>=18 & h<20){                    //6pm-8pm sunset
        for(var i=0;i<20;i++){
            fill(178+i*3,206-i*5/2,245-i*6);
            rect(0,y[i],width,w[i]);
        }
    }else if(h>=20 || h<6){                     //8pm-6am night time
        for(var i=0;i<20;i++){
            fill(44-i*3/2,46-i*3/2,88-i*5/2);
            rect(0,y[i],width,w[i]);
        }
    }

}

function WaterColor(){
    noStroke();
    let h=hour()
    if (h>=6 & h<8){                           //6am-8am sunrise
        for(var i=0;i<20;i++){
            fill(178+i*3,206-i*5/2,245-i*6);
            rect(0,200,width,w[i]/2);
        }
    }else if(h>=8 & h<18){                     //8am-6pm day time
        for(var i=0;i<20;i++){
            fill(120+i*5,200+i*3/2,239-i*0.5);
            rect(0,200,width,w[i]/2);
        }
    }else if(h>=18 & h<20){                    //6pm-8pm sunset
        for(var i=0;i<20;i++){
            fill(178+i*3,206-i*5/2,245-i*6);
            rect(0,200,width,w[i]/2);
        }
    }else if(h>=20 || h<6){                     //8pm-6am night time
        for(var i=0;i<20;i++){
            fill(44-i*3/2,46-i*3/2,88-i*5/2);
            rect(0,200,width,w[i]/2);
        }
    }

}

The abstract I created has four different scenes: sunrise, daytime, sunset, and night time; I want to create a reflection of the mountain and the sky; and the sun and moon goes with the current time, rising from left and falls from right.

Project 06

For my abstract clock, the day/night period is from 7 am to 7 pm & vice versa. This means that the sun rises & sets at 7 am & 7 pm, respectively. The number of stars displayed on screen references what minute it is, and one complete rotation of a star = 1 minute. The half-circle path that the sun/moon takes can be used to tell the hour.

sketch
//Lily van Veen, section B, lvanveen@andrew.cmu.edu, project 6
var r; //red value
var g; //green value
var b; //blue value
var h; //hour
var m; //min
var s; //sec
var x = []; //x value of top point of stars
var y = []; //y value of top point of stars
var t = 0; // rotation/turn of stars

function setup() {
	frameRate(30);
    createCanvas(480, 480);
    background(235, 205, 124);
    for(var i = 0; i < 60; i++){ 
    	x[i] = random(30, width-30);
    	y[i] = random(30, height-240);
    }
}

function draw() {
	let h = hour();
    let m = minute();
    let s = second();
	if(h > 7 & h < 19){ //"sunrise" and "sunset" will happen @ 7 am & 7 pm respectively
    	r = 235; //yellow
    	g = 205;
    	b = 124;
    	background(r, g, b);
    }else if(h < 7 || h > 19){
    	r = 48; //blue
    	g = 68;
    	b = 133;
    	background(r, g, b);
    }else if(h == 7){
    	r += .01; // w/ .01 change in color @ 30 fps, will take abt 2 min to fully shift from day to night (also about the same time a sunset/sunrise takes :) )
    	g += .01;
    	b -= .01;
    	background(min(r, 235), min(r, 205), max(b, 124));
    }else if(h == 19){
    	r -= .01;
    	g -= .01;
    	b += .01;
    	background(max(r, 48), max(g, 68), min(b, 133));
    }

    for(var i = 0; i < m; i++){ // i is used to count the # of minutes; this is the section to draw the star - initally was going to put this under a function called drawStar(); but didn't function properly
    	push();
        translate(x[i], y[i]);
        rotate(radians(s*6));
    	fill(255, 249, 201); //light yellow
	    strokeWeight(0);
	    triangle(0, -5, -5, 5, 5, 5);
	    triangle(-5, 5, -7.5, 10, 0, 7.5);
	    triangle(5, 5, 7.5, 10, 0, 7.5);
	    triangle(0, 7.5, -5, 5, 5, 5);
	    triangle(-5, 5, -10, 0, 0, 0);
	    triangle(5, 5, 10, 0, 0, 0);
	    pop();
    }
    	push(); //creates path of sun to better indicate hour of the day, "sun" visible from 7 am -> 7 pm
    	translate(240, 480);
    	rotate(radians((((h-7)*60)+m)*(360/1440)));
    	strokeWeight(0);
    	fill(255, 248, 189);
    	ellipse(-215, 0, 50, 50);
    	pop();

    	push(); //creates path of sun to better indicate hour of the day, "sun" visible from 7 pm -> 7 am
    	translate(240, 480);
    	rotate(radians((((h-7)*60)+m)*(360/1440)+180));
    	strokeWeight(0);
    	fill(255, 248, 189);
    	ellipse(-215, 0, 50, 50); //so the ellipse to carve out moon shape is the same as bg :)
    	if(h > 7 & h < 19){ //"sunrise" and "sunset" will happen @ 7 am & 7 pm respectively
      	    r = 235;

Project: 06 – Abstract Clock

Crop Circles

I was inspired by crop circles for my clock. Each node is one hour in a day. The crops in the background grow with the mouse.

Sketch
sketch
/* Evan Stuhlfire
** estuhlfi@andrew.cmu.edu, section B
** Project 06: Abstract Clock  */

var r = 90; // radius of center circle, noon
var deg = 360; // degrees in a circle
var nodeCount = 24; // 24 hours, each node is one hour
var c = []; // color array
var x = []; // x position of circle
var theta = []; //angle
var size = []; // diam of the circles
var defaultColor;
var tempSize = 0; // allows the nodes to grow with time
var pSize = 25;

function setup() {
    createCanvas(480, 480);
    background(127, 198, 164);
    fillArray(); // fill arrays with start values

}

function draw() {
    var thetaRotate = 40; // canvas rotation

    background(127, 198, 164);
    drawCrops();

    // build color array
    buildColorArray();

    stroke(93, 115, 126);
    // settings to draw circles (nodes)
    push(); // save settings
    translate(width/2, height/2); // reset origin to center
    rotate(radians(thetaRotate)); // rotate canvas to draw at an angle

    // call function to draw the nodes
    drawNodes();
    pop(); // restore settings

    // make crops reactive to mouse location and time
    pSize = mouseX/hour();
}

function drawCrops() {
    var rows = width/30;
    var cols = height/30;
    var incr = width/16;
    
    var s1 = width/16;
    var s2 = height/16;
    var len = pSize;
    var a = len/4; 

    // loop over double for loop to add colums and rows of crops
    for(var i = 0; i < rows; i++) {
        for(var j = 0; j < cols; j++) {
            push();
            translate(s1/2, s2/2);
            drawOne(len, a); 
            pop();
            s2 += 2 * incr;
        }
        s1 += 2 * incr;
        s2 = incr;
    }
}

function drawOne(len, a) {
    // function to draw on plant for crops
    stroke(93, 115, 126, 60);
    line(0, -a, 0, len);
    line(-a, -a, 0, len/2);
    line(a, -a, 0, len/2);
}

function buildColorArray() {
    // set the default color
    defaultColor = color(242, 245, 234);

    // fill array with colors
    for(var i = 0; i < x.length; i++){
        if(i < 3) {
            c[i] = color(93, 115, 126);    
        } else if(i < 6) {
            c[i] = color(118, 129, 179);
        } else if(i < 9) {
            c[i] = color(214, 248, 214);
        } else if(i < 11) {
            c[i] = color(163, 213, 255);
        } else if(i < 14) {
            c[i] = color(250, 243, 62);
        } else if (i < 16) {
            c[i] = color(163, 213, 255);
        } else if (i < 19) {
            c[i] = color(214, 248, 214);
        } else if (i < 22) {
            c[i] = color(118, 129, 179);
        } else if (i < 25) {
            c[i] = color(93, 115, 126)
        }
    }
}

function fillArray() {
    var angle = 30; // nodes are positioned 30 degrees apart
    var angle2 = 150; // starting point for second set of nodes
    var dist = 65; // nodes begin at dist from center
    var offset = 1.2 // distance offset 
    var offset2 = .8 
    var minSize = 15; // can be no smaller than minSize

    // fill arrays with start values
    x.push((-deg/2) + 10);
    theta.push(180);
    size.push(r * offset2); // 80% size of center

    // fill array with first 12 nodes
    for(var i = 1; i < nodeCount/2; i++) {
        x[i] = dist;
        theta[i] = angle * i;
        size[i] = max(r * i/18, minSize);

        dist = dist + i * offset;
    }

    // push center circle into array
    x.push(deg/2 - 10);
    theta.push(0);
    size.push(r);

    dist = dist - i * offset; // undo last dist calc
    // fill array with last 12 nodes
    // loop backward so that decreasing i can be used to decrease size
    for(i = x.length; i > 2; i--) {
        x.push(dist);
        theta.push(angle2);
        size.push(max(r * i/22, minSize));

        dist = dist - i * offset2;
        angle2 -= angle;
    }

    // push last circle into array, midnight
    x.push(0);
    theta.push(0);
    size.push(r * offset2); // 80% size of center
}

function drawNodes() {
    var h = hour();
 
    stroke(93, 115, 126);
    // draw line behind center node so that it is behind
    line(0, 0, deg/2, 0);

    // draw the satellite nodes
    push();

    translate(x[0], 0); // reset origin to top circle
    loopAndDraw(0, x.length/2, h);

    // draw top midnight circle
    fill(c[0]);
    circle(0, 0, r * .8);
    pop();

    push();
    translate((deg/2) -10, 0);
    loopAndDraw(int(x.length/2) + 1, x.length, h);

    pop();
}

function loopAndDraw(start, end, h) {
    var dx;
    var dy;
    var current = false; // identify the current node

    // iterate over arrays
    for(var i = start; i < end; i++) {
        dx = x[i] * cos(radians(theta[i]));
        dy = x[i] * sin(radians(theta[i]));

        // midnight
        if(h == 0) {
            h = 24;
        }
        // if the hour has passed or is the current hour use fill
        if(i < h){
            fill(c[i]);
        } else if (i == h) {
            current = true;
            fill(c[i]);
        } else {
            fill(defaultColor);
        }

        stroke(93, 115, 126);
        line(0, 0, dx, dy);
        circle(dx, dy, size[i]);

        if(current) {
            currentHour(i, dx, dy);
        }

        current = false;
    }
}

function currentHour(i, dx, dy) {
    // add time elements to nodes to track time
    // subtract to adjust for rotation of canvas
    var s = second() * 6 - 140;
    var m = minute() * 6 - 140;
    var h = hour() * 30 + minute()/2 - 140; 

    fill(c[i]); // use the color stored in the array
    push();
    translate(dx, dy);
    // make current circle bigger
    tempSize = size[i] * 1.32;
    circle(0, 0, tempSize);

    // have a second hand orbit the current hour
    if(i > 3 & i < 23) {
        fill(c[i - 3]); //use previous color.
    } else {
        fill(defaultColor);
    }
    // mark hours
    var hx = size[i] * .6 * cos(radians(h));
    var hy = size[i] * .6 * sin(radians(h));
    circle(hx, hy, tempSize * .25);

    // mark minutes
    var mx = size[i] * .3 * cos(radians(m));
    var my = size[i] * .3 * sin(radians(m));
    
    circle(mx, my, tempSize * .2);

    // mark seconds
    var armX = size[i] * .55 * cos(radians(s));
    var armY = size[i] * .55 * sin(radians(s));
    strokeWeight(1);
    circle(armX, armY, tempSize * .15);
    pop();
}