Author: Izza Tirmizi

Finalized concept for the project:

My final project concept is inspired by a popular game called Piano Tiles. My idea is to create a sturdy, fully functional four-key piano connected to an Arduino. Users will be able to physically play the game using this piano, while the gameplay will be displayed on a laptop screen and recreated in p5js, with some differences like a life powerup.

Design and description of what your Arduino program will do with each input and output and what it will send to and/or receive from P5

My arduino program will be in charge of sending all the inputs from the push buttons when a player presses a key on the piano to the p5js. This will be similar to the musical instrument assignment we did in class except the speaker will not be in the arduino but rather an output on the computer from p5 to see if the player pressed the right key in the right time frame.

Design and description of what P5 program will do and what it will send to and/or receive from Arduino:

Speaking of which, my p5js program will run the graphics for the game itself with users seeing the tiles they have to click. It will receive the input from the Arduino of when the user has clicked the piano key and use logic to make sure that was correct according to the game rules. If not, the game will end unless the player has an extra life which can be received in the game by pressing all 4 tiles 3 times at a certain point in the song.

I’m currently working on the 3d design for the piano. Right now I found a file online that looks like this:

But, I need it to have 4 keys, so I am going to see if I can somehow alter the design to be for 4 keys instead of these 7 and also add a hole for the wires to come out from. I also anticipate the timing of the keys with the p5 to be hard. Firstly, there is often a delay between the arduino and the p5 I noticed when using the potentiometer in one of our assignments and that could mess up my game. Secondly, creating the tiles to fall in sync with an audio will be difficult and time consuming. I may just make it so that the tiles fall randomly, even if it is not in sync with the music. The game mechanics will still work like usual though.

One thing I really liked about Design Meets Disability by Graham Pullin is the way it focuses on reframing disability not as a limitation, but as a creative lens through which to innovate design. Rather than treating these assistive technologies like hearing aids or prosthetic limbs as mere medical interventions meant to blend in or be hidden, Pullin instead emphasizes their potential to become expressions of identity, taste, and personal style. The idea that a prosthetic limb could be as much a fashion statement as a handbag or a pair of shoes completely challenges traditional views of medical devices. This shift from invisibility to visibility, where these aids can be beautiful, bold, and integrated into one’s sense of self, was fascinating for me because there’s often a sense of shame associated with these assistive technologies instead that is now being converted into a sense of pride. It reveals how design can be an empowering force when it treats users as people with preferences and personalities, not just as patients.

Overall, I think Pullin’s work makes a very compelling case for bringing designers and disabled individuals into a closer collaboration, arguing that inclusive design should not be about achieving an average but about expanding the range of what’s possible. By introducing examples like sculptural hearing aids or prosthetics designed with aesthetic flair, Pullin invites us to think beyond function and consider meaning, identity, and even fun. It is a very unique take that kind of steps away from more utilitarian design approaches, and it challenged my own assumptions about what disability-related products are supposed to look like. Thus, Design Meets Disability doesn’t just advocate for better products, it advocates for a broader, more human-centered vision of design itself.

For my proposal, I was very inspired by the musical instrument assignment Hoor and I did for week 10. The 4 key piano model we made with cardboard, copper tape, and lots of alligator clips did not survive until it was time to present in class which really made me more passionate about creating a working model that not only looked good but also withstood multiple tests. Secondly, I was also inspired by one of my favorite games, Piano Tiles, where players must quickly tap moving piano keys in sync with a tune before they disappear off-screen. Combining both inspirations, my idea is to create a sturdy, fully functional four-key piano connected to an Arduino. Users will be able to physically play the game using this piano, while the gameplay will be displayed on a laptop screen and recreated in p5.js, complete with special effects such as power-ups and musical variations. I’m not quite sure what my plan is for actually building this new model, I am considering maybe 3d printing it or trying to see if I can find examples of 4 key piano models online.

For this assignment, Hoor and I worked together to do the 3 tasks.

Task 1: 

For this task, we used a potentiometer to control whether the ellipse was moving to the left or the right on the horizontal axis. We did this by mapping the values of the potentiometer (0-1023) on the horizontal axis. Then, when we turned the potentiometer the value would translate to a position on the horizontal axis that the ball would move to. We had some difficulties with the delay between the arduino and p5js as sometimes we’d have to wait a couple seconds before the code would update in p5. Here is the code for the arduino:

