Concept:

The first cup of coffee, usually accompanied by music of Fairuz, in the morning, is a staple in every Lebanese household. I knew I wanted to do something that is connected to my culture and identity, so I looked up a picture of the signature morning setup and tried my best to mimic it. 

A little bit of background, we call the coffee cup ‘finjan’ and the pot ‘rakwe’. The coffee itself is usually Turkish coffee. 

 

 

 

 

Proud of This Part(s)!
I’m proud of two parts of my code, one is where I used loops to imitate the designs on the cup.

//loop for the oval design of the cup (for)
let ovals = 2;
for (let i = 0; i < ovals; i++) {
  let x = 450 + i * 60;
  let y = 300;
  fill(" #3F51B5");
  ellipse(x, y, 20, 70);
}

//loop for the flower (while)
let flowers = 3;
let i = 0;
while (i < flowers) {
  let x = 430 + i * 50;
  let y = 275;
  stroke("#3F51B5");
  strokeWeight(5);
  line(x, y, x, y + 45);
  noStroke();
  fill("#F44336");
  ellipse(x, y, 10, 20);
  i++;
}

It was very fun to try and figure out the spacing, and using both for and while loops to get myself used to their separate structures, as I tend to be more prone to using for loops.

The other part of my code that I’m really proud of is the little animation when you press your mouse on the ‘rakwe’, it fills the ‘finjan’ and displays a welcome text. 

//little animation for when you press the rakwe
//coffee cup seems to be full
//and a welcome text
if (
  mouseIsPressed &&
  mouseX > 65 &&
  mouseX < 185 &&
  mouseY > 120 &&
  mouseY < 205
) {
  fill("#50211C");
  ellipse(480, 250, 80, 10);
  textAlign(RIGHT);
  textStyle(NORMAL);
  textSize(50);
  fill('black');
  text("Ahla w Sahla", 420,100);
}

My Work:

Reflection:

It’s really fun taking concepts we implemented in class, but actually applying them to your own creative work. You also wind up learning new things on the way, for example, this was my first time using text in p5.js. 

While I like the final result, I definitely see as we learn more, the more interactive and complex I can make it. I would like to make the ‘rakwe’ draggable, and have the user manually fill the cup with coffee. Also, maybe a possibility of under- or over-filling the cup and different display messages for each scenario. 

 

Creative Reading:

Watching Casey Reas’ lecture changed how I think about randomness in my work. I have always enjoyed unpredictability in art, but I tended to treat it as something that just happens rather than something I could plan. Reas’ talk showed me that even small doses of chance can generate patterns that feel intentional, making uncertainty a tool rather than a problem. For example, I want to experiment with algorithms where randomness sparks new ideas without fully determining the final outcome. The idea that the computer can function both as a precise tool and a way to explore controlled unpredictability is particularly meaningful when creating interactive pieces, where audience interactions can lead to unexpected results.

One part of the presentation that stood out to me was Gerhard Richter’s quote, which both Reas and I found inspiring:

“Above all, it’s never blind chance: it’s a chance that is always planned, but also always surprising. And I need it in order to carry on, in order to eradicate my mistakes, to destroy what I’ve worked out wrong, to introduce something different and disruptive. I’m often astonished to find how much better chance is than I am.”

After hearing this quote, it made me realize that chance can improve work in ways I cannot fully plan. For me, the right balance between control and randomness depends on the goals of each project. I have found it works best when I maintain enough structure to communicate meaning while leaving space for unexpected outcomes. By setting boundaries for unpredictability, I can create work that is both deliberate and dynamic, allowing the process and the audience to reveal new directions I might not have anticipated. This perspective encourages me to trust my process more and experiment with confidence, letting systems explore themselves.

