Tuesday, February 16, 2016

Clock Process #2


Added pulsing effects. One clock pulse every second, 2 on the minute, and three on the hour. Also added pulsing effects to each group to their corresponding times.

 I want to get an easing effect on the pulses, but I'm having some trouble. I currently tried it on the second pulse and got this (bold code), but it isn't working how I want it to.


// ---------- VARIABLES ----------

// ----- CLOCK VARIABLES -----
int cx, cy;
float secondsRadius;
float minutesRadius;
float hoursRadius;
float clockDiameter;
float fxs,fys;
float fxm,fym;
float fxh,fyh;

// ----- TIMER & EASING -----
float counter = 0;
float tdx = 15;
float tdy = 15;

float fdx = tdx;
float fdy = tdy;

int timer = 0;

// ----- PULSE VARIABLES -----
int secCheck;
int minCheck;
int hourCheck;


// ----------- SETUP ----------
void setup() {
  size(600, 600);
  background(0);
  
  int radius = min(width, height) / 2;
  secondsRadius = radius * 0.72;
  minutesRadius = radius * 0.60;
  hoursRadius = radius * 0.50;
  clockDiameter = radius * 1.8;
  
  cx = width / 2;
  cy = height / 2;
  
  fxs = width/2;
  fys = height/2;
  
}

// ---------- DRAW START ----------
// ---------- DRAW START ----------
// ---------- DRAW START ----------
void draw() {

  counter++;
 
  
  // ---------- CLOCK BACKGROUND ----------
  noFill();
  noStroke();
  ellipse(cx, cy, clockDiameter, clockDiameter);
  
  // Angles for sin() and cos() start at 3 o'clock;
  // subtract HALF_PI to make them start at the top
  float s = map(second(), 0, 60, 0, TWO_PI) - HALF_PI;
  float m = map(minute() + norm(second(), 0, 60), 0, 60, 0, TWO_PI) - HALF_PI; 
  float h = map(hour() + norm(minute(), 0, 60), 0, 24, 0, TWO_PI * 2) - HALF_PI;
  
  
  
  // ---------- CLOCK HANDS ----------
  
  // ----- SECOND HAND -----
  strokeWeight(3);
  stroke(255,0,0);
  fxs += ((cx + cos(s) * secondsRadius) - fxs) * .03;
  fys += ((cy + sin(s) * secondsRadius) - fys) * .03;
  point(fxs+random(-10,10), fys+random(-10,10));
  
  // ----- MINUTE HAND -----
  stroke(255);  
  strokeWeight(3);
  fxm += ((cx + cos(m) * minutesRadius) - fxm) * .01;
  fym += ((cy + sin(m) * minutesRadius) - fym) * .01;
  point(fxm+random(-15,15), fym+random(-15,15));
  
  // ----- HOUR HAND -----
  strokeWeight(3);
  stroke(95,192,242);
  fxh += ((cx + cos(h) * hoursRadius) - fxh) * .1;
  fyh += ((cy + sin(h) * hoursRadius) - fyh) * .1;
 point(fxh+random(-20,20), fyh+random(-20,20));
  
  // ----- REFRESH -----
  fill(0,25);
  rect(0,0,width,height);
   
   
  
 // ---------- PULSES ----------
 
 timer++;
 fdx += (tdx - fdx) * .1;
 fdy += (tdy - fdy) * .1;
 
 // ----- SECOND PULSE -----
 if(secCheck != second()){
  //ll(255,0,0,100);
  stroke(255,0,0,100);
  ellipse(fxs,fys,fdx,fdy);
    if(secCheck != second()){
      tdx = 50;
      tdy = 50;
      timer = 0;
     }
     if (timer > 60){
       tdx = 15;
       tdy = 15;
   }
 }
   println(timer);
 
 // ----- CLOCK PULSE SEC -----
 int radius = min(width, height) / 2;
 if(secCheck != second()){
   noFill();
   stroke(random(255),random(255),random(255));
   ellipse(width/2,height/2,clockDiameter,clockDiameter);
 }
 secCheck = second();
 
 // ----- MINUTE PULSE -----
 if(minCheck != minute()){
   fill(255,255,255,100);
   noStroke();
   ellipse(fxm,fym,100,100);
 }

 // ----- CLOCK PULSE MIN ----- 
 if(minCheck != minute()){
   noFill();
   stroke(random(255),random(255),random(255));
   ellipse(width/2,height/2,clockDiameter+15,clockDiameter+15);
 }
  minCheck = minute();
  
 // ----- HOUR PULSE -----
  if(hourCheck != hour()){
   fill(0,0,255,100);
   noStroke();
   ellipse(fxh,fyh,150,150);
 }
 
 // ----- CLOCK PULSE HOUR -----
  if(hourCheck != hour()){
   noFill();
   stroke(random(255),random(255),random(255));
   ellipse(width/2,height/2,clockDiameter+25,clockDiameter+25);
 }
 hourCheck = hour();
  
}

