Unusual Switch – Drink Me

For this assignment, I really struggled being creative, maybe because I’m fasting

I explored various metals in my room to discover a novel method for illuminating an LED. Eventually, I decided to use a metal straw as the conductor between two wires. By placing it in a cup and using my mouth to press the straw onto the wires, the LED lights up.

This is what my Arduino looked like:

Those two white wires were taped on the table, very close to each other but not touching.

I covered it with a cup to create the effect of drinking.

My niece volunteered to demonstrate this project. This is the LINK to the video

Lastly, this is my code:

const int ledPin = 2;      // Use pin 2 to control the LED
const int touchPin = 7;    // Use pin 7 to read the touch state

void setup() {
  pinMode(ledPin, OUTPUT);    // Initialize the LED pin as an output
  pinMode(touchPin, INPUT_PULLUP); // Initialize the touch pin as an input with internal pull-up resistor
}

void loop() {
  int touchState = digitalRead(touchPin); // Read the state of the touch pin
  
  if (touchState == LOW) {   // If wire A touches the wire on line 5, it will be LOW
    digitalWrite(ledPin, HIGH); // Turn on the LED
  } else {
    digitalWrite(ledPin, LOW);  // Turn off the LED
  }
}

I really enjoyed making this switch, and seeing it work at the end was truly rewarding.

In my reflection, when reading “attractive things work better” I understood how design is more than just about making things work well or look good. It’s about bringing these aspects together to enhance our experiences with technology, as our emotional reactions to a design are as important as its functionality. This broader view makes me appreciate how both practicality and our emotional responses matter in design.

When reading, I stumbled across a certain idea, where I was thinking that the color of a smartphone is a big deal when people decide what to buy. In general, black or white phones might look professional or classic, but a phone in a bright color like blue or red can make one feel excited or bold. These colors can attract customers who want to show their personality through their devices.

Personally, my phone is blue because that’s my favorite color. When I was choosing, the blue phone immediately stood out to me.

This experience shows how crucial emotional aspects, like color preferences, are in design. They can make technology more enjoyable and meaningful for us every day. By considering both function and emotion, design can really enrich our daily technology use, making it more satisfying and personal.

HAILSTORM HAVOC

My game draws significant inspiration from the hailstorm that occurred in Abu Dhabi a few weeks ago.

I was captivated by the idea of creating a game where the player must dodge hail. I envisioned a game centered around a car avoiding the hail, however, this concept proved to be overly complex, and after trial and error, I was able to overcome this challenge. To play the game: players must move the car away from the falling hail using the mouse click function. Interestingly, the mouse click function in my game serves two purposes, a feature I was unaware of until Pi assisted me in rectifying a misunderstanding. This allowed me to control both the car and a sprite, adding a fascinating layer to the gameplay.

function mousePressed() {
  console.log("Mouse Press");
  //just flipping between modes 0 and 1 in this example

  clouds.forEach((cloud) => cloud.startAnimation());
}

function mouseReleased() {
  clouds.forEach((cloud) => cloud.stopAnimation());
}

How the game works: 

1. 1. You must press Click to start
   2. To move the car you have to press the mouse
      1. The longer the press the further right the ball will go
   3. Dodge the hail (white balls) and avoid touching the red line as both are game over
   4. Press “space” to restart the game 

This is my game:

If it doesn’t work, visit:

https://editor.p5js.org/Afrabinjerais/sketches/q0cF4mKOG

The game is straightforward yet incorporates all the coding components we have learned to date. Its design is uncomplicated, effectively conveying the intended message. I got inspired by this p5 sketch and, the link takes you to a simple game on P5, which has a similar concept to my game, where the objects are falling from the sky.

https://editor.p5js.org/jordanBlueshift/sketches/vSO_bzkaD

 My favorite aspect of my game is the cloud sprites, which fidget whenever the mouse is clicked, creating the impression that the clouds are generating hail. On another hand,  I also encountered a significant challenge when integrating sound effects to play each time the score increased, which was undoubtedly the most difficult part for me to implement. 

    time += 1;
    if (frameCount % 60 == 0) {
      score++;
    }

function scoreUpdate() {
  // score += 10;
  if (score != prevScore) {
    scoreSound.play();
  }
  
  prevScore = score;
  
  fill(128, 128, 128, 150);
  rect(width - 100, 5, 75, 20, 5);
  fill(255);
  text("SCORE: " + int(score), width - 65, 15);
}