After watching Casey Reas’ Eyeo talk on chance operations, I really connected with his idea that randomness can be a powerful tool in creating art. I agree so much with him that allowing chance into a process can lead to results you might never imagine on your own. For example, in the video he shows sketches where simple rules create shapes, but each time the program runs, the shapes move slightly, overlap differently, or appear in new patterns. Even though the rules stay the same, the randomness makes every version unique and surprising. I found this really inspiring because it shows that art doesn’t have to be completely planned; the program can explore possibilities for you, almost like collaborating with the computer. I also thought about how he balances control and chance, which is something I want to apply in my own work. In the examples, he defines limits for where shapes can appear, what size they can be, or how colors can change, so the random elements stay within a certain framework. This makes the final work look intentional instead of chaotic. Watching this made me think about my own sketches. It’s exciting to see how even small random variations can make something feel more alive and dynamic.

I think the best balance between total randomness and complete control is when you set limits for the random parts but keep the main structure planned. In my own sketches, I could let things like pupils or stars move randomly in a small area while keeping the rest of the portrait fixed. This way, randomness adds fun and surprise without making the piece messy. The talk also raises some questions for me: How do artists decide how much randomness to allow without losing the overall vision? And if a program can produce interesting art automatically, does that mean anyone can make art, or is there still something unique about the artist’s choices? Also how do you design rules that are structured enough to guide the outcome but still leave space for randomness to create interesting variations? These are things I want to explore as I experiment more with random elements in my own work.

My concept: 

For my concept, I wanted to try something a little different that’s not too complicated but still has some creativity in it. At first, I was just going to do a simple circle illusion, but then I felt like that was too typical and I could push it further. I included the first work I did of the circle because I thought it represented more of a loop, while the scribbly one ended up showing more of an animation. So I used a while loop to draw 200 points around a circle, but I added randomness to their positions so it wouldn’t look perfect—it looks more scribbly and alive. I also used random colors for each point, which makes the circle feel like it’s sparkling or shifting. On top of that, I made the radius slowly grow as the frames go by, so the shape expands over time instead of just sitting still. Every 300 frames, the background resets, so the drawing starts fresh again. The result is this mix of order and chaos: a circle at the core, but messy, colorful, and always moving.

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

This doesn’t look like much, but it actually makes a big difference in how the sketch feels. The first line makes the circle slowly grow as the frames go by; it’s like the drawing is breathing or expanding instead of staying stuck in one size. The second part clears the background every 300 frames. Without it, everything would just pile up forever until the screen looked like a giant blur.

I had to look up how to use frameCount and the %  symbol because I didn’t know them before. It was cool to learn that % basically means “every so many frames, do this thing.” Once I figured that out, it felt like I unlocked a new trick to control time and motion in my drawing. I think this is what made my work look more interactive. 

// slowly grow radius over time
  r = r + frameCount * 0.05;

  // reset background
  if (frameCount % 300 === 0) {
    background(0);
  }
}

Reflection and ideas for future work or improvements: 

Looking back at this project, I’m really happy with how the scribbly circles turned out. I like that it’s not just a perfect circle but it feels alive and playful, and I think the motion adds a lot. I also learned a lot about how loops and randomness can work together to create patterns that look complex without being too hard to code. If I were to improve it, I’d probably try adding even more layers or different shapes, maybe some rectangles or lines that move in a similar way to the circles. I’d also like to experiment with colors that change more smoothly over time instead of random ones every frame, so it feels more like a natural gradient. Another idea is to make the scribbles react to the mouse or keyboard, so the viewer can interact with it, which is something i’m planning to experience more with the upcoming assignments. Overall, I feel like this project opened up a lot of possibilities for me to explore simple ideas in a more creative, experimental way.

After watching Casey Reas’ talk on chance operations, I realized how randomness can be a powerful tool in creative work. Instead of controlling every detail, allowing chance to play a role can lead to unexpected results that are often more interesting than what I would plan. In my own projects, I plan to experiment with random elements in small ways, like changing colors, shapes, or patterns based on a set of rules but leaving some outcomes to chance. This connects to our discussions in a different class, Understanding of IM class, where we talked about using randomness as an algorithm in conceptual art for example by letting the computer generate outcomes that are surprising but still guided by certain constraints or rules. I think the key is to find a balance between control and randomness, so the work feels intentional but still fresh and dynamic.

