Assignment 2- Loops

Concept

The assignment was to create an artwork using loops in p5.js. I started by experimenting on a canvas size of 500 by 400, by using various shapes and incorporating them to a for loop, for it to be randomly appearing on the canvas. I used Circles, ellipses and rectangles, looped them in such a way that they appear randomly on the canvas with different sizes and colors.

To make it even more interactive, I added a bouncing red ball. When you click on the mouse, the ball starts bouncing from one side of the canvas to the other, and I also increased the frame rate so that when the mouse is clicked, the loop speeds up, making the artwork feel alive and engaging. Overall, I wanted to make something visually interesting that you can interact with, and I had a lot of fun experimenting with loops and movements!

A highlight of some code that you’re particularly proud of

//loop for the generation of random shapes
 for(let i=0; i<80;i++){
   frameRate(2); // generation of shapes slows down
   
   //initializing
   let c= random(width);
   let d= random(height);
   let size1= random(10,100);
   let size2= random(10,50);
   
   // initializing random color
   let r= random(50);
   let g= random(50,225);
   let b= random(50,255);
   
   fill(r,g,b); //random colors of shapes
   //shapes
   circle(c,d,50,50);
   ellipse(c,d,size2,size1);
   rect(c,d,size2,size1);
 }

Embedded sketch

Reflection and ideas for future work or improvements

I want to make it more colorful and add more user interactivity to it, not just the bouncing ball.