The issue stemmed from the points increasing too rapidly. By reducing the timer and implementing a modulo operation as suggested by the professor, I was able to resolve this problem. Looking ahead, or given more time, I would be eager to experiment with transforming the background to be interactive and making it move to visualize a street.  Although my initial attempt at this modification was unsuccessful, I am keen on dedicating time to delve into unfamiliar areas of coding to make this feature a reality.

This is the code for the game:

let gameMode = 0; // Variable to store the current game mode
let musicSound; // Variable to hold the music sound object
let gameoverSound; // Variable to hold the game over sound object
let scoreSound; // Variable to hold the score sound object
var landscape; // Variable to store the landscape graphics
var car_diameter = 15; // Diameter of the ball
var bomb_diameter = 10; // Diameter of the bombs
var xpoint; 
var ypoint; 
var zapperwidth = 6; // Width of the zapper
var numofbombs = 10; // Number of bombs
var bombposX = []; // Array to store X positions of bombs
var bombposY = []; // Array to store Y positions of bombs
var bombacceleration = []; // Array to store acceleration of each bomb
var bombvelocity = []; // Array to store velocity of each bomb
var time = 0; // Variable to track time, usage context not provided
var timeperiod = 0; // Variable to store a time period, usage not clear without further context
var score = 0; // Variable to store the current score
var posX; // X position, usage context not provided
var inMainMenu = true; // Boolean to check if the game is in the main menu
var prevScore = 0; // Variable to store the previous score
let font; // Variable to store font, usage context not provided


//Cloud Variables
let spritesheet;
let oneDimensionarray = [];

function preload() {
  spritesheet = loadImage("clouds.png");
  musicSound = loadSound("sounds/song.mp3");
  gameoverSound = loadSound("sounds/gameover.mp3");
  scoreSound = loadSound("sounds/score.mp3");
  glassbreak = loadSound("sounds/glassbreaking.wav");
  font = loadFont("fonts/Inconsolata_Condensed-Light.ttf");
  car = loadImage("car.png");
  car2 = loadImage("car2.png");
}

// Cloud class starts
class Cloud {
  constructor(x, y, speed, stepSpeed, scale) {
    this.x = x;
    this.y = y;
    this.scale = scale; // Add scale property
    this.speed = speed;
    this.stepSpeed = stepSpeed;
    this.step = 0;
    this.facingRight = false; // Initially moving to the left
    this.animationTimer = null;
  }

  move() {
    if (this.facingRight) {
      this.x += this.speed;
      if (this.x > width + spritesheet.width / 4) {
        this.x = -spritesheet.width / 4; // Wrap around to the left side
      }
    } else {
      this.x -= this.speed;
      if (this.x < -spritesheet.width / 4) {
        this.x = width + spritesheet.width / 4; // Wrap around to the right side
      }
    }
  }

  display() {
    push();
    if (!this.facingRight) {
      scale(-this.scale, this.scale); // Apply scale with horizontal flip
      image(oneDimensionarray[this.step], -this.x, this.y);
    } else {
      scale(this.scale, this.scale); // Apply scale
      image(oneDimensionarray[this.step], this.x, this.y);
    }
    pop();
  }

  advanceStep() {
    this.step = (this.step + 1) % 8;
  }

  startAnimation() {
    this.facingRight = true;
    clearInterval(this.animationTimer);
    this.animationTimer = setInterval(() => this.advanceStep(), this.stepSpeed);
  }

  stopAnimation() {
    this.facingRight = false;
    clearInterval(this.animationTimer);
  }
}

let clouds = [];
// Cloud class ends

