Reading Reflection Week 11: The Touchy Touchscreen

Bret Victor makes a really good point about the so called “Pictures under glass” concept of technology. I mean, as a bit of a fun fact, in my elementary school, our books were so in need of an update that the latest technology the textbooks about computer science, mention touchscreens as the latest technology. It’s quite laughable thinking about it. But I do have to agree, in a generation and era where we’re living a touchscreen oriented life, the magic does get lost along the way.

But thing is I think right now we have at least one example of trying to make technology adapt to fit our human body, being the reMarkable paper tablet. Initially when I was looking to buy some new technology I had this one goal in mind; that it can have a touchscreen for me to draw and write on. I primarly was looking at laptops that had touchscreens when I was introduced to the reMarkable. Now I thought, I mean its nothing special when it came to what it is and what it lacked as opposed to a conventional laptop. But after testing it out, it was astounding. It felt so natural to write on it, like I was writing in a notebook. I didn’t get that artifical feel that iPads give me and genuienly is what sold me on buying the reMarkable in the end.

At some point, we do have to ask ourselves, at what point is our life simulated by screen or whether our reality is literally a headset we can’t take off? (obviously I’m joking but it is getting quite dystopian no?)

Week 11 – Arduino Music Megan

Arduino – Harry Potter Music Box

Concept

For this project, I decided to create a mini music pad that can play the Harry Potter theme. The idea came from a small Harry Potter music box that I was gifted when I was younger, since I have always loved Harry Potter and I am a big fan. I also play the piano, so I wanted to design something that felt similar to an instrument and could simulate specific notes like a simplified keyboard.

Process

For the hardware, I used four colored buttons, a potentiometer, and a buzzer to produce sound. I connected each button to a digital pin, the potentiometer to 5V, GND, and analog pin A0, and the buzzer to another digital pin. All components were connected to ground appropriately.

For the coding part, it was a bit challenging at first to find the right notes. I experimented with a basic Arduino buzzer note library and helped myself with Chat GPT to adjust different frequencies until they sounded closer to the melody I wanted. Since the Harry Potter theme has more than four notes, I used the potentiometer as an analog input to change the pitch of the notes. This allowed me to expand the range of sounds using only four buttons. Although it is not perfectly accurate, the result is still very recognizable and captures the essence of the original theme.

// ==============================
// MINI MUSIC PAD - HARRY POTTER SONG
// ==============================


// BUTTON PINS 
int b1 = 2; // E
int b2 = 3; // G
int b3 = 4; // B
int b4 = 5; // C 

// BUZZER 
int buzzer = 8;

// POTENTIOMETER 
int pot = A0;


// NOTES 
#define E4 329
#define G4 392
#define B4 494
#define C5 510


// ==============================
// SETUP
// ==============================
void setup() {

  pinMode(b1, INPUT_PULLUP);
  pinMode(b2, INPUT_PULLUP);
  pinMode(b3, INPUT_PULLUP);
  pinMode(b4, INPUT_PULLUP);

  pinMode(buzzer, OUTPUT);
}


// ==============================
// LOOP
// ==============================
void loop() {

  int potValue = analogRead(pot);

  // HIGH / LOW pitch mode
  bool highPitch = potValue > 512;

  float multiplier;

  if (highPitch) {
    multiplier = 1.3; // slightly higher pitch
  } else {
    multiplier = 0.85; // slightly lower pitch
  }

  if (digitalRead(b1) == LOW) {
    play(E4, multiplier);
  }

  else if (digitalRead(b2) == LOW) {
    play(G4, multiplier);
  }

  else if (digitalRead(b3) == LOW) {
    play(B4, multiplier);
  }

  else if (digitalRead(b4) == LOW) {
    play(C5, multiplier);
  }

  else {
    noTone(buzzer);
  }
}


// ==============================
// FUNCTION
// ==============================
void play(int note, float mult) {
  tone(buzzer, note * mult);
}

Thing That I’m Proud Of

One part of the project I am especially proud of is how I used the potentiometer to control the pitch. This idea allowed me to overcome the limitation of having only four buttons. Initially, I tried pressing multiple buttons at once to create different sounds, but it did not work as expected. Then I realized I could use the potentiometer to dynamically change the pitch, which was a much more effective solution. I am also proud of the overall design of my mini music pad, as it is intuitive to use and much cleaner than my earlier versions, where the wires were more disorganized.

// HIGH / LOW pitch mode
  bool highPitch = potValue > 512;

  float multiplier;

  if (highPitch) {
    multiplier = 1.3; // slightly higher pitch
  } else {
    multiplier = 0.85; // slightly lower pitch
  }