void setup() {
  Serial.begin(9600);
}

// Read potentiometer value (0–1023) and sends to p5js
void loop() {
  int sensorValue = analogRead(A0);
  Serial.println(sensorValue);
  delay(1);
}

Here is the p5js sketch:

Task 2:

For this task, we had to do something that controlled the brightness of an LED on the arduino breadboard through p5js. So, we decided to create a dropdown for the user to pick between 1-10 to control the brightness of the LED with 1 being off and 10 being maximum brightness. We then mapped that to the 0-255 range for the brightness of an LED and sent that to the arduino which would control how brightly the LED would light up for a few seconds. On the arduino we simply had one bulb connected to digital pin 9. The arduino code can be seen below:

void setup() {
  Serial.begin(9600);
  pinMode(9, OUTPUT);
}

//gets the serial converted value from p5js
void loop() {
  if (Serial.available() > 0) {
    int brightness = Serial.parseInt(); 
    brightness = constrain(brightness, 0, 255); //make sure the value isn't out of range
    analogWrite(9, brightness);
  }
}

Here is the p5js sketch:

Task 3:

In this task, we had to take already existing code and alter it such that every time the ball bounced, one LED light on the arduino lit up, and the wind was controlled by an analog sensor. For controlling our wind, we used a potentiometer once again as we could make it such that values above 512 would move the ball to the east (right) and values below 512 would move the ball towards the west (left). On the arduino, we connected a potentiometer at analog pin A0 and an LED light on digital pin 9. We then used p5js to receive that serial input from the potentiometer and map it to the wind. Whether it bounced being true or false is also what makes the LED light up. Once again, we did experience a delay between the potentiometer value and the wind in p5. The arduino code can be seen below:

const int potPin = A0;
const int ledPin = 9;
bool ledOn = false;
unsigned long ledTimer = 0;
const int ledDuration = 100;

void setup() {
  Serial.begin(9600);
  pinMode(ledPin, OUTPUT);
}

void loop() {
  // Read potentiometer and send value
  int potValue = analogRead(potPin);
  Serial.println(potValue);

  // If LED was turned on recently, turn it off after some time
  if (ledOn && millis() - ledTimer > ledDuration) {
    digitalWrite(ledPin, LOW);
    ledOn = false;
  }

  // recieve signal on whether the ball bounced from p5.js
  if (Serial.available()) {
    String input = Serial.readStringUntil('\n');
    input.trim();

    if (input == "bounce") {
      digitalWrite(ledPin, HIGH);
      ledOn = true;
      ledTimer = millis();
    }
  }

  delay(10); // Slight delay for stability
}

Here is the p5js sketch:

Lastly, here is the link to the video showing the LED light up and the ball being “blown” away by the value sent from the potentiometer:

https://drive.google.com/file/d/140pGv-9DMPd1gCa1xMn_LR3pR_pphx47/view?usp=sharing

Reading 1: A Brief Rant on the Future of Interaction Design

This article challenged me not just to think about technology differently, but to think about my own body in a way I hadn’t before. I’ve never really considered how much my hands do until I read this, and how trained they are to respond to tactile stimuli. The jar had never even occurred to me until I read this piece. The idea that we’ve somehow accepted a future where our main way of interacting is through a single flat surface feels, honestly, a little absurd now. Victor’s relation of tying shoes with numb fingers to the uncomfortable, clumsy feeling of using a touchscreen was also very interesting. It’s like we’ve trained ourselves to tolerate the flat, lifeless interaction because it’s become such an integral part of our daily lives. That realization made me question how many other “innovations” we’ve accepted without thinking critically about what they’re replacing.

Victor’s point that “technology doesn’t just happen” was also really impactful. The future isn’t just something that will occur with no warning but rather something that we have a say and control over. We are not and should not be just passive consumers of technology and we can and should demand more human-centered, embodied interaction. The piece didn’t just critique existing technology, it kind of made me mourn what tactile feelings are being lost in this rush for sleek minimalism.

Reading 2: Follow-Up

