Berry Berry Game (Midterm project)



From the original idea of a “Hot Pursuit” driving game to “Berry Berry,” a fruit-chopping score-based game. This change draws attention to the difficulties faced in creating the Hot Pursuit game and how those difficulties influenced the idea and creation of Berry Berry. These strategies which include using sounds, images, object-oriented programming to produce an interesting gameplay experience.

The concept

The initial game concept focused on a high speed chase, where players navigated a vehicle to avoid or crash through obstacles such as roadblocks and cones. The primary goal was to create a thrilling experience, reminiscent of classic arcade racing games, where players would dodge obstacles at increasing speeds.


Obstacle Identification: A significant challenge arose in dynamically generating and identifying obstacles on the road. The process involved incrementing obstacles in the game’s road image, which proved to be complex and cumbersome for real-time gameplay.

Gameplay Complexity: The mechanics of avoiding or interacting with obstacles from the downloaded image introduced a difficulty in balancing gameplay, making unenjoyable to the audience similarly with the Dino Game in google chrome.

Berry Berry

I shifted the idea due to the challenges with the Hot pursuit game, the development focus shifted towards creating a more straightforward and universally enjoyable game. This shift led to the conception of “Berry Berry,” a fruit-chopping game inspired by Fruit Ninja. The idea behind Berry Berry is straightforward: fruits fall from the top of the screen, and the player slices them with a knife controlled by the cursor. Every chop that is successful earns points, but a fruit that is missed counts against the player. The game is over when five fruits are lost, which ups the difficulty and motivates players to get better at accuracy and reaction times. The creation of my game utilizes OOP to manage game elements and interactions efficiently. Both fruits and the knife are defined as objects, each with properties, and methods such as updating positions and detect when intersecting with the fruit. A method within the fruit objects checks for intersections with the knife object. When a collision is detected, it triggers a chopping action, accompanied by the chopping sound effect to enhance the gameplay experience.

The switch from Hot Pursuit to Berry Berry was for both, me and the player. for me it was time consuming to identify every obsticle in the road image. For the players, it might not catch everyone’s interests considering it is a car game and not everyone likes cars. So I ended up choosing to create a game that anyone can enjoy and gain scores in it. My goals for developing Berry Berry more is to create a scoreboard to save the players scores, and to create a more eye catching interface in the game and more levels to it.

function Fruit() {
  this.x = random(width);
  this.y = 0;
  this.speed = 3 + score / 20;
  this.sliced = false;

  this.update = function() {
    this.y += this.speed;
    if (dist(mouseX, mouseY, this.x, this.y) < 50 && mouseIsPressed && gameState === 'playing') {
      this.sliced = true;


New Interactivity factors. Week 3 Reading Reflection

There are only three factors that makes anything “interactive”. Are they more than three? Or two? One? Reading through the text and found out that the writer is biased in terms of reading a book, he mentions that the book isn’t interactive. But I personally think the opposite! When I open a book on my reading sofa, about a subject I love, e.g. Automotive industry, Immediately I will start to process images while sitting on the sofa. When reading a story or a book and this is only by using one factor of interactivity which is Thinking, I will immediately process an Image of what am I reading, and I draw what is happening by only using one factor. Even you professor Aya, while reading this and me inserting the question marks and the exclamation mark you may have processed and image of me and my expressions connecting them with the text, and it goes beyond processing an image of someone depending on the text. I have created factors of what makes a book interactive. 1. Interest 2. Knowing the writer 3. Storytelling. The first factor is the base for the other factors and without this factor the other will fail to achieve the interactivity, without an interest in the subject why do you read it? The 2nd factor is as I mentioned above, the voice of Masood is appearing in this text, why? Simply we met before, or I could have a video of me speaking on the internet or anything else that you could from it process an Image of me. The last factor is the Storytelling part, what is it? What is Storytelling as a term? Storytelling is the interactive art of using words and actions to reveal the elements and images of a story while encouraging the listener imagination. For example, On the cozy evening I dimmed the lights, played jazz music, sat on my reading sofa, grabbed a hot coffee in my favorite blue cup and started to revise this paper that you are reading now on your screen. 100% you have drawn everything on your mind from reading the sentence and I made an internal Interactivity with you dear reader. The Opposite point of views between the writer and me and the conflicts and the questions will generate fruitful answers.

Assignment 2 Starry-Night

going back to the first assignment, creating a portrait of an alien with stars popping in the back of the head. I took the starry night background and tried to enhance it so i can create an artwork pulling it out from the first assignment.  At the beginning I tried to make it animated and the stars move horizontally in the canvas but It was challenging for me and faced a lot of errors. but I thought of making it still within the canvas and give it a twinkle effect, by the help of a youtube video, I was able to create the starry night and the twinkle effect. I faced a challenge with the format of the canvas that if I add 44 to the width it doesn’t fully appear on the web, even with the previous assignment. 

let stars = [];
let numStars = 200; 

function setup() {
  createCanvas(800, 644);
  for (let i = 0; i < numStars; i++) {
    stars.push(new Star()); // Create and add stars 

function draw() {
  background(18, 18, 30); // dark blue sky
  stars.forEach(star => {
    star.twinkle(); // Update star properties for twinkle effect
    star.move(); // Move the star slightly; // Display the star

class Star {
  constructor() {
    this.x = random(width);
    this.y = random(height);
    this.size = random(0.25, 3);
    this.brightness = random(150, 255);
  move() {
    this.x += random(-1, 1);
    this.y += random(-1, 1);
    // Keep stars in canvas
    this.x = constrain(this.x, 0, width);
    this.y = constrain(this.y, 0, height);
  twinkle() {
    // twinkling
    this.size = random(0.25, 3);
    this.brightness = random(150, 255);
  show() {
    circle(this.x, this.y, this.size);



I found this assignment very helpful in terms of pulling something I built before and enhancing it to become a new artwork and apply the new things we learnt in class is an effective way of learning.



Assignment 1 Self-portrait

The first assignment was different than any assignments I have done, it was a fun activity to me. I learned a lot from the past two classes and learned more by doing this task, using my skill of self learning and learning something new at the moment when i think of it.

The portrait itself, initially I tried to make a portrait of myself but I thought after that it would be cliche and everybody will do the same. I came up afterwards with the alien head which is an emoji that I always use and everyone knows me remembers me instantly, so it is me in another universe. I tried to make the same shape of the aliens head but It got challenging, and tried to shape the eyes with the big black pupils, with a tiny circle that shows the reflection of the light. Afterwards I got an idea of drawing some stars behind the head, I tried to draw the quad and shape it afterwards to look like a star but I found it hard fixing the dimensions and not the way I wanted it to be. I came up with an idea of making tiny points all over the canvas behind the head, going back to the reference page in P5 website, I created a starry universe by using the dots and with the command random() and made them infinite by using a loop function to create the starry effect.

Through this assignment I learnt a lot and loved the process of doing it. As a freshman I want to improve my self learning skills and this assignment is  helping me achieving this skill that will help me in my future courses throughout my four years at the university.


function drawAlien(x, y) {
  // Alien face
  fill(0, 200, 120, 50);
  ellipse(x, y, 100, 110); // Head

  // Eyes
  ellipse(x - 20, y - 10, 30, 40); // Left eye
  ellipse(x + 20, y - 10, 30, 40); // Right eye

  // Pupils
  ellipse(x - 29, y -17, 5, 10); // Left pupil
  ellipse(x + 29, y -17, 5, 10); // Right pupil

  // Smiling mouth
  arc(x, y + 20, 10, 15, 0, PI);