Technicolor Golden Mean

More golden mean obsessed animation work. This time, the pattern is centered on phi and the colors cycle in phi relationship to each other. I also re-worked the interactivity to be based on mouse movement instead of clicking. For interesting images, try moving the mouse in small circles near the top right of the image, or in vertical lines from bottom left to top on the right side.

It’s amazing how fast this runs on Chrome.

Move the mouse around to control it:
Left and Right control dot spacing.
Up and Down control dot size.
“R” – Clears the screen (reset)

I also tried doing some high resolution versions to print out at large-scale (30″+). Click the thumbnails to see the high resolution images.

Here’s the sourcecode:

// Rotation of items at 137.5 degrees
// Golden Rectangle sized canvass naturally.
float phi=1.6180339;
float  dimX=600,dimY=dimX/phi;
float distance=4;   // Spreading of the dots
float ox,newx=dimX/2;
float oy,newy=dimY/2;
float diameter=20;  // Width of the outer dots.
float growth=1;  // Speed of growth
int numSeeds=144  ;   // number of seeds should be a fibonacci number.
float rot=0;
int i;
float direction=-1;
float spinAmt=1;
boolean randomColor=true; // Uses black and white by default.
color mColor=color(255,255,255);
float redAmt,blueAmt,greenAmt=0;
boolean decRed, decBlue, decGreen;
boolean cShift=true;
float countInc=-.5;
color[] phicolors = new color[3];
int cnum=0;

void setup(){
  size(int(dimX),int(dimY),JAVA2D);
  smooth();
  background(255);
  fill (mColor);
  stroke(1,255);
  get3Colors();
  placeSpots();
}

void get3Colors(){
  redAmt=int(random(255));
  greenAmt=int(random(255));
  blueAmt=int(random(255));
  mColor=color(redAmt,blueAmt,greenAmt,155);
  phicolors[0]=color(redAmt,blueAmt,greenAmt,255);
  phicolors[1]=color(redAmt/phi,blueAmt/phi,greenAmt/phi,255);
  phicolors[2]=color(redAmt*phi,blueAmt*phi,greenAmt*phi,255);
}

void placeSpots() {
  translate(dimX*(1/phi),dimY/2);
  rotate(spinAmt);
   for(i=1;i<numSeeds;i++){
    rot+=radians(360/(phi*phi));
    newx=(i*distance*sin( rot));
    newy=(i*distance*cos( rot));
    ellipse(newx,newy,diameter*i*.02,diameter*i*.02);
   }
}

void draw(){
  diameter+=countInc;
  if (diameter==0 || diameter>100) {
    countInc*=-1;
    get3Colors();
  }
  rot=0;
  spinAmt+=137.5*direction;
  fill(phicolors[cnum]);
  cnum++;
      if (cnum>2){
        cnum=0;
      }

  placeSpots();
}

void mouseMoved(){
  distance=float(mouseX)/70+1;
  diameter=float(mouseY)/2+5;
  direction*=-1;
  );

}

void keyPressed() {
  if (key == 'c') {
      // pressing c will toggle color and B&W
    randomColor=!randomColor;
    get3Colors();
  }
  if (key == 's') {
    // pressing s will take a picture.  Won't work on JS version.
    saveFrame();
  }
  if (key == 'r') { // reset
    background(255);
  }

}

Posted: February 3rd, 2011 | Author: Rob | Filed under: Animation, Golden Mean, Processing, Programming | 2 Comments »

---