Clock Process #1


Created the base of the clock. The particles randomly form in small circles while going around the clock. The red group is seconds, white is minutes, and blue is hours.

Tuesday, February 9, 2016

Forest



void setup(){
size(480,400);
smooth();
}

// VARIABLES
int xloc = 100;
int dia = 10;
int space = 50;
int x = 50;
int y = 50;
int s = 50;
float r = random(10);
float rx = random(480);
float ry = random(100);


// DRAW START -- DRAW START -- DRAW START
// DRAW START -- DRAW START -- DRAW START
// DRAW START -- DRAW START -- DRAW START

// IMAGE

// Background Color
void draw(){
fill(171,220,252);
rect(0,0,width,height);
fill(0,0,0,200-mouseX/2);
rect(0,0,width,height);


// Sky Lines
strokeWeight(2);
stroke(128,217,234,50);

for(int i=0; i<= height; i += 10){
line (0,0,width,i);
}
stroke(128,152,234,50);
for(int i=0; i<= height; i += 10){
line (0,height,i,0);
}
stroke(152,128,234,50);
for(int i=0; i<= height; i += 10){
line (width,0,i,height);
}
stroke(190,128,234,50);
for(int i=0; i<= height; i += 10){
line (width,height,0,i);
}

// Sun
noStroke();
fill(255,252,198);
ellipse(width/2,height/2-mouseX/2,50,50);

// Trees
tree(20,0,50);
tree(170,0,10);
tree(390,0,65);
tree(400,0,20);
tree(100,0,5);


// Grass Colors
stroke(0);
fill(51,142,47);
rect(0,100,490,400);
fill(0,0,0,200-mouseX/3);
rect(0,100,490,400);



// Grass Perspective Lines
strokeWeight(2);
stroke(12,57,0);
for (int i = 10; i < 480; i += 5) {
line(i, 100, i + i/.5, 400);
}
translate(20,20);
tree(100,200,15);
tree(200,360,10);
tree(350,400,10);
tree(420,90,5);
tree(50,0,5);
tree(240,90,5);
translate(0,50);
tree(100,200,15);
tree(200,360,10);
tree(350,400,10);
tree(420,90,5);
tree(50,0,5);
tree(240,90,5);
translate(-20,70);
tree(100,200,15);
tree(200,360,10);
tree(350,400,10);
tree(420,90,5);
tree(50,0,5);
tree(240,90,5);
translate(70,60);
tree(100,200,15);
tree(200,360,10);
tree(350,400,10);
tree(420,90,5);
tree(50,0,5);
tree(240,90,5);
}


// DRAW END -- DRAW END -- DRAW END
// DRAW END -- DRAW END -- DRAW END
// DRAW END -- DRAW END -- DRAW END


// OBJECTS

// Tree Drawing
void tree(int tx, int ty, int ts){
pushMatrix();
stroke(0,0,0,200);
fill(35,108,15);
for(int i = 5; i <= 200; i += 3){
ellipse(tx, i,ts+i,ts);
}
popMatrix();
}