I like that the author did not try to fake any sweetness in his responses and was extremely straight up in his replies. Still, he reframes the rant not as a complaint, but as a call to arms for future innovation. Rather than proposing a specific fix, he emphasized the importance of recognizing what’s missing in current interaction design which, as mentioned before, is the lack of physical, tactile, and dynamic engagement with technology nowadays. His point isn’t that iPads or voice commands are inherently bad, but that they represent a limited vision if they become the final stop in interface development because of the lack of tactility. Through analogies to historical tech like early cameras and color film, Victor highlights how true change begins with noticing a gap and daring to explore it.

 

 

 

For this assignment, Hoor and I worked together to come up with the idea of using the push buttons from our kit as keys for a piano. We used cardboard to create the piano keys and poked the push buttons through the bottom layer. We then used copper tape to cover the push button’s pins and give the alligator clips something to attach to in order to connect the buttons with wires that went into the breadboard. For our analog sensor, we used a potentiometer to control the length of the sound made once a key was pressed. The result can be seen here:

https://drive.google.com/file/d/187WqUyYvRZ6KFFVMn0NtSO0ycqEzKyXq/view?usp=sharing

Our circuit diagram can also be seen here:

We’re really proud of the fact that we were able to complete the circuit using a variety of tools like the copper tape and alligator pins and were able to have a creative and working result. We are also really proud of the code that was inspired by the toneMelody exercise we did in class for the pitches. The code can be seen below:

#include "pitches.h"

const int speakerPin = 8;
const int potPin = A0;

const int buttonPins[] = {2, 3, 4, 5};
const int numButtons = 4;

// Define the notes for each button
int notes[] = {NOTE_C4, NOTE_D4, NOTE_E4, NOTE_F4};

void setup() {
  for (int i = 0; i < numButtons; i++) {
    pinMode(buttonPins[i], INPUT_PULLUP);  // Internal pull-up resistor
  }
  pinMode(speakerPin, OUTPUT);
}

void loop() {
  int potValue = analogRead(potPin);  // 0–1023
  int noteDuration = map(potValue, 0, 1023, 100, 1000);  // Adjusts the lengths of the notes

  for (int i = 0; i < numButtons; i++) {
    if (digitalRead(buttonPins[i]) == LOW) {  // Button is pressed
      tone(speakerPin, notes[i], noteDuration);
      delay(noteDuration * 1.3);  // Pause between tones
      noTone(speakerPin);
    }
  }
}

We had some difficulty getting the buttons to connect with the alligator clips using the copper tape since it kept poking through the tape and was very fragile to move around. Even with a double reinforcement, the pins would still stick through. If we were to recreate it, we may seek another alternative that is thicker. We also encountered an unknown issue with some ghost keys where sounds would appear even if no key was pressed. This could be due to the copper tape issue as well.

Overall though, we are proud of the fact that the piano keys worked when pressed and the potentiometer properly adjusted the length of the notes as seen in the video.

Physical Computing’s Greatest hits and misses

Reading this text really made me think differently about what it means to design interfaces, especially ones that don’t rely on screens or traditional controls. The idea that your own hands can act as a cursor, like in the Atlas Gloves project, really struck me. It’s such a nice twist on a familiar interaction we use on a daily basis, and it made me realize that innovation can come from reimagining how we use our bodies every day to communicate with technology. Oftentimes, innovation is synonymous to me with inventing entirely new tools, but this showed me that you can use simple materials like a couple of LEDs, gloves, and a webcam and still end up with something cool and interactive.

What also stood out to me was how these projects prioritize experience and embodiment. The Atlas Gloves weren’t just a technical experiment, but rather about movement, spatial awareness, and making the virtual world feel physically accessible. That made me realize that physical computing is as much about how people feel when they use something as it is about how it works. Whether it’s navigating Google Earth with a wave of your hand or playing a theremin-style instrument with motion, there’s a strong emotional and sensory layer involved. That really inspired me to think about my own projects in this class not just as tools or tasks, but as ways to spark connection and curiosity in the people who use them. As a side note, it also really reminded me of kinect sensors on Xbox where you can bowl by doing the motion of bowling or play table tennis my pretending to hold a paddle and smacking.

Making Interactive Art: Set the Stage, Then Shut Up and Listen