function setup() {
  createCanvas(640, 480);
  textAlign(CENTER);
  musicSound.play();
  
var temp00 = 0, 
    temp01 = -20; 

// A while loop that increments temp01 based on temp00 until temp01 is less than the canvas height
while (temp01 < height) {
  temp00 += 0.02; // Increment temp00 by 0.02 in each loop iteration
  temp01 += temp00; // Increment temp01 by the current value of temp00
  timeperiod++; // Increment timeperiod in each iteration
}

// Calculate the initial position of posX based on zapperwidth and car_diameter
posX = zapperwidth + 0.5 * car_diameter - 2;

// Set xpoint and ypoint relative to the width and height of the canvas
xpoint = 0.7 * width; // Set xpoint to 70% of the canvas width
ypoint = height - 0.5 * car_diameter + 1; // Set ypoint based on the canvas height and car_diameter

initbombpos(); // Call the initbombpos function (presumably initializes bomb positions)

imageMode(CENTER); // Set the image mode to CENTER for drawing images centered at coordinates

// Initialize variables for width and height based on sprite sheet dimensions divided by specific values
let w = spritesheet.width / 2;
let h = spritesheet.height / 4;

// Nested for loops to extract sprite images from the sprite sheet and push them to oneDimensionarray
for (let y = 0; y < 4; y++) {
  for (let x = 0; x < 2; x++) {
    oneDimensionarray.push(spritesheet.get(x * w, y * h, w, h)); // Get sub-images from spritesheet and add to oneDimensionarray
  }
}

  
  // Create 3 clouds with horizontal offsets, different speeds and scales
  clouds.push(new Cloud(width / 8, height / 9, 0, 100, 0.9)); // First cloud
  clouds.push(new Cloud((2 * width) / 5, height / 9, 0, 100, 1.2)); // Second cloud
  clouds.push(new Cloud((2 * width) / 2, height / 9, 0, 200, 1.0)); // Third cloud
}

function draw() {
  background(58, 66, 94);

  if (gameMode == 0) {
  clouds.forEach((cloud) => {
      cloud.display();
    });
  textFont(font);
  fill(255);
  textSize(50); // Larger text size for the game title
  textAlign(CENTER, CENTER); // Align text to be centered
   text('HAILSTORM HAVOC', width / 2, height / 2 - 40);
  textSize(16); // Smaller text size for the directions
  // Draw the directions right below the game title
  text('DIRECTIONS:\n click mouse to dodge hail\n the longer the press the further right\n the car will go\n\n AVOID the red line - crossing it means game over', width / 2, (height / 2) + 50);
  textSize(20);
  text('Click to start!', width / 2, (height / 2) + 140);
   
}  
   else if (gameMode == 1) {
    clouds.forEach((cloud) => {
      cloud.move();
      cloud.display();
    });

    fill(239, 58, 38);
    rect(0, 0, zapperwidth, height);
    scoreUpdate();

    fill(255);
    noStroke();
    for (var i = 0; i < numofbombs; i++) {
      ellipse(bombposX[i], bombposY[i], bomb_diameter, bomb_diameter);
      
    }

    updatebombpos();

    
    // ellipse(xpoint, ypoint, car_diameter, car_diameter);
        image(car,xpoint, ypoint-30, car_diameter*5, car_diameter*5);

     
     xpoint -= 3;

    // Check if the mouse is pressed and the xpoint is within the canvas boundaries
if (mouseIsPressed && xpoint + 0.5 * car_diameter < width) {
  xpoint += 6; // Move the xpoint to the right by 6 units
}
     
     // Check if xpoint is less than or equal to posX or if a collision with a bomb has occurred
    if (xpoint <= posX || bombCollistonTest()) {
      gameover(); // Call the gameover function if either condition is true
    }
// Increment the score every 60 frames
    time += 1;
    if (frameCount % 60 == 0) {
      score++; // Increase score by 1
    }
  }

}

function updatebombpos() {
  // Iterate over each bomb
  for (var i = 0; i < numofbombs; i++) {
    bombvelocity[i] += bombacceleration[i]; // Update the velocity of the bomb by adding its acceleration
    bombposY[i] += bombvelocity[i]; // Update the Y position of the bomb based on its velocity
  }

  if (time > timeperiod) {
    initbombpos(); // Reinitialize the positions of the bombs by calling the initbombpos function
    time = 0;
  }
}

function initbombpos() {
  for (var i = 0; i < numofbombs; i++) {
    bombacceleration[i] = random(0.02, 0.03);
    bombvelocity[i] = random(0, 5);
    bombposX[i] = random(zapperwidth + 0.5 * car_diameter, width);
    bombposY[i] = random(-20, -0.5 * car_diameter) + 190;
  }
} //This function initializes the position and motion properties of each bomb by assigning random values within specified ranges.

function bombCollistonTest() {
  var temp = 0.5 * (car_diameter + bomb_diameter) - 2;
  var distance;
// Iterate over each bomb to check for a collision
  for (var i = 0; i < numofbombs; i++) {
    distance = dist(xpoint, ypoint, bombposX[i], bombposY[i]);
    if (distance < temp) {
      return true;
    }
  }
  return false;
} //This function checks for collisions between the player and each bomb by comparing the distance between them to a threshold. If any bomb is too close (within the threshold), it returns true (collision detected). Otherwise, it returns false.