Overall Reflection

Overall, I really enjoyed this project. It allowed me to combine something personal, like my love for Harry Potter and music, with technical skills such as coding and circuit design. The process involved a lot of experimentation and problem-solving, especially when trying to match the melody. This project also made me feel nostalgic, since the song reminds me of my childhood. I am very happy with the final result and how I was able to turn a simple Arduino setup into an interactive musical experience.

SCHEMATIC

VIDEO

Reading Reflections

Reading A Brief Rant on the Future of Interaction Design and the Response honestly changed the way I see technology in a way I did not expect at all. I agree with the author, but what surprised me the most is that I had never even realized this was a problem in the first place. It is not that our devices are bad, but more that they are limiting us from using our full potential, especially when it comes to how we physically interact with the world.

One thing that really stuck with me was when I started thinking about the idea of using devices with your eyes closed. I asked myself what I could actually do like that, and the only thing I could come up with was typing on my laptop keyboard. And then I realized that typing is one of the only truly tactile interactions we still have, and it is not even part of the screen itself. Everything else, especially touchscreens, feels like just sliding your finger on glass with almost no physical feedback. The reading describes this as “Pictures Under Glass,” and I think that is such a perfect way to put it, because it really does feel disconnected from what you are doing.

It also made me think about why we keep simplifying technology more and more. At first it seems like progress, because everything becomes easier and more accessible, but at the same time, it feels like we are reducing the way we interact with the world to something very basic, almost like we are being treated as toddlers. And that idea really stayed with me, because I had never questioned it before. I never thought that maybe we actually deserve more complex and richer ways of interacting, instead of everything being reduced to tapping and swiping.

I also kept thinking about the comparison between the real world and digital interfaces. In real life, our hands are constantly feeling, adjusting, reacting. The reading gives examples like holding a book or a glass and understanding things like weight and position without even thinking about it. That made me realize how much information we are losing when everything becomes flat and two dimensional. It made me wonder if we are actually moving forward or backward by making everything more and more screen based.

At the same time, I thought about things like movie theaters. It took so long for us to even be able to record and display images, but now we have 3D, 4D, and experiences where you can feel water or heat from what is happening on screen. That feels like a step toward engaging more of our senses. But then I started thinking, what if we did not need glasses to see in 3D, or what if devices could actually communicate through touch in a more real way? Something closer to real life, like materials that change shape or give feedback. That is kind of what the author is pushing for with the idea of a “dynamic medium that we can see, feel, and manipulate.”

At some point, though, I also started questioning how far this can really go. If we keep trying to make technology more and more like real life, are we just trying to recreate reality itself? Because the real world is already the most advanced “interface” we have. So it made me think about where the limit is, and whether the goal should be to replicate reality or to create something entirely new.

Overall, this reading really opened my mind. It made me realize that interaction design is not just about making things look nice or easy to use, but about deeply understanding human capabilities and not ignoring them. I had never questioned touchscreens before, but now I cannot stop thinking about how much more is possible and how much we might be missing out on by staying with what we have.

Assignment 11: Dial up the Tune

“It’s a pity to shoot the pianist when the piano is out of tune.” – Rene Coty

Concept:

Soo, when it comes to instruments, I thought right, let’s make a piano. Now due to the limitations from the Arduino Breadboard, I couldn’t make it so all of it the frequencies are in tune, whether they’re lower or higher. So I needed to think of a way how to make it so all of the frequencies could be represented on the project. That’s where our lovely, potentiometer comes into play.

Check the Tinkercad out here!

Sketch:

Digital Circuit:

How it’s made:

Now for the design, I went with having the buttons in a line with each of them being connected to the digital input of the Arduino Uno. After adding to each a resistor, alongside a connection to the power, they were ready to go. Then we have a Piezo that is connected to the side and acts as our output for sound, or specifically frequencies.

But the special thing is our so called dial, represented by the Potentiometer. He is connected as an analog input and will serve the user as while it is rotated, the frequency will be increased or decreased. I will be honest, I actually had an issue intially with the Piezo constantly playing sound, but I figuered it out later after seeing that the resistors weren’t connected properly (always good to check this in case of any errors)

Highlighted bit of Code I’m proud of:

Now after that it was time to put it all together. The code itself is quite simple as we have read functions to take in our defined input. But what was interesting is trying to get it so each button having a different pitch. It was done by having the potentiometer’s value added on to a constant value which increases with each button. This gave way for the user to increase the pitch and then, always, it will be added to a specific constant which will give the sesne of a piano.