The talk also made me question how much control we really need in our work. Reas shows that too much control can limit creativity, but too much randomness can make a project feel chaotic. I found this idea challenging because I usually like to plan every step carefully. I kind of  think about trying a more experimental approach, even if it feels uncomfortable at first. It raises questions for me about when to intervene in a random process and when to let the algorithm or chance take over. 

Concept

For this assignment, I decided to create a simple artwork called Retro Grid Swirl. I was inspired by the bold geometric patterns I saw in the Computer Graphics and Art magazines from the 1970s. I wanted to capture that retro feel but also make it animated, so the grid of shapes would feel alive and moving.

The piece shows a grid of circles and squares that rotate and change size over time. Together, the movement creates a swirling, portal-like effect, as if the grid itself is moving.

Code I’m Proud Of

It took me some experimenting to figure out how to make the shapes switch between circles and squares. Once I added the condition based on frameCount, the grid started changing form every couple of seconds, and I really liked how dynamic it looked.

I also enjoyed playing with color alternation so the shapes wouldn’t feel flat. This made the grid feel more playful and gave it a stronger retro look.

if (floor(frameCount / 120) % 2 === 0) {
  square(0, 0, size);
} else {
  ellipse(0, 0, size);
}

Here’s the work of art I created:

Reflections

 I’m happy with how Retro Grid Swirl turned out. It’s simple, but the combination of loops, conditionals, and animation gives it a lot of life. I especially like how the grid feels balanced but never static , it always has something moving and shifting. At first, it was tricky to control the animation so it didn’t feel too chaotic. Using sine-based size changes helped make the motion smoother and more rhythmic.

I think randomness plays two roles. One is to embed the messages of an artist against the structured society they lived in. The other is to ignite our imagination through unexpected results. In terms of the first one, there were many artworks introduced by the speaker where artists incorporated randomness to imply the message that they wanted to use their own imagination within the structured society. Thus, in those earlier times, randomness represented people’s desire to bring chaos into the society they lived in to free themselves from structure so they could live in their own world. I guess that was their way of manipulating their own imagination to find out who they are. I really resonated with the second role of randomness, which is to allow the audience to use their own imagination to interpret an artwork. There was a project I learned about in the course I took in the fall semester in 2024 called “immersive experiences”, where the producer of the artwork brought a group of random people together in the same place without giving any instructions, and simply let them play with what they had in the room. I felt this was very similar to the concept of randomness the speaker described, in the sense that randomness can lead to unexpected events that we can then interpret using our imagination. Unlike structured artwork, there is no right or wrong way to interpret it. Therefore, you have total freedom in how you interpret and critique a piece of artwork. You can either agree with it or disagree with it. However, with structured artwork, there is usually only one way to interpret it from a single perspective. 

 

I also found the example shown in the video very intriguing, where the speaker demonstrated different codes to show the effects of having randomness by comparing structured codes. The code with the functionality of generating random numbers allowed us to use our imagination to think, for example, that generated things might be a maze or to enjoy tracing where a particular path might go. However, the code without that functionality only generated one dedicated path, which is expected from the process of coding. In this sense, incorporating randomness into artwork adds an intriguing aspect and allows us to freely use our imagination to analyze, interpret, and critique it. I think that is the beauty of incorporating randomness into artwork. But I also agree with the author’s point that it is about achieving a balance between randomness and order. For instance, in one of his artworks where things emerged from the top, bottom, and sides, he defined conditions where, if particles collided with each other, they would deviate away. Those general functions that create interesting animations are absolutely necessary, and humans should be in charge of defining them. However, the way things appear can be controlled by randomness, because if there is only one way for things to emerge, then the result is always expected. I think the result should always be unexpected so that viewers can use their own imagination to interpret the art. At the same time, artists should define some core functionalities or general rules of interaction so that the structure itself has meaning. My conclusion is that a fusion of structure and randomness gives meaning to artwork. If one of them is lacking, the result is either predictable or too chaotic to the point where the meaning is not interpretable. Having a strong balance between structure and randomness allows us to freely use our imagination to explore the meanings of artwork.

Concept:

When I first thought about how I wanted to use a loop in my assignment, I decided to create a flower with five layers of petals that move and rotate. In my code, each loop repeats the same ellipse many times while slowly rotating, forming a full circle of petals. By using five separate loops, the code creates five layers that rotate at different speeds, making the flower look alive and constantly changing. The loops make the process simple and efficient because they draw many shapes with very little code. Additionally, when the viewer clicks the mouse, the flower’s colors change, which makes the artwork more playful and interactive.

The use of loops also made it easy for me to experiment with different numbers of petals, sizes, and speeds until I found a design that felt balanced and beautiful. It helped me understand how powerful loops are in creating complex patterns and animations with very few lines of code. It also showed me how combining repetition with motion can turn simple shapes into something that feels dynamic and alive.

Highlight of the code I am proud of:

One of the most challenging and important parts of my code was creating the background. I had to figure out how to map each y-coordinate to a color gradient and make it look smooth while still matching the rotating flower layers on top. I used a for loop to go through every horizontal line of the canvas and calculate a color between color1 and color2 using lerpColor. The loop was essential as it let me blend the colors smoothly across the whole canvas. I am proud of this part because it added depth and contrast to the flower, making the petals stand out more and giving the artwork a more polished and dynamic look.

function draw() {
  // Gradient background
  for (let y = 0; y < 400; y++) {
    let color1 = color(90, 60, 140);  
    let color2 = color(150, 100, 200); 
    stroke(lerpColor(color1, color2, map(y, 0, 400, 0, 1)));
    line(0, y, 400, y);
  }

Sketch:

Click the mouse to change the colors

Reflection:

In this project, I learned how to use loops to create repeating patterns and motion in my artwork. For future improvements, I would like to experiment with adding more layers, changing rotation patterns, or incorporating transparency effects to make the visuals more dynamic. Another possible improvement is making the animation respond to additional interactions, such as mouse movement or key presses to create a more engaging experience for the viewer.

Concept

For this assignment, I decided to create a simple artwork inspired by the portal in the movie Coraline. I’ve always loved how layered and colorful it looks in the film, so I used it as inspiration for my own piece.

Here’s a picture of the portal from Coraline:

Code I’m Proud Of

It took a lot of trial and error to get the loop working properly. Once I figured out how to write the condition correctly, the rings appeared just how I wanted them. I also added randomized colors of blue, purple, and pink to the rings to make them feel closer to the portal from Coraline. I also adjusted the frame rate to create more of a portal effect.

// circles size increase by an increment as it loops
 for (let i = 0; i < ring1; i += 1) {
   let s = minsize + i * increment;
   ellipse(centerX, centerY, s, s);

   // random colors from the list for each ring
   stroke(random(colors));
 }

Here’s the work of art I created:

Reflections and Improvements

Overall, I’m happy with how it turned out. I wasn’t trying to recreate the portal exactly, but instead capture the beauty of its colors and layers. However, I noticed it took me a really long time to figure everything out, and at one point the program kept crashing. I’d like to improve in understanding loops in general to be more efficient in future projects. I’d also love to add animation to this artwork, like making the rings spiral and swirl so it feels more like an actual magical portal.

In his talk, Casey Reas explores how generative art uses code, rules, and chance operations to create dynamic and unpredictable visuals, showing that creativity comes from both structure and chance. I found it particularly interesting when Reas explained that generative art is a space where structured rules interact with randomness, because when people generally think of coding, they assume there’s always a “right” way to do it, but I don’t necessarily think that’s true. I agree with Reas on this point about how chaos and order thrive together in generative art. But at first, I was one of the people who thought coding was strict and bound by certain rules to follow,  now I see that it can be more playful and freeing.

When I was coding my artwork assignment, I decided to add randomized colors to my code to make it more exciting every time I run the code. The outcome always comes out as different and unique from the one before it, and I enjoyed the unpredictability of it. At the same time, I wonder if too much randomness could take away from the artist’s control. Reas seems to always see randomness in a positive way, but I’m not sure I fully agree with that. Personally, I think it works best when theres a balance, where the structure I write in the code guides the randomness so that the results are still under my control to some extent.