function gameover() {
  image(car2,xpoint, ypoint-30, car_diameter*5, car_diameter*5);
  musicSound.pause();
  glassbreak.play();
  gameoverSound.play();
  textFont(font);
  fill(255);
  textSize(50); // Set the text size
  textAlign(CENTER, CENTER); // Align text to the center
  text("GAME OVER", width / 2, height / 2 - 20); // Center the text horizontally and vertically
  textSize(15); // Decreased text size for "press space to restart" text
  text("Press space to restart", width / 2, height / 2 + 20); // Positioned below "GAME OVER" text
  noLoop();
}

function scoreUpdate() {
  // score += 10;
  if (score != prevScore) //// Play the scoring sound only if the current score has changed from the previous score 
  {
    scoreSound.play();
  }
  
  prevScore = score;
  
  fill(128, 128, 128, 150);
  rect(width - 100, 5, 75, 20, 5);
  fill(255);
  text("SCORE: " + int(score), width - 65, 15);
}

function keyPressed() {
  if (keyCode === 32) {
    // Check if the key pressed is space (keyCode 32)
    restartGame(); // Call the function to restart the game
  }
  
}

function mousePressed() {
  if (gameMode==0)
    gameMode=1;
  console.log("Mouse Press");
  //just flipping between modes 0 and 1 

  clouds.forEach((cloud) => cloud.startAnimation());
}

function mouseReleased() {
  clouds.forEach((cloud) => cloud.stopAnimation());
}

function restartGame() {
  // Reset all game variables to their initial values
  musicSound.play();
  gameoverSound.pause();
  time = 0;
  score = 0;
  posX = zapperwidth + 0.5 * car_diameter - 2;
  xpoint = 0.5 * width;
  ypoint = height - 0.5 * car_diameter + 1;
  initbombpos();
  // Restart the game loop
  loop();
} 
//This function resets the game environment and variables to their initial state, essentially restarting the game. It resumes background music, pauses any game over sound, resets score and time, repositions the player and bombs, and restarts the game loop.

Enjoy!

References of pictures:

https://bnnbreaking.com/finance-nav/al-ains-unprecedented-hailstorm-a-costly-blow-to-the-car-sales-sector

https://bnnbreaking.com/weather/uaes-al-ain-transformed-unprecedented-hailstorm-blankets-streets-in-white

From what I understand, “computer vision” refers to a broad range of algorithms that let computers make sophisticated analyses of digital images and movies. The reading begins with defining computer vision and then explores its use in interactive arts, emphasizing Marvin Minsky’s early miscalculation of the field’s complexity. The reading was educational, especially the portion that highlighted how many different kinds of artworks use computer vision. These works of art range widely in style, from abstract and formal pieces to ones with comedic or political overtones, and this is important in regard to understanding the different ways in which we can communicate art.

Moreover, other artists mentioned explore a wide spectrum of human movement, from close studies of facial expressions to broader gestures and even entire body movements. Overall, the reading underscores the rich potential of computer vision in the realm of interactive art, showcasing its versatility and impact on artistic expression.

So far I got my game running but it’s still in process. I still have to imbed sound and change a couple of things, but you get the point of the game.

I found it hard to make the sprite and the ball move within the same function, but with the help of Pi, thanks Pi, I was able to do that.

Overall, I still have to add a couple of things, as I have a lot of ideas that I will try to put into action. But so far, I’m happy with my progress, even though my game is simple.

This is some of my code that’s related to the game:

var ball_diameter = 30;
var bomb_diameter = 10; 
var xpoint;
var ypoint;
var zapperwidth = 6; 
var numofbombs = 20;
var bombposX = [];
var bombposY = [];
var bombacceleration = [];
var bombvelocity = [];
var time = 0;
var timeperiod = 0;
var score = 0; 
var posX;

function setup() {
  createCanvas(640, 480);

  var temp00 = 0, temp01 = -20;
  while(temp01 < height){
    temp00 += 0.02;
    temp01 += temp00;
    timeperiod++; 
  }

  posX = zapperwidth + 0.5*ball_diameter - 2;
  xpoint = 0.5 * width;
  ypoint = height - 0.5*ball_diameter + 1;

  initbombpos();
}

