let gridSize = 15; // Size of the grid

let maxDotSize = 15; // Maximum dot size

let timeOffset = 0; // Time offset for noise

​

function setup() {

  createCanvas(windowWidth, windowHeight); // Make canvas fill the screen

  noStroke();

  adjustGrid();

}

​

function draw() {

  background(135, 206, 235); // Sky blue background

​

  timeOffset += 0.01; // Increment time to animate noise

​

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

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

      // Calculate grid position

      let posX = x * gridSize + gridSize / 2;

      let posY = y * gridSize + gridSize / 2;

​

      // Generate noise-based movement

      let noiseValue = noise(x * 0.1, y * 0.1, timeOffset);

​

      // Map noise to dot size

      let dotSize = map(noiseValue, 0, 1, 2, maxDotSize);

​

      // Map noise to a brighter gray-to-white gradient

      let brightness = map(noiseValue, 0, 1, 200, 255); // Brighter shades

      fill(brightness);

​

      // Draw dancing dots

      ellipse(posX, posY, dotSize, dotSize);

    }

  }

}

​

// Adjust grid dynamically based on screen size

function adjustGrid() {

  cols = floor(width / gridSize);

  rows = floor(height / gridSize);

}

​

// Handle resizing of the window

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

  adjustGrid();

}

​

​