Ideas For Final Project


Idea 1 

For the first idea, I’m thinking of using either real-time data or just existing data and creating a creative visualization that can be controlled by the user through an ultrasonic sensor. My second option for data visualization is to apply the concept of sonification in the field of astronomy where data is converted into sound as an output demonstrating  some waves that are being radiated in space or a black hole studied by NASA. If I go with this idea, I’ll probably try to connect the sound of those waves with the user’s interaction with the ultrasonic sensor and connect it to what’s displayed on p5js.

Idea 2

My second idea does not involve any data its more like a game. The game would either involve a journey in an old house and the user will be moving through different rooms or it would be a whole night journey in multiple settings like a home, forest, streets, etc. The main concept is that they will be using their phones as a flashlight to search for certain objects asked by the game in order to win or complete the narrative. The light would be detected by the light sensor and it would be connected to p5js so the space they are in is bright enough for them to look for the item. This idea might be tough because I’m not sure to what extent it is plausible to implement.

Class Exercises

  1. make something that uses only one sensor  on Arduino and makes the ellipse in p5 move on the horizontal axis, in the middle of the screen, and nothing on arduino is controlled by p5.

Ex1 video demo

2. make something that controls the LED brightness from p5

Ex2 video demo

3. take the gravity wind example ( and make it so every time the ball bounces one led lights up and then turns off, and you can control the wind from one analog sensor.

Ex3 video demo

Reflection – Week 10

Interaction Design

Bret Victor’s critique of the current state of interaction design grabbed my attention because I hadn’t really delved into thinking deeply about existing interaction designs before, nor had I formed a strong opinion on the matter. According to Victor, the current approach lacks boldness and visionary thinking, urging a shift beyond established norms to cultivate a more ambitious perspective for the future. While I agree with his viewpoint, transitioning from familiar interaction patterns to something entirely different is not a simple task. People need time to adapt to new lifestyles and products, so changing how we interact with technology may require considerable effort and adjustment.

Considering the evolution of current interaction technology, it becomes apparent that what we have today likely originated from visionary ideas but underwent gradual enhancements over time. As I understood it from the subsequent response, Victor’s vision revolves around the concern that contemporary and future technology might limit our mobility. I believe that the trajectory of people’s vision for interactive technology has remained somewhat consistent. Victor’s frustration with incremental changes to existing products resonates with me, as I think we need to strike a balance. Some technologies, like iPads and iPhones, are user-friendly and effective, but there’s a need to transition to more actively interactive technology  and something that involves more of our senses that we are naturally utilizing without fully realizing and without compromising physical health. Achieving this shift would require engaging brainstorming, diverse suggestions, and expertise from various fields to make it both interesting and feasible.

Week 10 Group Assignment

whimsical musical mixer box


In this project, we designed a unique musical box with a playful twist. Rather than a conventional music box, our creation serves as a musical instrument. The distinctive feature lies in its utilization of an ultrasonic sensor to generate melodies. Additionally, the musical box incorporates a servo motor and an LED light for night use, both controllable digitally. It features an original melody, namely “Ode to Joy,” adding a personalized touch to the musical experience. Inspired by the spirited character Vanellope from the animated movie “Wreck-It Ralph,” we aimed for a funky and whimsical vibe. To enhance its visual appeal, we crafted the box using cardboard and adorned it with starry A4 paper, giving it a delightful and eye-catching appearance, and used a heart-shaped object to play the original song.


Musical instrument Project

Code & Highlights
#include "pitches.h"

// Defining the pins for the ultrasonic sensor and buzzer
const int trigPin = 9;
const int echoPin = 10;
const int buzzerPin = 11;

// Background melodies
int backgroundMelody1[] = {262, 294, 330, 349, 392, 440, 494, 523};
int backgroundMelody2[] = {330, 349, 392, 440, 523, 587, 659, 698};
int backgroundMelody3[] = {392, 440, 494, 523, 587, 659, 698, 784};
int backgroundBeat[] = {200, 200, 200, 200, 200, 200, 200, 200};

// Setup function runs once at the beginning
void setup() {
 // Setting the pin modes for the ultrasonic sensor and buzzer
 pinMode(trigPin, OUTPUT);
 pinMode(echoPin, INPUT);
 pinMode(buzzerPin, OUTPUT);
 //  serial communication for debugging

// Loop function runs repeatedly
void loop() {
 // This sends a short pulse to trigger the ultrasonic sensor
 digitalWrite(trigPin, LOW);
 digitalWrite(trigPin, HIGH);
 digitalWrite(trigPin, LOW);

 // Measure the duration of the echo
 long duration = pulseIn(echoPin, HIGH);
 int distance = duration * 0.034 / 2;

 // Print the distance to the serial monitor for checking
 Serial.print("Distance: ");

 // Play different notes or melodies based on distance
 if (distance < 7) {
 } else if (distance < 20) {
 } else if (distance < 30) {
 } else if (distance < 40) {
 } else {

 delay(500); // Adjust the delay based on your preference

// Function to play a single note
void playNote(int frequency) {
 tone(buzzerPin, frequency);
 delay(500);  // Adjust the duration based on your preference

// Functions to play background melodies
void playBackgroundMelody1() {
 for (int i = 0; i < 8; i++) {
   tone(buzzerPin, backgroundMelody1[i]);


Reflection  and Areas of improvement

When we first implemented this project, we were aiming to have more than one song or melody that the user can switch to with a button, unfortunately, we faced a lot of difficulties and issues, when it came to the code and hardware, specifically the buttons connection to switching from one song to another, including how it was affected when other hardware devices were added. Another area we struggled with is the servo motor’s ability to move in a 360 loop. If we were to create this again, we would have added more songs instead of just one original song, and include a switch to control the volume.




Reading Response – Week 9

Physical Computing’s Greatest Hits (and Misses) & Making Interactive Art: Set the Stage, Then Shut Up and Listen

Both readings provided me with valuable information and insights regarding physical computing and the concept of interactive art. They share a common theme centered around originality and interpretation. The article on physical computing illustrates how even seemingly commonplace projects possess a unique touch each time different individuals recreate them. In my view, a person’s subtle influences, expressions, intentions, and interpretations of their project imbue it with a distinct originality and authenticity. Each creator infuses the project with passion, interest, and a personal story, though not always evident to the audience. This unique narrative provides value to the project unless it is an exact copy without any differences, purpose, or clear story.

Transitioning to the second article on interactive art, I concur with the author’s stance that artists should not fully disclose their interpretation and explanation of their artwork. Allowing the audience to form their own interpretations enhances the art’s impact. However, I disagree with the author’s assertion that art is solely a statement and not an expression. I firmly believe that the beauty of art lies in the story behind it, not necessarily the artist’s interpretation, but their experiences, as the author emphasizes, the art “sets the stage”; meaning that you give some insight of your experience, life, or just some context for the audience and give them a chance to interpret it on their own, since that is also one of the factors that prove the quality of an art work.

From my perspective, interactive art encompasses various fields, ranging from intricately detailed works with rich narratives to visually appealing, randomized creations. Regardless of the project type, it invariably reflects the artist’s expression. Even if the final result involves intentional or unintentional randomness, this randomness is infused with a story, emotions, and connections between perspectives, ideas, and life experiences. Even when the artist is not consciously deliberate in their production, they make decisions based on their interpretation of their own art. In some cases, the result may simply be visually appealing but still open to interpretation. Thus, I believe art can indeed make a statement, but it will always carry an expression to varying extents.


Digital & Analog Sensors


For this assignment, I thought of making a multipurpose sensor but I decided to create a rough design of a night lamp that has a space touch to it. I used two LEDs, a blue and a yellow one, where the blue was used for the moon and the yellow was used for the sun. For the digital aspect of this assignment, I used a button that turns on the blue light, and when clicked for the second time, the blue light starts to blink as well as the yellow light if it’s on, and when clicked for the third time, the blue light turns off. For the analog aspect, I used the sensor to detect light, so when it’s dark enough or the brightness is below 500, the yellow light turns on, and it can be in blinking mode along with the blue light if the button is clicked. 


if (isButtonPressed) {
    buttonMode = (buttonMode + 1) % 3;
    isButtonPressed = false;

    switch (buttonMode) {
      case 0: // Off
        analogWrite(BUTTON_LED_PIN, 0);

      case 1: // On
        analogWrite(BUTTON_LED_PIN, 255);

      case 2: // Fading

The overall code was not very challenging, but it’s definitely new to me and  it took me a while to make sure I have my code right so that I could focus on the hardware. I liked this piece of code because I’m using the switch function which really helped me organize what I had in mind. Also, I initially wanted the lights to fade but I need to work on it to figure out why its blinking.


This assignment challenged me to learn more about the bread board and the arduino and how to separate different functions from each other. I started this assignment by experimenting with what I already learned in class and making a few adjustments, and thought of just leaving it as a multipurpose sensor that can be used in a bedroom setting, a museum, or anywhere else, but I wanted it to have some creative aspect to it, and hence, I used whatever tools I had with me to create a rough design of a night lamp.

Video :

Smart Journal


For this assignment, I decided to make something that can be used in real life. Although the project I made is not necessarily convenient, the concept can be applied in our daily lives. The idea is that sometimes we might want to journal at night on our beds or write a few thoughts in our diaries, and might not have a lamp or quick access to light, hence, I decided to attach the light to the notebook, so that once it’s opened, the light turns on for visibility. This idea definitely needs proper implementation and more serious tools for it to be convenient and easy to use, easy to plug and unplug in reality and it definitely requires a brighter or bigger LED to be connected. Text book with bulb Royalty Free Vector Image - VectorStock

Highlight : I would say that the highlight of this assignment is figuring out how the connection between the wires work and where and how aluminum can be used to facilitate the implementation. I personally found it interesting to play around with the wires and learn how aluminum can connect the wires together to make the LED light up. 

Reflection: I made one mistake in my assignment by using the 10k resistor instead of the 330 without knowing the difference. I’ve also experienced 330 made the LED brighter but I’m not sure if that’s actually the case. It did take me a while to think of something creative without using code which I think was the main challenge in this assignment. I would have tried to make it look more decent and convenient if I had this idea from the start. I initially wanted the LED to light up when someone presses a pen on a piece of paper as they write but I faced some difficulties and thought of this!  For the implementation I used the instructions from the instructors notes and went on ahead with experimenting my ideas.


Video demonstration:


Weekly Reflection _ #8

While reading Emotion and Attractive by Donald A. Norman, a lot of ideas and thoughts were going through my head. Most of what he spoke about made me question the importance of design, practicality, efficiency, and how current feelings affect the decisions we make and actions we take on the spot. One of the first things he mentions is how colorful screens were not necessarily helpful in terms of effectiveness but it gives him a sense of pleasure and hence, he does not want to remove them. He later highlighted that we have evidence that pleasing things work better and produce a more harmonious result. Although I’m not a hundred percent sure what determines a harmonious result in Norman’s context, I interpreted his statement based on the following: Design and adding pleasurable aspects to a product does not necessarily affect how the product itself works, but it affects our interaction with that product that leads to better results. The more attractive a thing is, the more emotionally we connect with something, and the more improvements we can witness in the results. For example, let’s assume I have two different screens with the same efficiency and speed level. If I’m using a small screen to code a game or whatever the project is, the results would be different if I’m using a bigger one. There are many ways to explain the reason for this but the reasons that are not very much discussed in Norman’s text is our feelings towards the product that lead to different results. Based on my interpretation, a bigger screen would be easier for me to program a project, hence, I would feel more motivated to work on it, knowing that I wouldn’t be struggling much with the visibility and display.

Another point Norman highlights in his text is how nervousness and negative affect might change the overall results. I thought of discussing this point because I was able to relate to it on different levels. There is a reason why we need breaks between studying and coding or whatever tasks that require a great amount of focus and mental capacity. In my experience, when I perform such tasks, I see myself drowning back to the same idea or solution I can see. It feels like my brain can not detach from the initial solution, hence, that could create anxiety and overthinking, which ultimately leads me to poor results because I did not have the mental capacity to think out of the box or think differently. When we take breaks, release some tension, and come back with a more positive effect, we think more creatively and possibly see a different way to implement something, leading to better results.

Mid-Term Project


For the Midterm Project, I initially started with a museum-like idea but as I focused more on the aesthetics and the picture I had in mind, it started looking like an old library room. I went with a friendly user interactivity experience, where a person experiences a calm and peaceful experience in a tiny underground library, where they could explore some books and have a few reads. I decided to encompass mostly positive quotes from historical figures from different backgrounds as well as Quranic verses. I also decided to include Greek temples and lanterns that hopefully align with parts of European culture and Arab Muslim culture as well.


Code Highlight 

The most part I struggled with is representing the quotes randomly as the user clicks on the bookshelf. I first placed an array inside the code itself but I kept getting multiple errors and unpleasant results, hence I decided to move the quotes in a CSV file and split the quotes at a semicolon, similar to how data visualization is implemented. I’m still facing one issue, the quote is being displayed twice, for the time being, I just left it there as a reflection but hopefully would figure out the mistake I made.

function room1_quotes() {
  fill(currentColor[0], currentColor[1], currentColor[2]);
  stroke(currentColor[0], currentColor[1], currentColor[2]);
  rect(260, 260, 320, 220, 20);

  // Inside the book
  fill(193, 154, 107);
  rect(270, 270, 300, 210);

  fill(0); // Set text color to black
  textSize(15); // Adjust text size as per your requirement
  textAlign(LEFT); // Change the text alignment to LEFT

  let textX = 270 + 10; // X-coordinate of the text
  let textY = 270 + 10; // Y-coordinate of the text
  let textWidth = 300 - 20; // Adjust the width to leave some margin
  let textHeight = 210 - 20; // Adjust the height to leave some margin

  // Loop through the quotes and display them as paragraphs

  for (let i = 0; i < selectedquotes.length; i++) {
    text(selectedquotes[i], textX, textY, textWidth, textHeight);
    textY += textHeight + 10;

This assignment was definitely time consuming in my experience. It took me a while to figure out a lot of things, especially that I’m not very used to working with classes. I looked at random examples online that did not necessarily do anything I implemented but gave the solution to some of the problems I faced like presenting quotes randomly, and having images change but not rapidly. However, I learned a lot from coding this project, it compelled me to spend a good amount of time trying to understand how each code snippet affects the other and what might be causing glitches or any lags. It certainly made me more confident about my ability to implement something I envisioned, even though its not everything I wanted, but I’m pleased with what I have.



Midterm Progress

For my midterm project, I’m attempting to avoid games in favor of creating something that involves experience and knowledge for the user to explore, as well as material that is helpful, positive, and reassuring. As a result, I decided to design something resembling an old museum with a theme resembling an underground archive, with some art pieces featuring positive words or advice from historical personalities, and another area of books containing Quran verses in Arabic and English. I’m going to try to provide calming and helpful verses. 

In my main page, I will try to add more aesthetics and try to have a mix of European, Greek and a bit of Arabic aspects since the underground museum would involve historical figures from different backgrounds as well as verses from the Quran. For example, the temples in the main page represent Doric Greek temples, and the lanterns can be considered part of many cultures but I initially associated it with the Arab / Islamic culture. The user would be able to click the “Enter” button and enter the museum, and they would be able to use arrows to move between the two sections in the museum. I’m also aiming to give the user the ability to click on the books and pictures to learn more about the historical background, take advice, or enjoy flipping through  positive quotes or reassuring and guiding verses from the Quran. I also plan to add fire sound, audio sounds for certain clicks and papers.

The 3 Orders of Ancient Greek ArchitectureVintage gold arabic lanterns realistic set Vector Image

Most frightening part 

I’m mostly worried about making the buttons take the user to another page or scene, I’m currently trying to do that for my main page which will take me to the first section of the museum. I’m not sure if I will be able to have two sections but it’s definitely something I’m aiming for. I’m also trying to figure out if I can make a book and the user will be able to flip through a few pages.