function draw() {
  background(137, 209, 245);
  
  fill(239, 58, 38);
  rect(0,0, zapperwidth, height);
  scoreUpdate();

  fill(255);
  noStroke();
  for(var i=0; i<numofbombs; i++){
    ellipse(bombposX[i], bombposY[i], bomb_diameter, bomb_diameter);
  }

  updatebombpos(); 

  fill(31, 160, 224);
  ellipse(xpoint, ypoint, ball_diameter, ball_diameter);
  xpoint -= 3;

  if(mouseIsPressed && (xpoint + 0.5 * ball_diameter) < width) {
    xpoint += 6; 
  }

  if(xpoint <= posX || bombCollistonTest()) {
    gameover();
  }

  time += 1;
}

function updatebombpos(){
  for(var i=0; i<numofbombs; i++){
    bombvelocity[i] += bombacceleration[i];
    bombposY[i] += bombvelocity[i];
  }

  if( time > timeperiod){
    initbombpos();
    time = 0;
  }
}

function initbombpos (){
  for(var i=0; i<numofbombs; i++){
    bombacceleration[i] = random(0.02, 0.03);
    bombvelocity[i] = random(0,5);
    bombposX[i] = random(zapperwidth+(0.5*ball_diameter),width);
    bombposY[i] = random(height/4, height/2); // Adjust Y position to be between one-fourth and half of the canvas height
  } 
}

function bombCollistonTest(){
  var temp = 0.5*(ball_diameter+bomb_diameter)-2;
  var distance; 

  for(var i=0; i<numofbombs; i++){
    distance = dist(xpoint, ypoint, bombposX[i], bombposY[i])
    if(distance < temp) {
      return true; 
    }
  }
  return false; 
}

function gameover(){
  fill(255);
  textSize(32); 
  textAlign(CENTER, CENTER); 
  text("GAME OVER", width/2, height/2 - 20); 
  textSize(15); 
  text("Press space to restart", width/2, height/2 + 20); 
  noLoop();
}

function scoreUpdate(){
  score += 10;
  fill(255);
  text("SCORE: " + int(score/timeperiod), width - 65, 15);
}

function keyPressed() {
  if (keyCode === 32) { 
    restartGame(); 
  }
}

function restartGame() {
  time = 0;
  score = 0;
  posX = zapperwidth + 0.5 * ball_diameter - 2;
  xpoint = 0.5 * width;
  ypoint = height - 0.5 * ball_diameter + 1;
  initbombpos();
  loop();
}

In this assignment, I wanted to do a generative text that moves.  I did that by doing an array and watching a YouTube tutorial that taught me how to move the fonts, which was quite easy to do.

Then, I was thinking of adding an interactive element with the mouseClicked element but I wasn’t sure how to do that, as I kept getting errors as the font oscillates back to forth (using sin waves) by default.

With the help of Pi (thanks Pi) I was able to do that, where each time the mouse was clicked the fonts oscillated back and forth faster and faster.

So this is the code

let font;
let points = [];
let r = 4;  
let angle = 0;
let angleIncrement = 1;  // New variable to control the angle increment rate
var landscape;

function preload() {
  font = loadFont("fonts/Inconsolata_Condensed-Light.ttf");
  landscape = loadImage('background.jpg');
}

function setup() {
  createCanvas(510, 400);
  points = font.textToPoints("AFRA", 0, 300, 300, {
    sampleFactor: 0.1
    // simplifyThreshold: 0
  });
  angleMode(DEGREES);
}

function draw() {
  background(landscape);
  for (let i = 0; i < points.length; i++) {
    ellipse(points[i].x + r * sin(angle + i * 20), points[i].y, 10, 10);
  }
  angle += angleIncrement;  // Use the angleIncrement variable
}

function mouseClicked() {
  angleIncrement += 5;  // Increase the angle increment rate on each click
}

and this is the final product

Honestly, I’m proud of my work so far, with this being my 4th assignment with code, but in the future, I would love to work with Arabic letters and see what it would look like.

Reference to the video I watched:

https://www.youtube.com/watch?v=eZHclqx2eJY

This week’s reading has been incredibly enlightening, offering valuable insights into the realm of interaction and design. It prompted me to reconsider the intricacies of design processes and their impact on user experience. The discussion on the challenges of everyday interactions, particularly with objects like doors, emphasized the pivotal role of effective design in usability. The concept of “Norman doors” sheds light on the common struggle users face in navigating poorly designed interfaces, a challenge I’ve personally encountered.

