Author: Keya Shah

Randomness, Random numbers, Coin flipping – math class? The only time I’d hear this combination of words was in a math class. Now, adding Art to it, I’ve always heard that you should let your art flow instead of binding it until it ends up creating something satisfying and my perspective broadened significantly after watching Casey Reas’s talk on Chance operations.

However, What intrigues me more than the thought that goes into making random generative art or the experimentation involved in it, is the viewer’s experience and its subjective nature.Art, by its very essence, is subjective, and everyone brings their unique perspective to the act of viewing it. When randomness is introduced into the equation, this subjectivity intensifies. During the talk, I found myself having different interpretations for each demo piece he presented.

Taking, for example, the ‘Fractal Invader.’ While the idea of creating art based on a coin flip is amusing in itself, what truly fascinated me was how my mind suddenly began to perceive people, faces, and complete figures within the artwork. Like this one that looks like a man represented by these black and white squares.

It made me wonder why our minds often deceive us into thinking something is incomplete, and yet, duplication somehow makes it appear whole. Why do we read into it when it’s duplicated? I like that recurring appearances of elements & patterns can create a sense of rhythm and harmony within a particular piece of art.

Introspecting on Reas’s discussion of randomness in isolation, particularly his mention of “the space between order and chaos,” I realized that even this concept is subjective. It left me curious on a slightly different front. How can we determine, to what extent randomness conveys which specific emotion? because just one visual is enough for our minds to start an endless stream of thoughts related to it. I’m interested in exploring further on two aspects: understanding the balance between order and chaos and finding effective ways to express emotions through randomness in the viewer’s experience of generative art.

As I started working on this assignment, I wanted to explore colors and see how far I can go with basic shapes. Having a background in coding but little experience in creative pursuits, this was both exciting and challenging.

I began with a sketch on paper, a humble attempt to visualize the shapes I needed before trying it on p5.js. However, the transition from paper to screen was not as easy. The positioning of shapes was difficult so I displayed the X & Y coordinates using MouseX, MouseY and text. 

So here’s me! And a dog! Anyone who knows me, knows how much I love dogs and hence I decided to add a fur friend that can move and jump alongside me for the assignment. I thought I was content with what I had until I noticed the fairy lights in my dorm room and was curious to try adding a similar lively and vibrant vibe to the canvas. A nested list with RGB color codes, reduced frame count and ellipses filled with these colors resulted in the twinkling fairy lights – like effect. It took me quite a few tries until I was completely satisfied with the shapes and details of the girl I was trying to create.

This was the one I almost settled on, using basic rectangles, lines and ellipses but then I discovered the life saving functions! The bezier(), curve() and the beginShape() endShape() functions that I think were so much more efficient to create the self portrait. The final outcome:

There’s not much about the code or the idea that I’m particularly proud of but the things that I like about what I tried to make are,

1. The motion of the dog – the dog moves with the mouse (as the X coordinates change) & jumps when mouse is pressed!
2. My (the girl’s) smile slightly widens when the dog moves closer to her symbolizing how I feel every time I spot a puppy and run to play with it
3. The fairy lights for the color pop and liveliness.

Here’s a snippet of the code that makes the dog jump! 

//dog jumping
if (isJumping) 
{dogY-=5;
  if (dogY <= height-100){isJumping=false;}
} 
else if(dogY < height/2+180)
{dogY+=5;} //anywhere above the ground, gravity when not jumping

// Prevent the dog from going below the ground
// if (dogY < 0){dogY = 0;} 
// else if(dogY > height/2 + 180){dogY = height/2 + 180;}
dogY = constrain(dogY, 0, height/2+180);

function mousePressed()
{
  if (!isJumping) {isJumping = true;} //if mouseclicked and dog not jumping already
}

I saw a few reference links and tried to understand the basic concept of a jump but then simplified it as much as I could since I felt I needed a very basic application of it to make the dog jump for this assignment. Initially I used if-else statements but then found the constrain() function to do the same.

References : Simple jump, Jump 

Reflections & Possible improvements

 I really enjoyed this assignment and actually found it addictive as I wanted to keep making changes and try new things. For scopes of improvement, I think I could try to make the girl look more realistic with shadows and movements and lesser hardcoding of coordinates. I also tried various colors for the background but then found out there are functions that I can use to create gradients – a feature I’d love to explore next time. Overall, I’m very grateful for the assignment, help and looking forward to more in the upcoming classes.