//potent variable is dependent on where the user slides the potentiometer
if (s1 == 1){
tone(buzzer, potent + 100, 100);
} 
else if (s2 == 1){
tone(buzzer, potent + 200, 100);
}
else if (s3 == 1){
tone(buzzer, potent + 300, 100);
} 
else if (s4 == 1){
tone(buzzer, potent + 400, 100);
} 
else if (s5 == 1){
tone(buzzer, potent + 500, 100);
} 
else if (s6 == 1){
tone(buzzer, potent + 600, 100);
} 
else if (s7 == 1){
tone(buzzer, potent + 700, 100); 
}

Reflection

I’m happy with this design and even using the Piezo for the first time was fun. I will be honest my ears didn’t like it as much but we got through it haha. I think an extension is to make it so you could have some sort of keyboard input or even make original songs with it. I saw some interesting ideas of how by getting specific frequencies in a loop, you could make a song which I’d love to experiement with this for my final project.

Full Code:

//Declaring every button to it's assgined digital value
int tone1 = 12;
int tone2 = 11;
int tone3 = 10;
int tone4 = 9;
int tone5 = 8;
int tone6 = 7;
int tone7 = 6;

//And here declaring the Piezo at Digital 13
int buzzer = 13;

void setup ()
{
  
//Starting up the Serial Connection on Arduino
  Serial.begin(9600);
  
//Making all of the buttons take in our Input 
  pinMode(tone1,INPUT);
  pinMode(tone2,INPUT);
  pinMode(tone3,INPUT);
  pinMode(tone4,INPUT);
  pinMode(tone5,INPUT);
  pinMode(tone6,INPUT);
  pinMode(tone7,INPUT);
  
//Making the buzzer as our output  
  pinMode(buzzer,OUTPUT);
}

void loop () 
{
  
//Defining a variable which is the value of the potentiometer
  int potent = analogRead(0);
  
//Outputing the value in the console
  Serial.println(potent); 
  
//Reading a value for each pin
  int s1 = digitalRead(tone1);
  int s2 = digitalRead(tone2);
  int s3 = digitalRead(tone3);
  int s4 = digitalRead(tone4);
  int s5 = digitalRead(tone5);
  int s6 = digitalRead(tone6);
  int s7 = digitalRead(tone7);

//If else conditions where, when the button is on, it will output a sound
//potent variable is dependent on where the user slides the potentiometer
  if (s1 == 1){
  tone(buzzer, potent + 100, 100);
  } 
  	else if (s2 == 1){
  tone(buzzer, potent + 200, 100);
  }
  	else if (s3 == 1){
  tone(buzzer, potent + 300, 100);
  } 
  	else if (s4 == 1){
  tone(buzzer, potent + 400, 100);
  } 
  	else if (s5 == 1){
  tone(buzzer, potent + 500, 100);
  } 
  	else if (s6 == 1){
  tone(buzzer, potent + 600, 100);
  } 
  	else if (s7 == 1){
  tone(buzzer, potent + 700, 100); 
  } 

//Just to give a short delay between presses
  delay(10);
  
}

 

 

Week 11 – Production Assignment

Your concept

For this assignment, I wanted to explore the switch that comes with our kit. Till now, I had only used the buttons as a digital sensor, and I wanted something that can allow the user to turn on/off the buzzer without needing to press on it continuously. I also wanted to use the potentiometer to explore how I can reduce and increase the volume of the buzzer.

Hence, the circuit I ended up with includes all these elements. I wasn’t sure how to go about making my own melodies, especially with no music experience. So I referred to this GitHub repo that included many popular songs, and then edited the melody to only play the chorus of Hymn for the Weekend by Coldplay.

Schematic & Circuit

Video: IMG_8249

Code
#include "pitches.h"

const int buzzerPin = 10;
const int switchPin = 2;

int switchState;

int melody[] = {
  NOTE_DS5, NOTE_D5, NOTE_DS5, NOTE_C5, REST,   
  NOTE_DS5, NOTE_D5, REST,
  NOTE_F5, NOTE_DS5, REST,
  NOTE_DS5, NOTE_D5, NOTE_DS5, NOTE_C5, REST,
  NOTE_DS5, NOTE_D5, REST,
  NOTE_F5, NOTE_DS5, REST,
  NOTE_DS5, NOTE_D5, NOTE_DS5, NOTE_C5, REST,
  NOTE_DS5, NOTE_D5, REST,
  NOTE_F5, NOTE_DS5, REST,
  NOTE_AS4, NOTE_C5, NOTE_AS5, NOTE_GS5, NOTE_G5, NOTE_G5,
};

