Pi : Week 11 Reading – The Feel Factor: Escaping the Flatland of Modern Interfaces

Whenever I do the Interactive Media reading assignments, I almost always disagree or criticize the author, or make fun of their claims. But this week will be different. Bret Victor is one of the only two people I idolized when I was a child and one day hope to be like. Whatever those two men (the childhood heroes) say, I will always agree with them 😉 .

I work in the field of haptics – the science of touch. My supervisor once explained that when a human uses a particular tool for long, he becomes too much accustomed to that tool. For example, think of the carpenters, painters, guitarists, etc.

This continues to the extent that the tool becomes a part of his body, and his means to sense the world.

But in order for that tool to become an extension of his body, the tool must give the user “good tangible feedback.” And that kind of feedback is something digital devices truly lack. Try using an actual ruler to measure the length of something… Now try measuring the same distance using the measurement app in the iPad, which is technically intricate, but very cumbersome to use. It just does not feel like a ruler.

For one of my personal projects, I draw circuit diagrams with Chinese traditional ink on rice paper—to imagine an alternate universe, where electricity and the industrial revolution have started from the Orient.

In this project, I tried and evaluated two methods: the iPad method and the literal ink method. Somebody whose eyes are not trained will tell you that the results are nearly the same. Thu,  in reality, both methods work. However, for my artistic satisfaction, the iPad approach was a disaster. Though I am using a state of the art Chinese brush simulator, I could not feel the resistance of the paper, the ink was flowing, the brush was scratching the paper, and so on, ad infinitum.

The approach towards the iPad was simply soulless. Thus, Bret’s vision—or better said, his criticism on the lack of vision in the current design trends—had a deep echo with my experiences. “Our hands feel things and our hands manipulate things. Why shoot for anything less than a dynamic medium that we can see, feel, and manipulate?” This should be written on the wall of each tech company urging to birth the next iteration of soulless gadgets into existence.

No manner of me waving a stylus around is going to recreate the sensory feedback of ink travelling down to paper through my ink brush.

In short, the iPad stylus will never become an extension to my body, like the real paintbrush does.

“Hands feel things, and hands manipulate things,” Bret points out ; I couldn’t but smile to see that most modern designs spectacularly reject this in a fashion way over the top.

I really love Bret’s equivalent of the whole “Pictures Under Glass” idea to how utterly ridiculous it would have been if someone had once said, “black-and-white is the future of photography.”

In conclusion, Bret’s rant isn’t just a criticism; it’s a roadmap for future innovators.

Bret did not give us a solution, but a question to ponder. This question alone should challenge us to look for something beyond the conventional in thinking about how we make our interactions with technology as instinctive as moving our limbs, as natural as using your hands.

Week 10 Response – Tom Igoe

Tom Igoe’s articles on physical computing and interactive art describe the growing relationship between technology and user engagement. In Physical Computing’s Greatest Hits (and Misses), Igoe talks about the relationship between creativity and technology, highlighting how simple designs can provoke complex interactions and reflections. Additionally, in Making Interactive Art: Set the Stage, Then Shut Up and Listen, he advocates for a minimalistic approach in guiding the audience’s experience by using the art of subtlety in interactive design.

Igoe’s philosophy resonates deeply with me; it challenges the beauty of discovery within the constraints of design and technology, reminding creators to trust their audience’s intuitive interactions with their work. .

Week 10 Assignment – “Who’s First?”

For this assignment, I had a hard time coming up with a creative idea. My twin nephews were over at the time, and I could hear them arguing about something. When I checked up on them, they were fighting over whoever was faster than the other, so I decided to make something to settle that (Love you, Ahmed and Jassim).

The concept is pretty simple:

It’s a two-player game. One player gets the photoreceptor, and the other gets the button. Whoever can cause their light to flash first proves that they’re faster than the other.

Materials Used:

  • 2x 330 resistors
  • 2x 10k resistors
  • 8x wires
  • 2x LEDs (one Red, one Yellow)
  • 1x button
  • 1x photoresistor

Setup:

I used examples from previous classes to piggyback on. The slides were very helpful to me.

The website I used will NOT be used again. Although I faced many problems with the resistors, it got the job done.


Code:

 

int photoSensorPin = A1;
int buttonPin = 2;
int ledPin1 = 3;
int ledPin2 = 4;
void setup() {
  pinMode(photoSensorPin, INPUT);
  pinMode(buttonPin, INPUT);
  pinMode(ledPin1, OUTPUT);
  pinMode(ledPin2, OUTPUT);
}
void loop() {
  int sensorValue = analogRead(photoSensorPin);
  int buttonState = digitalRead(buttonPin);
  if (buttonState == HIGH) {
    digitalWrite(ledPin1, LOW);
    digitalWrite(ledPin2, HIGH);
  } else if (sensorValue < 450) {
    digitalWrite(ledPin1, HIGH);
    digitalWrite(ledPin2, LOW);
  } else {
    digitalWrite(ledPin1, LOW);
    digitalWrite(ledPin2, LOW);
  }
}

 

Demo:

IMG_0577

Reflection:

Making this game was a pretty fun challenge for me. This language is very new to me, and I’m still having issues getting used to it. I would like to take this a step further and possibly use other forms of input devices to accurately guess who’s faster (Ahmed won BTW).

 

 

 

Raya Tabassum: Reading Response 5

Tom Igoe’s reflections on recurring themes in physical computing projects highlight a vibrant field where creativity and technology meet. He encourages embracing projects even if they seem “done” because each iteration can bring new insights and innovations. From theremin-like instruments, which challenge creators to add meaningful physical interactions, to gloves and video mirrors that mix simplicity with potential for deeper engagement, these themes showcase the dynamic range of physical computing. It’s a call to think differently about what might seem mundane or overdone and to find one’s voice within well-trodden paths. This deeper engagement with the familiar challenges us to discover the unseen potentials in everyday ideas.

The other article by him named “Making Interactive Art: Set the Stage, Then Shut Up and Listen,” highlights a fundamental shift required for artists transitioning into interactive art. He stresses the importance of allowing the audience to engage and interact with the artwork without preconceived notions influenced by the artist’s own explanations. This approach champions a more open-ended exploration where the viewer’s personal experience and interpretation are paramount. This concept connects seamlessly with his views in “Physical Computing’s Greatest Hits (and misses),” where he encourages embracing well-worn themes with fresh perspectives. Both writings emphasize the creative potential in letting go of control—whether it’s about reinterpreting common project themes or allowing interactive artworks to speak for themselves through audience interaction.

Raya Tabassum: Emotional Room Temperature Indicator

Concept: This project combines analog and digital inputs to control LEDs in an innovative way. It’s an “Emotional Room Temperature Indicator”, which uses temperature data and user input to reflect the room’s “mood” with light.

Components Used:

  • Arduino Uno
  • TMP36 Temperature Sensor (Analog Sensor)
  • Push-button switch (Digital Sensor)
  • Standard LED (Digital LED)
  • RGB LED (Analog LED)
  • 220-ohm resistors for LEDs
  • 10k-ohm resistor for the button switch
  • Breadboard
  • Jumper wires

Implementation: I made a reel with description and uploaded as a YouTube shorts embedded below:

Programming:

#define LED_PIN 3
#define BUTTON_PIN 7
int redPin = 9; 
int greenPin = 10; 
int bluePin = 11;
int sensor = A0;

byte lastButtonState = LOW;
byte ledState = LOW;

unsigned long debounceDuration = 50; // millis
unsigned long lastTimeButtonStateChanged = 0;

void setup() {
  pinMode(LED_PIN, OUTPUT);
  pinMode(BUTTON_PIN, INPUT);
  pinMode(redPin, OUTPUT); 
  pinMode(greenPin, OUTPUT); 
  pinMode(bluePin, OUTPUT); 
  pinMode(sensor, INPUT);  // Reading sensor data

  Serial.begin(9600);  // Initialize serial communication at 9600 bits per second
}

int givetemp() {
  int reading = analogRead(sensor);
  float voltage = reading * 5.0 / 1024.0;
  float temperatureC = (voltage - 0.5) * 100;
  Serial.print(voltage); 
  Serial.print(" volts  -  ");
  Serial.print(temperatureC); 
  Serial.println(" degrees C  -  ");
  return (int)temperatureC;  // Convert float temperature to int before returning
}

void loop() {
  int currentTemp = givetemp();  // Call once and use the result multiple times

  if (currentTemp >= 20 && currentTemp <= 30) {
    digitalWrite(greenPin, HIGH);
    digitalWrite(bluePin, LOW);
    digitalWrite(redPin, LOW);
  } else if (currentTemp < 20) {
    digitalWrite(greenPin, LOW);
    digitalWrite(bluePin, HIGH);
    digitalWrite(redPin, LOW);
  } else if (currentTemp > 30) {
    digitalWrite(greenPin, LOW);
    digitalWrite(bluePin, LOW);
    digitalWrite(redPin, HIGH);
  }

  if (millis() - lastTimeButtonStateChanged > debounceDuration) {
    byte buttonState = digitalRead(BUTTON_PIN);
    if (buttonState != lastButtonState) {
      lastTimeButtonStateChanged = millis();
      lastButtonState = buttonState;
      if (buttonState == HIGH) {  // Assumes active HIGH button
        ledState = !ledState;  // Toggle the state
        digitalWrite(LED_PIN, ledState);
      }
    }
  }
}

Actual temperature of the room:

The TMP36 senses the room temperature. Depending on the “comfort” range (set here as 20°C to 30°C), the RGB LED changes colors — blue for cool, red for hot, and green for just right.
The push-button allows the user to set the mood of the room. When pressed, the standard yellow LED lights up to acknowledge that the room is at a comfortable temperature, while the RGB LED shows the current temperature-based mood of the room. The user can thus get immediate visual feedback on whether the room’s temperature is within a comfortable range or not.

Week #10 Assignment

Concept: 
For this assignment, I decided to implement the things that I have already learned in regards to the ultrasonic sensor and add the button. I wanted to see how far I can go with my knowledge.
Implementation:
The implementation was pretty easy, as I have used the previous assignment as an example. I just added the button and changed the code and voila!
End result:

Code:

//Intro to IM - Stefania Petre
// Define LED pins
int ledPin[3] = {8};

// Define Ultrasonic sensor pins
const int trigPin = 2; // or any other unused digital pin
const int echoPin = 3; // or any other unused digital pin

const int buttonPin = 13;
int buttonState = HIGH;
int lastButtonState = HIGH;
long lastDebounceTime = 0;
long debounceDelay = 50;
int pushCounter = 0;
int numberOfLED = 3;

void setup() {
  pinMode(buttonPin, INPUT);
  digitalWrite(buttonPin, HIGH); // Activate internal pull-up resistor
  
  // Set up LED pins
  for (int i = 0; i < numberOfLED; i++) {
    pinMode(ledPin[i], OUTPUT);
  }
  
  // Set up Ultrasonic sensor pins
  pinMode(trigPin, OUTPUT); // Sets the trigPin as an OUTPUT
  pinMode(echoPin, INPUT);  // Sets the echoPin as an INPUT
}

void loop() {
  int reading = digitalRead(buttonPin);

  // Check if the button state has changed
  if (reading != lastButtonState) {
    // Reset the debounce timer
    lastDebounceTime = millis();
  }

  // Check if the debounce delay has passed
  if ((millis() - lastDebounceTime) > debounceDelay) {
    // If the button state has changed, update the button state
    if (reading != buttonState) {
      buttonState = reading;

      // If the button state is LOW (pressed), increment pushCounter
      if (buttonState == LOW) {
        pushCounter++;
      }
    }
  }

  // Update the last button state
  lastButtonState = reading;

  // Turn off LED
  for (int i = 0; i < numberOfLED; i++) {
    digitalWrite(ledPin[i], LOW);
  }

  // Perform Ultrasonic sensor reading
  long duration, distance;
  digitalWrite(trigPin, LOW);
  delayMicroseconds(2);
  digitalWrite(trigPin, HIGH);
  delayMicroseconds(10);
  digitalWrite(trigPin, LOW);
  duration = pulseIn(echoPin, HIGH);
  distance = (duration * 0.0343) / 2; // Calculate distance in cm

  // Perform actions based on distance measured
  if (distance < 30) {
    // Turn on LED
    digitalWrite(ledPin[0], HIGH);
 

  // Delay before next iteration
  delay(100); // Adjust as needed
}

Comments:

Even though I got it to work, I still would have liked it to change colors depending on the distance from the sensor. I will try to implement that next time!

Week 10 Production Assignment – Tea Temperature

For this week’s production assignment I wanted to experiment with a component that I have not yet used. The one component I had in mind for this was the temperature sensor. As I enjoy drinking tea, I decided to implement a circuit which gauges the presence and temperature of a liquid.

In order to do this, I created a series of if statements that test the temperature read by the sensor. While the technical aspect of this was manageable, the practical side was challenging. This was due to the unreliability of the sensor as it would read fluctuating and incorrect temperatures. Despite this, I was able to get some successful examples by restarting the circuit (and therefore restarting the sensor’s input). This is seen in the example below. The if statements are included below as well.

const int rgbRED_PIN = 9;//the digital pin for red pin
const int rgbGREEN_PIN = 10;//the digital pin for green pin
const int rgbBLUE_PIN = 11;//the digital pin for blue pin
const int temperaturePin = 0;//the analog read pin that is used to reat the temperature 
const int waterPin = 12;  
const int greenLED_Pin = 13;
 
void setup()
{
 
  pinMode(rgbRED_PIN, OUTPUT);
  pinMode(rgbGREEN_PIN, OUTPUT);
  pinMode(rgbBLUE_PIN, OUTPUT);
  pinMode(waterPin, INPUT);
  pinMode(greenLED_Pin, OUTPUT);
  Serial.begin(9600);//the bound rate for serial monitor 
  
}
 
 
void loop()
{
 
   int waterDetected = digitalRead(waterPin);
     if (waterDetected == HIGH) {
    digitalWrite(greenLED_Pin, HIGH);
  } else {
    digitalWrite(greenLED_Pin, LOW);
  }

  float voltage, degreesC, degreesF;//get numbers with decimals 
 
  voltage = getVoltage(temperaturePin);//get voltage from the temperature pin
  degreesC = (voltage - 0.5) * 100.0;//calculate the celcius degree
  degreesF = degreesC * (9.0/5.0) + 32.0;// calculate the Fahrenheit degree
 
  Serial.print("voltage: ");//print volrage in serial monitor
  Serial.print(voltage);
  Serial.print("  deg C: ");//print the celcious degree in serial monitor
  Serial.println(degreesC);
 
 
  if (degreesC < 23) //if the temperature is less than 23 degrees C turn off RGB
  {
  // Off (all LEDs off):
    digitalWrite(rgbRED_PIN, LOW);
    digitalWrite(rgbGREEN_PIN, LOW);
    digitalWrite(rgbBLUE_PIN, LOW);
  }
 
  
if (degreesC >= 24)//if the temperature is larger than 24 degrees C show purple
  {
  digitalWrite(rgbRED_PIN, HIGH);
  digitalWrite(rgbGREEN_PIN, LOW);
  digitalWrite(rgbBLUE_PIN, HIGH);
  }
}
 
 
 
float getVoltage(int pin)//get voltage 
 
 {
  return (analogRead(pin) * 0.004882814);// conver 0 to 1023 value to 0 to 5 value (the true voltage)
 }

 

One point that I could not manage was the water detection aspect which I wanted to incorporate into this circuit. I attempted to do so by connecting alligator clips into a cup of water in order to complete the circuit. The LED would flicker occasionally but would not stay on consistently. I am unsure whether this is due to the connection of the alligator clips (other examples I have seen use regular wires) or because of the way I had wired the circuit itself.

Week 10 – Assignment

The project is designed as a competitive game using an Arduino board to determine who can activate their respective LED faster: a player pressing a button or an automated response triggered by a photoresistor detecting darkness. The setup includes two LEDs connected to the Arduino. One LED (connected to pin 10) is controlled by a pushbutton, which, when pressed, signifies the  player’s reaction. The other LED (connected to pin 9) is controlled by a photoresistor, representing an automated “player” that reacts to the absence of light. The game’s objective is to see which mechanism can activate its LED first under the given conditions—either when it becomes dark enough for the photoresistor to react or when the human player presses the button.

This was a lot of fun to make and the concept sort of formed as I put everything together, I mostly focused on using the class notes as a resources however I did use some of the examples on the official Arduino website. 

https://forum.arduino.cc/t/using-an-led-and-a-photoresistor-to-switch-itself-on-and-off/179690

https://projecthub.arduino.cc/agarwalkrishna3009/arduino-diy-led-control-with-ldr-sensor-photoresistor-fa011f

int photoSensorPin = A0;
int buttonPin = 2;
int ledPin1 = 9;
int ledPin2 = 10;

void setup() {
  pinMode(photoSensorPin, INPUT);
  pinMode(buttonPin, INPUT);
  pinMode(ledPin1, OUTPUT);
  pinMode(ledPin2, OUTPUT);
}

void loop() {
  int sensorValue = analogRead(photoSensorPin);
  int buttonState = digitalRead(buttonPin);

  if (buttonState == HIGH) {
    digitalWrite(ledPin1, LOW);
    digitalWrite(ledPin2, HIGH);
  } else if (sensorValue < 512) {
    digitalWrite(ledPin1, HIGH);
    digitalWrite(ledPin2, LOW);
  } else {
    digitalWrite(ledPin1, LOW);
    digitalWrite(ledPin2, LOW);
  }
}

 

 

Beep Beep, Stuck in Traffic!

For this weeks assignment, I chose a very corny heading (sorry for that) but at the same time I combined some of the reading work we have previously done and implemented into the assignment.

My Inspiration came from the car industry, which is something I mentioned in one of my previous reading assignments. Since we are working with lights I thought that it would be a good idea to mimic some of the headlights that I’ve seen on never cars.

The way this lights work are:

  • When the driver turns to the left, the corresponding light turns on
  • When the driver turns to the right, the corresponding light turns on
  • The lights dim (in a way that if the turn is sharper, the light would be brighter)

To mimic this I used a potentiometer as well as two lights(logically :). For a fun element, I also added a buzzer and a button that activates that buzzer like a car horn would.

Here is the code I used:

int potentiometer = A0;
const int led0 = 5;
const int led1 = 6;
const int buttonPin = 7;
int buttonRead = 0;
const int buzzerPin = 10;

void setup() {
  Serial.begin(9600);
  pinMode(led0, OUTPUT);
  pinMode(led1, OUTPUT);
  pinMode(buttonPin, INPUT);
  pinMode(buzzerPin, OUTPUT);
}

void loop() {
  buttonRead = digitalRead(buttonPin);
  Serial.println(buttonRead);
  int potentiometerValue = analogRead(potentiometer);
  int pwmValue1 = map(potentiometerValue, 0, 512, 255, 0); // Map potentiometer value for LED0
  int pwmValue2 = map(potentiometerValue, 513, 1023, 0, 255); // Map potentiometer value for LED1

  // Check if the button is pressed (buttonRead is HIGH)
  if (buttonRead == HIGH) {
    // Turn on the buzzer
    analogWrite(buzzerPin, HIGH);
  } else {
    // Turn off the buzzer
    analogWrite(buzzerPin, LOW);
  }

  if (potentiometerValue >= 0 && potentiometerValue <= 512) {
    analogWrite(led0, pwmValue1); // Dim LED0
    analogWrite(led1, 0); // Turn off LED1
  } else {
    analogWrite(led0, 0); // Turn off LED0
    analogWrite(led1, pwmValue2); // Dim LED1
  } 
}

Basically what the code does is it takes the potentiometer values, and maps them to the lights correspondigly. At the same time, the button turns the buzzer on and off.

Video demonstration:

 

Week 9 Assignment

For my project, I combined a light sensor and a button. The primary concept behind this project was to create an interactive system that responds to both room light levels and user input. The light sensor serves as the eyes of the circuit, detecting changes in the surrounding light environment, while the button enables direct user interaction. One of the main challenges I encountered during the development process was ensuring reliable and accurate responses with the light sensor, especially during the day when everything was lit up. I was thinking about some improvements for this project that could involve adding additional sensors for enhanced functionality, such as temperature or motion sensors, to broaden the range of environmental inputs the circuit can respond to. Overall, this project represents a stepping stone toward creating more sophisticated and responsive sensor-based systems for various applications. I would also work on my creativity in my next project since I was too focused on correcting this part.