Reading Tom Igoe’s article “Making Interactive Art: Set the Stage, Then Shut Up and Listen” made me reconsider the role of an artist in interactive installations. I used to believe that providing detailed explanations would help audiences connect with my work, but Igoe suggests that over-explaining can limit personal interpretation. He emphasizes creating a context that encourages participants to explore and derive their own meanings, comparing this approach to a director guiding actors without dictating their every move. This perspective highlights the importance of designing experiences that invite engagement and allow for a range of responses, which makes me reflect on how I can craft environments that speak for themselves and foster genuine interaction. It’s also a true testament to how self-explanatory what you create is for people. Like our midterm projects or assignments, we often have to direct our classmates on how to use the controls because we didn’t make it completely obvious. It’s easy to forget that not everyone knows how it was made and how it is supposed to work. Seeing how others try to make it work and whether they get it right rather than explaining makes the interaction much better.

Google Drive Link: https://drive.google.com/file/d/1_hd31ynpr4AzkeD99QR3nakPaNJlEiRF/view?usp=sharing

My idea for this assignment was to have a light that would automatically turn on when it was dark in the room while the other light could be manually turned on. Kind of like a smart light vs a regular light switch light. To do this is use the photoresistor to get the values of the brightness in the room and coded the arduino such that under a certain threshold, the light would automatically turn on.

The circuit diagram looked like this:

The code for it can be seen here:

const int LED_PIN = 9;
const int LIGHT_THRESHOLD = 500;
// the setup routine runs once when you press reset:
void setup() {
  // initialize serial communication at 9600 bits per second:
  pinMode(LED_PIN, OUTPUT);
  Serial.begin(9600);
}

// the loop routine runs over and over again forever:
void loop() {
  // read the input on analog pin
  int sensorValue = analogRead(A2);
  // print out the value you read:
  Serial.println(sensorValue);
  delay(1);  // delay in between reads for stability
  if (sensorValue < LIGHT_THRESHOLD) { //codes the light to turn on when brightness is low
    digitalWrite(LED_PIN, HIGH);
  } else {
    digitalWrite(LED_PIN, LOW);
  }
  delay(100);
}

Overall, it wasn’t too difficult. I just struggled a bit with getting the wires in the correct places and accidentally blew a light because the resistor wasn’t plugged in all the way. It’s tricky dealing with so many wires on the board, I wish it could look more streamlined.

 

Norman, “Emotion & Design: Attractive things work better”

In this reading, Norman’s idea of “attractive things work better” really struck me because I didn’t realize how forgiving I was of things that were more aesthetically pleasing. This plays a huge role when it comes to marketing because brands that are marketed as much more luxury and aesthetic have a positive affect on people compared to cheaper, less aesthetic brands. This made me reflect on my own experiences, like how I’m more patient with my prettier jewelry pieces even if the clasp is annoying, whereas I quickly become irritated with an cheaper and less aesthetic jewelry, even if it technically functions well. Norman also discusses how anxiety can interfere with usability by causing stress, which narrows a person’s ability to think flexibly and adapt. I found it fascinating that aesthetics can influence not just perception but also actual performance, as users who feel calm and engaged are much better equipped to navigate challenges that come with items.

Her Code Got Humans on the Moon:

I found the dedication that Margaret Hamilton had to her work incredible. As a working mother during a time when women would often stay at home, finding time to balance work and home is truly applause worthy and showcases her dedication and passion for her work. Her meticulous approach to programming, combined with her insistence on rigorous testing and error prevention, was absolutely crucial in ensuring the success of the moon landing. I was particularly struck by her emphasis on anticipating potential errors, a mindset that transformed how mission-critical software was developed which is something we could use in our coding as well. Her work demonstrates how careful planning and foresight can mitigate human errors, which, in high-stakes environments like space travel, could really mean the difference between life and death.

For this week’s assignment, I wanted to create something that utilized my handy octo-buddy, especially when it came to detecting its emotions. I decided to use two lights: one red and one green. When the octopus was flipped to happy and placed on the sensor, the green light would light up. When it was angry, the red light would light up. To do this, I utilized copper tape and aluminum foil, flattened into a coin like shape. I took the copper tape and attached the wires for the switches in the tape that I then attached to the legs of the octopus – one on each side for each emotion. I also inserted a wire in the aluminum foil.

The result can be seen here: https://drive.google.com/file/d/1nE8djbPHpdQABXpe-pDiYClpSpO_8Dnd/view?usp=drive_link

All in all, it was a bit hard to get the octopus’ legs to align with the sensor when filming the video, but in the end, it wasn’t too hard of an assignment to complete. I do wish we had more discreet and longer wires, so the octopus didn’t have to be so close to the Arduino board.