Similar to the confusion of push and pull doors, I also get confused every time I try to open my curtains. It annoys me when I pull the curtain string to open and it gets closer even further instead.

Through engaging anecdotes and examples, the reading emphasized the importance of discoverability and understanding in design, advocating for intuitive products that require minimal instruction. One aspect that stood out to me and that I believe is crucial to keep in mind for my future career in IM is the exploration of human-centered design and its integration of psychology and technology. Understanding how to prioritize human needs, capabilities, and behavior in design solutions is paramount, as it ensures products are not only aesthetically pleasing but also functional and user-friendly. This insight is something I find both intriguing and essential to carry forward as I pursue my career in IM.

Taking inspiration from a basic car drawing, I started what I thought was an easy assignment. But as the deadline got closer, I realized I had misunderstood the instructions. Even though I spent a lot of time on it, the final result wasn’t what it should’ve been. Still, I decided to include it in my work to show my effort.

Not giving up, I tried again. This time, I wanted to make something different. This time I created a random canvas, inspired by children’s drawings of random shapes. (since that was what my niece was doing right beside me when I was working on this assignment ) 

where each time the mouse clicks a new shape, a new color appears on the place you have clicked. Although it was very simple, since I was rushing, I still managed to include arrays 

class Circle {
  constructor(x, y) {
    this.x = x;
    this.y = y;
    this.diameter = random(30, 100);
    this.color = color(random(255), random(255), random(255));
  }
  
  move() {
    this.x += random(-3, 3);
    this.y += random(-3, 3);
  }
  
  draw() {
    fill(this.color);
    noStroke();
    ellipse(this.x, this.y, this.diameter, this.diameter);
  }
}

class Triangle {
  constructor(x, y) {
    let x2 = x + random(-50, 50);
    let y2 = y + random(-50, 50);
    let x3 = x + random(-50, 50);
    let y3 = y + random(-50, 50);
    
    this.points = [{x: x, y: y}, {x: x2, y: y2}, {x: x3, y: y3}];
    this.color = color(random(255), random(255), random(255));
  }

I had to use class, and the concept of randomness to create this abstract, and noise to create the jittering effect, that adds interactivity to this project, making it more interesting.

Looking back, even though I made the huge mistake of skimming through the instructions, I learned a lot from this project. It taught me to pay more attention to details and understand what I needed to do, and I was able to experiment and find a way to trigger the creation of a random object each time the mouse was clicked.

The reading discusses the concept of interactivity, highlighting its overuse and misconceptions. The author defines interactivity as a conversational process involving listening, thinking, and speaking alternately. They note that despite interactivity being recognized as important in computing, it’s often misunderstood.

The author proposes viewing interactivity as a spectrum rather than a binary state, akin to measuring weight. They emphasize the importance of considering nuances and subjective evaluations when discussing interactivity. Additionally, the reading addresses misconceptions about interactivity, such as the belief that reading is interactive After reading the text, I find myself reflecting on the complexity of the concept of interactivity.

The author’s comparison of interactivity to a conversation resonated with me, as it captures the essence of genuine interaction. I appreciate the author’s call to view interactivity as a spectrum, which allows for a more nuanced understanding of its manifestations. Furthermore, the discussion on misconceptions about interactivity, particularly regarding reading, prompts me to reconsider my assumptions.

Casey Reas initiates profound contemplation on the dynamic interplay between order and chaos within the realm of art. He talks about randomness, from changes in physics to using it on purpose in art, challenging what we usually think about in art. Reas has a way of making art through three steps: form + behaviors = elements, and he calls it “precise geometry,” which adds an interesting twist to how he creates.

In some cases, people worry that digital art messes with how artists express themselves because it’s unpredictable. But Reas introduces the idea of “controlled randomness.” and with this concept, he sets some rules but lets things surprise him, and it gives the art he produces a unique twist. In addition to this, randomness gives artists a sense of control and makes art more diverse and fun.

Thinking about it later, there’s a real rethink about assuming digital art messes up an artist’s message due to its unpredictability. Reas stresses “ordered randomness,” showing how artists control the code but also add surprise with random bits. It’s like a balance between control and unpredictability, uncovering a deeper side to digital art.