Project 06 Abstract Clock

I went with the idea of a ballerina.  Her point shoe on the stationary leg gives the seconds and the theatre curtain behind her also moves in seconds.  The shoe moves back and forth every second; the curtain moves down every second.  The floorboards on the stage tell the hour by adding an extra floorboard every hour.  The “clock” gives the minute time by moving with the leg from different positions.  Every hour it resets back to the first position.  The rest of the body and the head was made by lines, triangles, and ellipses.  The skirt was made by creating a shape using vertices.

The whole thing was incredibly difficult, and I felt like crying.  In the end it worked out, though. I would’ve liked to have just faces of the audience appear to count the minutes instead of having the legs move but I couldn’t figure out a way for that to work (I went through five different approaches but they didn’t work out).sketch

//Naomi Shimada
//Section D
//nshimada@andrew.cmu.edu
//Project-06

var dressX;    //Skirt X Coordinates
var dressX1a;
var dressX1b;
var dressX2a;
var dressX2b;

var dressY;   //Skirt Y Coordinates
var dressYa;
var dressYb;
var dressYc;
var dressYd;



 var x = 280;
 var y = 580;
 var h;
 var m;
 var s;
 var footHeight = 40;
 var footWidth = 90;
 var footX = 420;
 var spacing = 5;
 var floorSpacing = 50;
 var floorX = 10;
 var floorY = 780;
 var audienceSpacing = 80;
 var audienceSpacing2 = 50;
 var hbx = 0;
 var vbx = 156;
 var hby = 156;
 var legX = 350;
 var legY = 700;
 

function setup() {
    createCanvas(800,800);  
}

function draw() {
    background(0);

    dressX = (0);
    dressX1a= dressX - 70; 
    dressX1b= dressX1a - 10; 
    dressX2a= dressX+50; 
    dressX2b= dressX2a+10;

    dressY = (0)+ 120;
    dressYa =  dressY+ 80;
    dressYb = dressYa + 20;
    dressYc = dressY +50;
    dressYd = dressYc + 20;

    angleMode(DEGREES);
    h = hour();
    m = minute() ;
    s = second();

   
   curtains();
   Floor();
   floorBoards();
 
   push();
   translate(width/2,height/7);
   scale(2.0);
   skirt();
   pop();
   
   standingLeg();
   movingLeg();
   body();
   foot(); 

   if (s%2==0){
      footHeight = 90;
      footWidth = 40;     //seconds
      footX = 400;
   }
   else{
    footHeight = 40;     //seconds
    footWidth = 90;
    footX = 420;
   }


}



function skirt (){
    strokeWeight(0);
   fill(250,152,189);
    beginShape();
    vertex(dressX,dressY);
    vertex(dressX1a,dressYc);
    vertex(dressX1b,dressYd);
    vertex(dressX2b,dressYb);
    vertex(dressX2a,dressYa);
    vertex(dressX,dressY);
    endShape();     //skirt
}

function standingLeg(){
   stroke(250,152,189);
   strokeWeight(45);         //standing leg
   line(400,420,400,700);      
}

function movingLeg(){
   stroke(250,152,189);
   strokeWeight(45);         //moving leg 
    push();
    translate(350,460);
    if (m<60){
      rotate(3*m);
       
    }

    else if (m>=60){
      rotate(180);
       
    }
    
    line(0,0,0,280);
    strokeWeight(0);
    fill(250,152,189);
    ellipse(0, 280,40,90);
    //minute hand
    pop();

}


function body(){
    strokeWeight(0);
    fill(250,152,189)         //actual body
    triangle(400,460,470,300,320,300);

   stroke(250,152,189);
   strokeWeight(25);         //right arm
   line(320,300,270,200); 
   line(270,200,350,100);

   stroke(250,152,189);
   strokeWeight(25);         //left arm
   line(470,300,520,200);
   line(520,200,450,100); 

   ellipse(440,230,20,20);  //hair bun

   strokeWeight(0);           //head
   fill(250,152,189);
   ellipse(400,235,80,100);

   strokeWeight(45);  //neck
   line(400,300,400,320);
}

function foot(){
    strokeWeight(0);
    ellipse(footX,730,footWidth,footHeight);
}

function curtains(){
  for (i=0;i<s;i++){           //curtains
    fill(198,42,42);
    ellipse(width/2,1+(i*spacing),width+40,10);
   }
}
 
 function Floor(){
    fill(66,47,45);   //floor
   ellipse(400,800,1300,450);
 }

 function floorBoards(){
  for (i=0;i<h;i++){           //floorbaords
    stroke(0);
    strokeWeight(5);
    line(0-200+(i*floorSpacing),545,width/2,1000);
   }
 }



/* 
   for (i=0;i<10;i++){
    for (var j = 0; j < 6; j ++) {
            fill(255, 140);
            strokeWeight(0);
            noStroke();
            fill(252,185,139);       //audience
           ellipse(35+(i*audienceSpacing),270+(j*audienceSpacing2),40,40);
        }    
   } 


     
     fill(255,155,220,50);                     //horrizontal black box
     rect(hbx,100+hby,width,310); 


     fill(255,0,255,50); 
     rect(0,vbx,width,310); //vertical black box
     
     if((s<10)&(s%10!=0)){
      hbx = secs*95;
    }else if(s%10!=0){
      hbx = 0;
      secs= s-10;
    }

    push();
    frameRate(1);
    if(s%10==0){
     vbx = vbx-65;
    }
    pop();

    */

(The image is cut off for some reason. However, it works on my computer and is 800×800.)