twenty_five_squares.pde

/* 
 * Creative Coding Course
 * Week Two: 25 Squares Sketch
 * by Sarah Kuehnle (sarah@sooperduper.com)
 * 
 * This sketch attempts to reproduce the work of Vera Molnar's, 1991
 * work entited, 25 Squares. 
 * A grid of 5 x 5 squares is drawn with some randomness added for 
 * x/y positions and color
*/

int numRowsCols = 5;
int rectSize = 115;

void setup() {
  size(600, 600);
  // to animate, comment out the two lines below and then 
  // set an acceptable framerate. You'll also want to move the 
  // background to be painted in the draw function mimicking 
  // the effect of clearing the screen with each draw loop.
  background(180);
  noLoop();
//  frameRate(2);
  rectMode(CORNER);
  noStroke();
  randomSeed(hour() + minute() + second() + millis());

}

void draw() {
//  background(180);
  int gap = (width - rectSize * numRowsCols) / (numRowsCols + 1);
  
  for (int row = 0; row < numRowsCols; row++) {
    for (int col = 0; col < numRowsCols; col++) {
      float xOffset = 0 + random(-10, 10);
      float yOffset = 0 + random(-10, 10);  
      int shadowOffset = 8;
      float colorSwitch = random(1, 10);
      
      int xPos = gap + gap * col + rectSize * col + (int)xOffset;
      int yPos = gap + gap * row + rectSize * row + (int)yOffset;
          
// Experiment with adding a shadow (not happy with the result)          
//      fill(180, 50);
//      rect(xPos - shadowOffset, yPos - shadowOffset, rectSize + shadowOffset * 2, rectSize + shadowOffset * 2);
          
      if (colorSwitch > 3) {
        fill(152,0,0, 200); // dark red
      } else {
        fill(255,0,0, 200); // red
      }
      rect(xPos, yPos, rectSize, rectSize);
    }
  }
}