int durations[] = {
  4, 4, 4, 2, 4,
  4, 2, 4,
  4, 2, 2,
  4, 4, 4, 2, 4,
  4, 2, 4,
  4, 2, 2,
  4, 4, 4, 2, 4,
  4, 2, 4,
  4, 2, 2,
  4, 4, 4, 2, 2, 1,
};

void setup() {
  pinMode(buzzerPin, OUTPUT);
  pinMode(switchPin, INPUT_PULLUP);
  pinMode(LED_BUILTIN, OUTPUT);
}

void loop() {
  
  switchState = digitalRead(switchPin);

  if (switchState == HIGH) {
    int size = sizeof(durations) / sizeof(int);

    for (int note = 0; note < size; note++) {
      // re-reads switch at every note
      switchState = digitalRead(switchPin);
      if (switchState == LOW) {
          noTone(buzzerPin);
          // digitalWrite(LED_BUILTIN, LOW); // used to debug
          break; // exit the loop immediately
    }

    // to calculate the note duration, take one second divided by the note type.
    int duration = 1000 / durations[note];
    tone(buzzerPin, melody[note], duration);

    // to distinguish the notes, set a minimum time between them.
    int pauseBetweenNotes = duration * 1.30;
    delay(pauseBetweenNotes);
    }
    // digitalWrite(LED_BUILTIN, HIGH);
  } 
  else if (switchState == LOW) {
    noTone(buzzerPin);
    // digitalWrite(LED_BUILTIN, LOW); 
  }

}
Code I’m proud of
if (switchState == HIGH) {
    int size = sizeof(durations) / sizeof(int);

    for (int note = 0; note < size; note++) {
      // re-reads switch at every note
      switchState = digitalRead(switchPin);
      if (switchState == LOW) {
          noTone(buzzerPin);
          // digitalWrite(LED_BUILTIN, LOW); // used to debug
          break; // exit the loop immediately
    }

I’m proud of this specific section of code as I was having trouble with ensuring that when the switch is in LOW state, the buzzer actually turns off. Initally, I didn’t have the code to check the switchState within the for loop for the notes. So, the buzzer would never stop (unless the switch was already on LOW in the start). Eventually, I figured out that I need to check the switchState between each note to check if the user has changed the switch.

“How this was made” section explaining how the code was made and sources of media assets

To understand how to use the switch and connect it in my breadboard, I referred to this video: https://youtu.be/0ZXYRU9KPG8?si=vtY1plmUuqMY7i48. Through this video, I also understood how to write the code so that I can have the buzzer be silent when the switchState is changed and vice versa.

For the melody and generating the music, I referred to https://projecthub.arduino.cc/tmekinyan/playing-popular-songs-with-arduino-and-a-buzzer-546f4a and the GitHub repo above for the specific song that I wanted. I only edited the melody to play just the chorus section sicne the whole song was a bit too long, and honestly, my favorite part of this song is the chorus.

Reflection and ideas for future work or improvements

One possible improvement I thought of after finishing my circuit was adding buttons to switch between songs. I guess like a mini radio station. I think this is probably feasible with buttons but that can be plan for another time.

Week 11 – Production Assignment (Air Piano)

Concept

The “Air Piano” is a musical instrument controlled using the distance from a sensor. I have always been fascinated by the distance sensors, using reflection of sound waves to calculate the distance of an object. I used the the HC-S04 sensor to detect the distance in this work as input for the instrument. I was inspired by the tone knob in electrical guitars which was discussed in class so I integrated it into my work. A potentiometer serves as my tone knob and its input is used to switch among 3 sound modes: Piano mode, Sci-Fi mode and Bass Mode. There are also different colored LEDS to show the user which mode is on. Red – Piano, Green – SciFi and Blue – Bass mode. The mode determines the scale of frequency produced by the buzzer. The coding behind this project was to map the distance of an object from the sensor to a value from 0 to 7 (8 values) and these values each correspond to a specific note.

Sketch

Image

Code

// A0 - Potentiometer
// 2 - Blue
// 4 - Green
// 7 - Red
// 12 - Buzzer 

const int trigPin = 10;
const int echoPin = 9;

// Mode 1 - Piano Scale
int mode1[8] = {262, 294, 330, 349, 392, 440, 494, 523};

// Mode 2 - Sci-Fi
int mode2[8] = {600, 750, 900, 1100, 1400, 1800, 2300, 3000};

// Mode 3 - Higher Bass / Bright Low Mode
int mode3[8] = {350, 420, 500, 600, 720, 850, 1000, 1200};

float duration;
int distance;

void setup() {
  pinMode(trigPin, OUTPUT);
  pinMode(echoPin, INPUT);
  pinMode(2, OUTPUT);
  pinMode(4, OUTPUT);
  pinMode(7, OUTPUT);
  pinMode(12, OUTPUT);

  Serial.begin(9600);
  digitalWrite(2, HIGH);
  digitalWrite(4, HIGH);
  digitalWrite(7, HIGH);
  delay(1000);

  digitalWrite(2, LOW);
  digitalWrite(4, LOW);
  digitalWrite(7, LOW);
}

void loop() {
  digitalWrite(trigPin, LOW);
  delayMicroseconds(2);
  digitalWrite(trigPin, HIGH);
  delayMicroseconds(10);
  digitalWrite(trigPin, LOW);
  int mode;

  int pm = analogRead(A0);

  duration = pulseIn(echoPin, HIGH);
  distance = (duration*0.0343)/2;

  Serial.print("Distance: ");
  Serial.println(distance);
  delay(100);

  if (pm >= 700) {
    mode = 0;
    digitalWrite(7, HIGH);
    digitalWrite(2, LOW);
    digitalWrite(4, LOW);
  } else if (pm >= 350) {
    mode = 1;
    digitalWrite(4, HIGH);
    digitalWrite(7, LOW);
    digitalWrite(2, LOW);
  } else {
    mode = 2;
    digitalWrite(2, HIGH);
    digitalWrite(4, LOW);
    digitalWrite(7, LOW);
  }

  if (distance >= 0 && distance <= 40) {

    int noteIndex = map(distance, 0, 40, 0, 7);
    int freq;

    if (mode == 0) freq = mode1[noteIndex];
    if (mode == 1) freq = mode2[noteIndex];
    if (mode == 2) freq = mode3[noteIndex];

    tone(12, freq);
  }
  else {
    noTone(12);
  }

  //delay(50);
}

 

 

How it was made

This work was made by first drawing the sketch of the circuit. The inputs are the resistance value of the potentiometer and the distance from the distance sensor. I had to watch a video and use the ardruino website to figure out how to configure the distance sensor. The output of the circuit are 3 LEDs and a buzzer. The LEDs where connected to digital pins, a resistor and ground. The buzzer was connected to a digital pin and ground. In the coding of the instrument, I used ChatGPT to generate an array of frequencies corresponding to the modes. I connected all the wires and components according to the sketch.

Reflection

Being someone with no knowledge in music, I thought this work will be very difficult for me but after I figured out the input and output of the program, it went quite smoothly. To improve the project, a more sensitive distance sensor can be used to improve the readings of the sensor and more modes with different frequencies can be added to create more musical effects.

Week 11 Assignment – Zere

Concept

The concept of my project is to create a light-controlled musical instrument using Arduino. Instead of buttons or keys, the player controls pitch by covering or exposing a photoresistor to light, like waving your hand over it. A pushbutton switches between a low octave and a high octave, making the instrument feel expressive and playful. I wanted the interaction to feel unusual and fun, more like a theremin than a traditional instrument.

const int LDR_PIN = A0;
const int BTN_PIN = 2;
const int BUZZ_PIN = 8;

void setup() {
  pinMode(BTN_PIN, INPUT_PULLUP);
}

void loop() {
  int lightVal = analogRead(LDR_PIN);
  int btnState = digitalRead(BTN_PIN);

  int freq;
  if (btnState == LOW) {
    freq = map(lightVal, 0, 1023, 500, 2000);
  } else {
    freq = map(lightVal, 0, 1023, 100, 500);
  }

  tone(BUZZ_PIN, freq);
  delay(10);
}

I started by placing a photoresistor on the breadboard with a 10kΩ resistor forming a voltage divider, which lets the Arduino read changing light levels through A0. At first the buzzer played the same tone constantly, later I discovered through the serial monitor that A0 was reading 1023 the whole time, which meant that the resistor was not properly connected to the photoresistor. Once I fixed that, the pitch started responding to light.

What I’m proud of

The part I’m most proud of is figuring out the button wiring. This was incredibly frustrating, as I spent a long time confused about which legs of the button connect internally, which pins on the Arduino were digital versus analog, and why the signal kept reading the wrong values. I watched a YouTube tutorial to better understand how the process, it was quite challenging to be honest. https://www.youtube.com/watch?v=gj-H_agfd6U

What I can do better next time

Next time, I want to map the light values to specific musical notes rather than continuous frequencies, so it sounds more like a real scale than a smooth slide between pitches. I could also add an LED that lights up when the button is pressed for visual feedback, or use multiple photoresistors to create distinct pitch-control zones. I could also arrange the wires more neatly next time.

This is the video of me testing the sound: IMG_2491

 

Week 11 Assignment

Concept

The concept of my project is to create a simple electronic musical instrument using Arduino. I wanted to turn basic components like a button and a potentiometer into something interactive and expressive. The button works like a “play key,” while the potentiometer controls the pitch of the sound. By combining these elements, the user can actively “play” the instrument instead of just hearing a fixed sound. I also added a second button to switch between low and high pitch modes, which makes the instrument feel more dynamic and closer to a real musical device.

How I Made This

int playButtonPin = 2;
int modeButtonPin = 3;
int buzzerPin = 8;
int ledPin = 6;
int potPin = A0;

int lowNotes[]  = {262, 294, 330, 349, 392, 440, 494, 523};   // C4 到 C5
int highNotes[] = {523, 587, 659, 698, 784, 880, 988, 1047};  // C5 到 C6

bool highMode = false;
int lastModeButtonState = LOW;

void setup() {
  pinMode(playButtonPin, INPUT);
  pinMode(modeButtonPin, INPUT);
  pinMode(buzzerPin, OUTPUT);
  pinMode(ledPin, OUTPUT);
  Serial.begin(9600);
}

void loop() {
  int playButtonState = digitalRead(playButtonPin);
  int modeButtonState = digitalRead(modeButtonPin);
  int potValue = analogRead(potPin);

  int noteIndex = map(potValue, 0, 1023, 0, 7);

  // detect second button:change mode
  if (modeButtonState == HIGH && lastModeButtonState == LOW) {
    highMode = !highMode;
    delay(200); // 
  }
  lastModeButtonState = modeButtonState;

  int frequency;
  if (highMode) {
    frequency = highNotes[noteIndex];
  } else {
    frequency = lowNotes[noteIndex];
  }

  if (playButtonState == HIGH) {
    tone(buzzerPin, frequency);
    digitalWrite(ledPin, HIGH);
  } else {
    noTone(buzzerPin);
    digitalWrite(ledPin, LOW);
  }

  Serial.print("Mode: ");
  if (highMode) {
    Serial.print("HIGH");
  } else {
    Serial.print("LOW");
  }

  Serial.print("  Note index: ");
  Serial.print(noteIndex);
  Serial.print("  Frequency: ");
  Serial.println(frequency);

  delay(10);
}

 

I started by building a very basic circuit with a buzzer, a button, and a potentiometer. At first, the buzzer only made continuous sounds, which didnot feel like music. Then I modified the code so that the potentiometer controls discrete notes instead of continuous frequencies. This made the sound more like a real scale (Do, Re, Mi).

After that, I added a second button to switch between two sets of notes (low and high pitch). This required both wiring changes and updating the code logic to detect button presses and toggle modes. I also added an LED that lights up when the instrument is being played, which gives visual feedback and makes the interaction clearer.

Throughout the process, I tested each part step by step instead of building everything at once. This helped me identify problems more easily and understand how each component works.

What I’m Proud Of

The part I’m most proud of is how I figured out the mistakes with the buttons. At the beginning, my buttons did not work correctly at all. Sometimes the sound would play randomly, and sometimes pressing the button did nothing. I realized later that I misunderstood how the button pins (1A, 2A, etc.) are connected internally, and I also forgot to use the resistor properly.

After debugging, I learned that the button needs to cross the middle gap on the breadboard and that I must connect a pull-down resistor to stabilize the signal. Fixing this problem made everything work correctly, and it was a moment where I felt I really understood the circuit instead of just following instructions. This experience helped me become more confident in troubleshooting hardware problems.

What I Can Do Better Next Time

Next time, I think I can improve both the design and the interaction of my project. Right now, the instrument is still quite simple, and the sound is limited to basic tones. I could improve this by adding more buttons to create a small keyboard or by programming simple melodies.

I also want to make the interaction more intuitive. For example, I could use a light sensor to control pitch instead of a potentiometer, which would make the instrument feel more creative and less mechanical. Another improvement would be organizing the wiring more clearly, because my current circuit is a bit messy and hard to read.

Overall, this project helped me understand both coding and circuit design better, but I think there is still a lot of space to make it more expressive and closer to a real musical instrument.

Reading reflection

After reading both the essay and the responses, one clear idea is the difference between what interaction design could be vs what it is now. Bret Victor wants computers to help people think and understand, not just click buttons. This made me reflect that many of my own projects are still very basic—more like reactions, not real thinking tools.

Another important thought is about making things visible. He argues that systems should show how they work instead of hiding everything. This connects to learning. When I can see changes directly, I understand faster. So interaction design is not only about design, but also about how people learn.

However, the responses made me question his ideas. Some people say his vision is too idealistic and hard to apply in real life. Real systems have limits, and not all users want to explore deeply. Sometimes people just want things to be fast and simple. So his ideas may work better for learning tools, not everyday apps.

It also made me think about the role of the designer. Instead of controlling everything, the designer creates a system where users explore by themselves. This is similar to interactive art, but it also means less control over the final experience.

Overall, these readings made me see interaction design as more than coding. It is about how people think, understand, and interact with systems, but also about balancing ideal ideas with real-world limits.

Week 11- Reading Response

A Brief Rant on the Future of Interaction Design

The author emphasizes that human capabilities are important when thinking about designing the future. I have to agree with this part, especially when he mentioned that humans have hundreds of degrees of freedom, which reminds me of my robotics class—our professor highlighted that robotics takes a lot from human nature, like the robotic 3 degrees of freedom (DOF) arm. So, when designing things, we can make use of human capabilities.

But this is not what the author meant; he wanted designs to make use of our already existing capabilities to interact with them. As he mentioned, a hammer’s grip is meant for a human hand. However, when it comes to the future of interactive design and technology, I have to disagree that interacting with it should require using my full human body, because not everyone is able-bodied. Technology has to be accessible to everyone—isn’t that why we have it? To provide access to more things in a more effective, optimized way?

Making mobile phone calls rather than using a phone booth, reading or listening to books and articles anywhere, anytime—before having interactive design at my fingertips, I would not be able to type on a computer; I would have to go to a bookstore and have a professional typewriter write this reading response out. Sometimes, it takes writing things out to realize how truly blessed we are to have these types of things right at our fingertips.

Then, we can adapt this technology to be used by everyone. I also want to mention that I agree that using the full immersive experience with the human body is much more entertaining and fun. So, it depends on the end-use product or idea. I do not think the author is biased, but I think the author should cover different cases where this is not necessary or makes things harder for some people. I do not think the author changed my mind, but it opened me up to more ideas and thoughts on how to truly design good products that try to include everyone. An example of an incredible inclusive interactive design is the Meta Quest 3 and 3S VR headset, which has an option to play while seated, adjust the distance between the eyes, and even add a glasses prescription. If you do not want to pay extra or share it with family members, it also has space to fit your own glasses.

I had a few questions throughout, but I eventually answered them myself by writing my thoughts out, such as: “Technology has to be accessible to everyone—isn’t that why we have it? To provide access to more things in a more effective, optimized way?” Another question I had was: isn’t a good designer someone who considers different cases to make the product or design as effective as possible?

 

A follow-up article

I thought the author might cover some of the questions and respond to thoughts similar to mine, but he did not. He seemed to express some dislike for “waving hands in the air” when it comes to manipulating things, because you cannot feel what you are manipulating. From an improvement point of view, I agree that this would be beneficial. However, I believe that if researchers were to receive funding for it, it would mainly come from the medical field, to help people with loss of sensation, such as from neuropathy, stroke, or spinal cord injury.

There are mainly two types of gloves; the type depends entirely on whether the goal is therapeutic improvement (relearning sensation) or sensory substitution (using technology to mimic touch), which I believe could later be used in games. It reminds me of audiobooks, which were initially made to assist people with hearing or reading difficulties in accessing information from books, but nowadays are used by a much larger audience—busy parents, people with demanding work schedules, kinesthetic learners, and many more.

A lot of the time, these types of research efforts end up helping a larger group of people than initially predicted. I believe that designers should make good use of what we have, while researchers should continue to expand on what we need and what we already know.

 

Arduino/Tinkercad (2)

Create Your Rhythm

Concept:
During class when Professor Mang was explaining the homework for Tuesday, my younger brother was actually sitting next to me and watching nursery rhymes (to be specific he was watching Mary had a little lamb) which I found funny because I then started to think about the project and different elements related. I also remember having a small toy piano (I had the one that looked like the piano and the one that looked like the toy) so then I started to wonder if I could create the keys and make my own music and to maybe try creating the same sounds for Mary had a little lamb.
I was able to create the song! and not just for Mary had a little lamb but also just experimenting with the notes to create my music! (3-2-1-2 (Ma-ry had a) 3-3-3 (lit-tle lamb) 2-2-2 (lit-tle lamb) 3-3-3 (lit-tle lamb) 3-2-1-2 (Ma-ry had a) 3-3-3-3 (lit-tle lamb whose) 2-2-3-2 (fleece was white as) 1 (snow)!!!!)

Hand-drawn schematic:

How this was made:
I used the tips from Professor Mang, he also advised us to use a ruler which is something I didn’t do last time but honestly compared to my first schematic this is so easy to read -my first one not that organized. Also I always like doing the schematics as I go then I do a final neat and organized one so I can easily look back at it.

Image: (Link)

How this was made:

First I duplicated my last project because I think it’s easier to just edit instead of start brand new. I just changed the LED lights, removed them, and added the piezo and connected the positive side (h7) to pin ~9 with a green wire I used Pin ~9 because like we learned in class it is a PWM pin that can handle the pulses and in my case its needed to create different sound frequencies. Then the negative side of the piezo (h2) to (-) connected with a black wire to GND. After I made sure GND is connected to (-) and 5V is connected to (+) I was able to focus on the buttons and add 4 different buttons (Button 1 plays Note C, Button 2 plays Note D, Button 3 plays Note E, and Button 4 plays Note F). I placed the buttons in a row across the middle of the board with the legs in columns g and e. Each button has one side connected to the negative rail with a black wire and the other side connected to its specific digital pin (4, 5, 6, or 7) with a green wire. I also decided to line them up this way to create something similar to a real piano keyboard. For the last part I just moved the potentiometer because I needed more space for the four buttons and they follow the similar position of my last project.

Code:

// C++ code
//
void setup() {
  pinMode(9, OUTPUT); // the piezo speaker
  
  // setting up all the buttons
  pinMode(4, INPUT_PULLUP); //Button 1=Note C
  pinMode(5, INPUT_PULLUP); //Button 2=Note D
  pinMode(6, INPUT_PULLUP); //Button 3=Note E
  pinMode(7, INPUT_PULLUP); //Button 4=Note F
}

void loop() {
  int sensor = analogRead(A0);
  int multi = map(sensor, 0, 1023, 1, 4); //when the dial is changed the sound does too

  //when button is pressed and the dial is changed then the notes are multiplied=higher pitch
  if (digitalRead(4) == LOW) {
    tone(9, 262 * multi); //C=262
  } 
  else if (digitalRead(5) == LOW) {
    tone(9, 294 * multi); //D=294
  } 
  else if (digitalRead(6) == LOW) {
    tone(9, 330 * multi); //E=330
  } 
  else if (digitalRead(7) == LOW) {
    tone(9, 349 * multi); //F=349
  } 
  else {
    noTone(9); //when nothing is pressed there is no sound
  }

  delay(10); //10 mil.sec. delay
}

 

How this was made:

For my code, in the setup first I highlighted pin 9 because thats for the Piezo -my speaker. Then I set up pins 4, 5, 6, and 7 for my buttons while using INPUT_PULLUP so I wouldn’t have add any extra resistors or wires on the breadboard since I can easily use tinkercad’s built-in resistors. Then I created a loop and used analogRead(A0) to first check the sensors and then inside because the dial gives a number from 0 to 1023, I used the map function (which I learned from ARDUINODOCS) to change that number into a small number that goes from 1 and 4. I called this variable multi (short for multiply) which allows me to change the pitch higher just by turning the dial. For the music I used the if/else structure which I am familiar with from p5js and because I wanted to create keys I followed the notes so button 1=262 a C note and it goes on (of course I checked the music notes to do this). And then based on each dial as it increases the numbers also increase by multiplication. I basically ended the code with else noTone(9) (for the tone function) so when the button is not pressed there is no sound coming from the Piezo and like always a 10ms delay at the bottom just to keep the loop from running too fast and making the sound glitchy.

Resources:

Reflection and future improvements:
Honestly, I’m super proud of what I created. Like always, the first time is confusing, complicated, and annoying but comparing myself to when I first did those tutorials to now creating my own rhythm, I’m so happy with how this turned out! I was actually playing it out loud for my siblings too. Overall, I think creating something in different formats while keeping it creative, personal, and fun is always something I look forward to doing. When it comes to the piano and my personal connection to it, honestly I think younger Moza would be so proud and amazed to see that I actually made those keys and notes using code and Arduino(tinkercad), because that’s just so cool! For future improvements, I think I did really well (fun fact: I actually created two projects: the first was simple, but for this one, I pushed myself to see what else I could do!) In the future, I want to experiment even more and keep pushing my limits. 🙂