ICM - Week 4 - Drawing Windows (VL Cross Over)


project link: https://editor.p5js.org/sskripak/sketches/Skpb8Zbc7

In my Visual Language class this week we were tasked with creating compositions using a unified color scheme. I decided that I would use p5.js to create all of my images, and that I specifically wanted to write code that would have an element of unpredictability so it really felt like the program was contributing to the images generated. Four of these images are below, and I will go into more detail about the fifth further down because it is the most complicated and involves the use of my own functions as well as objects and arrays.

My idea for this fifth image was to create a partially random abstract image generator that also had a component of user control. Visually my inspiration comes from images of overwhelming computer pop-ups and the net art of the 1990’s. Rather than control the image directly, I created slider and button objects to indirectly manipulate it.

My first test was to simply see if I could control the creation of windows with the slider. I called an object class I had created and used a for loop to fill an array of objects with windows and then draw them. The number of times that the for loop repeated was set to the output number from the slider. This allowed me to draw and then “undraw” the windows because the background was redrawing every time through.


However, what I wanted to do with the final product was have a new cluster of windows appear in a random location every time the button was clicked, and so I had to move the background call to the setup loop. As a result as the code currently runs it is not possible to “undraw” the windows. The other complication I ran into was storing individual random values of color, size and location for each window, and I ended up creating arrays for all of these which only got filled with values during setup and then when the DOM button is clicked.

ICMStefan SkripakComment