let cellSize;

let increment = 0.02; // The rate at which the angle changes

let direction = 1; // 1 for increasing, -1 for decreasing

​

let margin = 20; // Define a smaller margin for all sides

​

function setup() {

  createCanvas(211, 298);

  fill(80, 210, 150);

  strokeWeight(1);

  frameRate(10);

}

​

function draw() {

  background(0, 50, 250);

  // Set a smaller cellSize to create more cells

  cellSize = min(width / 10, height / 10);

​

  // Calculate how many cells fit within the available area (excluding margin)

  let numCols = floor((width - 2 * margin) / cellSize);

  let numRows = floor((height - 2 * margin) / cellSize);

​

  // Calculate the starting position to center the grid

  let startX = (width - numCols * cellSize) / 2;

  let startY = (height - numRows * cellSize) / 2;

​

  // Loop through to draw the grid

  for (let y = 0; y < numRows; y++) {

    for (let x = 0; x < numCols; x++) {

      push();

      translate(startX + x * cellSize + cellSize / 2, startY + y * cellSize + cellSize / 2);

      let rotateAmount = random(-angle, angle);

      rotate(rotateAmount);

      square(-cellSize / 2, -cellSize / 2, cellSize);

      pop();

    }

  }

​

  // Gradually increase or decrease the angle based on the direction

  angle += increment * direction;

​

  // Change the direction if the angle reaches a certain limit

  if (angle >= 0.5 || angle <= 0) {

    direction *= -1; // Reverse the direction (increase/decrease)

  }

}

​

​

​

function keyPressed() {

  if (key === 'q') saveGif('animfinal.gif', 5);

}

​