Raya Tabassum: “Chaotic Harmony” art

The artwork is supposed to represent a grid filled with random circles, squares, and triangles, each with a unique color. The number of shapes in each grid tile is also randomly determined, adding an element of unpredictability to the artwork. The black background and semi-transparent colors contribute to a visually dynamic and intriguing composition. The outer loop iterates through the x-axis, and the inner loop through the y-axis, creating a grid of tiles. The use of a while loop inside the nested loops allows for the random generation of multiple shapes within each tile. The switch statement is employed to choose between drawing circles, squares, or triangles based on a randomly generated shape type.
The element of interaction is when the user clicks on it, it alters the composition randomly every time with new colors and grids. This intricate dance creates a mesmerizing grid of shapes, each telling its own colorful story. And if you click on it rapidly, you can see some shapes forming on their own and the whole artwork feels like it’s moving.
I think the artwork effectively utilizes loops to create a visually engaging and dynamic composition. The randomization of shape count and type introduces an element of surprise, making each iteration unique. For future work or improvements, I could experiment with additional parameters such as varying the size or rotation of shapes, and introducing gradients. I also envision expanding the symphony of this visual experience by integrating sound. Each shape could emit unique tones, creating a multi-sensory journey. Additionally, exploring interactive elements, allowing users to dynamically influence the composition in real-time, could open up new dimensions for artistic expression and engagement.
The inspiration came from my desire to make something very vibrant with popping colors and simple shapes. Changing the “tileSize” and playing with different outcomes every time was a really fun experience until I found the visuals I most loved. As I reflect on this creation, I find joy in the harmonious chaos that emerges.

function setup() {
  createCanvas(600, 600);
  noLoop(); //Only draw once
}

function draw() {
  background(0); //Start with a black background
  let tileSize = 10;

  for (let x = 0; x < width; x += tileSize) {
    for (let y = 0; y < height; y += tileSize) {
      let shapeCount = floor(random(1, 5)); //Determine how many shapes to draw in each tile
      let i = 0; //Initialize while loop counter

      while (i < shapeCount) {
        //Generate a random color for each shape
        fill(random(255), random(255), random(255), 200);

        //Randomly choose a shape to draw
        let shapeType = floor(random(3)); // 0, 1, or 2
        switch (shapeType) {
          case 0: //Draw a circle
            ellipse(
              x + tileSize / 2,
              y + tileSize / 2,
              tileSize * 0.5,
              tileSize * 0.5
            );
            break;
          case 1: //Draw a square
            rect(x + 10, y + 10, tileSize - 20, tileSize - 20);
            break;
          case 2: //Draw a triangle
            triangle(
              x + tileSize / 2,
              y + 10,
              x + 10,
              y + tileSize - 10,
              x + tileSize - 10,
              y + tileSize - 10
            );
            break;
        }
        i++; //Increment while loop counter
      }
    }
  }
}

//Allow for regenerating the artwork on mouse press
function mousePressed() {
  redraw(); //Redraw everything
}

When you change “tileSize”: