Final Project Idea

As a kid I used to love playing the game “winterbells” on my aunt’s PC. For my final project, i want to recreate that nostalgic experience with a twist.

Instead of the conventional keyboard controls, I want to introduce a hands-on approach. Players will have a physical bunny, a soft toy, that becomes the controller for the bunny’s movements on the screen. I will use an ultrasonic sensor to allow the bunny’s physical position to dictate the virtual bunny’s movements. There will also be a switch to allow the bunny to jump at the start of the game.

Given the project deadline aligns with the festive season, I want to infuse the game with a stronger Christmas theme. Here’s a sketch of what I’ve envisioned:

I also think it would be really fun if i could give players an incentive at the showcase: collect more than a certain amount of virtual gifts within the game to get a special Christmas gift at the showcase 🙂

Week 11: 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

    let rVal = 0;
    let alpha = 255;
    let left = 0;
    let right = 0;
    
    
    function setup() {
      createCanvas(640, 360);
      noFill();
      //create an ellipse with x position changing and y (300) position constant 
    }
    
    function draw() {
      background(255);
      
      
    
      if (!serialActive) {
        fill(0)
        text("Press Space Bar to select Serial Port", 20, 30);
      } else {
        fill(0)
        text("Connected", 20, 30);
      }
      let xPos = 300;
      xPos = map(alpha, 0, 1023, 0,640);
      ellipse(xPos, 150, 50, 50);
    
      console.log(alpha);
    }
    
    function keyPressed() {
      if (key == " ") {
        // important to have in order to start the serial connection!!
        setUpSerial();
      }
    }

    For this question, we decided to create a simple ellipse that changes direction based on the values from the potentiometer.

  2. make something that controls the LED brightness from p5t
    function keyPressed() {
      if (key == " ") {
        // important to have in order to start the serial connection!!
        setUpSerial();
      }
      if (key== "1"){
        left = 50;
      }
      
      if (key== "2"){
        left = 100;
      }
      if (key== "3"){
        left = 255;
      }
      if (key =="4"){
        right = 50;
      }
      if (key =="5"){
        right = 100;
      }
      if (key =="6"){
        right =255;
      }
    }

    This one was pretty simple. Pressing the keys 1-6 increases/decreases the brightness of the left or right LED light. 1-3 correspond to the left, while 4-6 correspond to the right led.

  3. take the gravity wind example (https://editor.p5js.org/aaronsherwood/sketches/I7iQrNCul) 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.
let rVal = 0;
let alpha = 255;
let left = 0;
let right = 0;
let velocity;
let gravity;
let position;
let acceleration;
let wind;
let drag = 0.99;
let mass = 20;

function setup() {
  createCanvas(640, 360);
  noFill();
  position = createVector(width/2, 0);
  velocity = createVector(0,0);
  acceleration = createVector(0,0);
  gravity = createVector(0, 0.1*mass);
  wind = createVector(0,0);
}

function draw() {
  background(255);
  applyForce(wind);
  applyForce(gravity);
  velocity.add(acceleration);
  velocity.mult(drag);
  position.add(velocity);
  acceleration.mult(0);
  ellipse(position.x,position.y,mass,mass);
  if (position.y > height-mass/2) {
      velocity.y *= -0.9;  // A little dampening when hitting the bottom
      position.y = height-mass/2;
    
    }
  console.log(position.y);
  if(position.y >= 330){
    left = 1;
  }
  else if(position.y <= 330){
    left = 0;
  }
  console.log(rVal);
  wind.x = map(alpha, 0, 1023, -1, 1);
  

 

  if (!serialActive) {
    fill(0)
    text("Press Space Bar to select Serial Port", 20, 30);
  } else {
    fill(0)
    text("Connected", 20, 30);
  }
}
function applyForce(force){
  // Newton's 2nd law: F = M * A
  // or A = F / M
  let f = p5.Vector.div(force, mass);
  acceleration.add(f);
}

function keyPressed() {
  if (key == " ") {
    // important to have in order to start the serial connection!!
    setUpSerial();
  }
  if(key == "1"){
    left = 1;
  }
  
}

For changing the wind direction, we followed similar logic to the first question. The ball changes direction based on values mapped from the potentiometer.

 

Week 11: reading response

The shift in approaching disability, as outlined in the text, from a medical model to a social model is indeed intriguing and resonates with a more inclusive and human-centric perspective. The idea that disabilities are not solely medical conditions but are shaped by societal factors opens up new avenues for design solutions. I particularly find the example of eyewear transformation from a medical necessity to a key fashion accessory compelling. The shift from perceiving glasses merely as vision correction tools to considering them as items of clothing aligns with the social model. The recognition of the cultural and fashion aspects of eyewear challenges the conventional view of assistive devices, emphasizing the importance of societal perceptions.

However, I am somewhat uncertain about the notion that design for disability should seamlessly integrate with mainstream design. While collaboration and shared perspectives are undoubtedly valuable, there may be unique challenges and considerations specific to designing for disabilities that require specialized attention. It’s crucial to strike a balance between inclusive design practices and recognizing the distinct needs of individuals with disabilities. The risk of blending the two seamlessly lies in potentially overlooking the specific requirements and experiences of those with disabilities. Designing for disabilities might benefit from a dedicated focus to ensure that the resulting solutions genuinely address the challenges faced by the community.

Musical instrument

coNCEPT

Our initial idea was to create a piano using the ultrasonic sensor. However, after realising this idea was too mainstream and simple, we decided to create an instrument that can be fully played by 2 people since it involves using 3 hands.

Process

void loop() {
  // read the input on analog pin 0:
  int sensorValue1 = analogRead(A1);
  int sensorValue2 = analogRead(A2);
  int sensorValue3 = analogRead(A3);
  
  switchState = digitalRead(switchPin);

  if (switchState ==1){
    //sensor 1
    if(sensorValue1 > 500){
      currentState+=100;
    }
    else if (sensorValue1>250 && sensorValue1 < 500) {
      currentState+=10;
    }

    else if (sensorValue1 < 250){
      currentState+=1;
    }

    //sensor 2
    if(sensorValue2 > 500){
      currentState+=100;

    }
    else if (sensorValue2>250 && sensorValue2 < 500) {
      currentState+=10;

    }

    else if (sensorValue2 < 250){
      currentState+=1;
    }

    //sensor 3
    if(sensorValue3 > 500){
      currentState+=100;

    }
    else if (sensorValue3>250 && sensorValue3 < 500) {
      currentState+=10;
    }

    else if (sensorValue3 < 250){
      currentState+=1;
    }

  }
  else{
    //sensor 1
    if(sensorValue1 > 500){
      currentState+=100;
    }
    else if (sensorValue1>250 && sensorValue1 < 500) {
      currentState+=10;
    }

    else if (sensorValue1 < 250){
      currentState+=1;
    }

    //sensor 2
    if(sensorValue2 > 500){
      currentState+=100;

    }
    else if (sensorValue2>250 && sensorValue2 < 500) {
      currentState+=10;
    }

    else if (sensorValue2 < 250){
      currentState+=1;
    }

    //sensor 3
    if(sensorValue3 > 500){
      currentState+=100;
    }
    else if (sensorValue3>250 && sensorValue3 < 500) {
      currentState+=10;
    }

    else if (sensorValue3 < 250){
      currentState+=1;
    }
  }

if(switchState == 0){
  switch(currentState){
    case 3: //3 low
      tone(8, NOTE_B3, 250);
      delay(250*1.30);
      break;
    case 12: //2 low 1 mid
      tone(8, NOTE_C4, 250);
      delay(250*1.30);
      break;
    case 21: //2 mid 1 low
    tone(8, NOTE_D4, 250);
      delay(250*1.30);
      break;
    case 30:
    tone(8, NOTE_E4, 250);
      delay(250*1.30);
      break;
    case 102: //1 high 2 low
    tone(8, NOTE_F4, 250);
      delay(250*1.30);
      break;
    case 111: //1 high 1 mid 1 low
    tone(8, NOTE_G4, 250);
      delay(250*1.30);
      break;
    case 120: //1 high 2 mid
    tone(8, NOTE_A4, 250);
      delay(250*1.30);
      break;
    case 201: //2 high 1 low
    tone(8, NOTE_B4, 250);
      delay(250*1.30);
      break;
    case 210: //2 high 1 mid
    tone(8, NOTE_C5, 250);
      delay(250*1.30);
      break;
    case 300: //3 high
    tone(8, NOTE_D5, 250);
      delay(250*1.30);
      break;
  }
}

We placed 3 photoresistors inside 3 cups and depending on the amount of light detected, we mapped specific musical notes to each cup. To avoid treating analog sensors as if they were digital, we implemented distinct categorizations for each cup. Specifically, we established three cases based on the amount of light detected: low (<250), mid (250-500), and high (>500). To introduce an element of digital control, we incorporated a slide switch.

Video demonstration:

REFLECTIONS

Working on this project was a fun experience. Initially considering a piano, we opted for a more unconventional approach, transforming ordinary cups into interactive controllers. One aspect that has become evident during this project is the potential for aesthetic enhancement. Observing other students’ projects, I realized the impact a well-designed aesthetic can have on the overall appeal of the final product. While our focus was primarily on functionality, witnessing the visual creativity in other projects has inspired me to explore the aesthetic dimension further in future endeavors.

 

Week 10 – Reading response

I found the author’s examples to be exceptionally thought-provoking. The illustration of playing the piano on a screen, like an iPad, particularly caught my attention. It led me to question the necessity of such technology. Why should we replicate complex tactile experiences on a two-dimensional surface? It highlighted the gap between the potential of human capabilities and the constraints imposed by current technological paradigms.

At its core, it seems the author is urging people to break free from traditional norms and cease restricting their thinking. There’s a profound call for a paradigm shift, a departure from the familiar and the comfortable.

The idea that technology doesn’t simply happen but is a result of choices, research, and inspired individuals resonated with me. The call to be inspired by the untapped potential of human capabilities struck a chord. It’s a call to action, urging us to reconsider the choices we make in technology development and funding. The historical reference to Alan Kay’s visionary leap serves as a powerful reminder that groundbreaking ideas often emerge from unconventional thinking.

The notion that we’ve become a generation tethered to desks, couches, and sedentary modes of transportation, necessitating artificial interventions like exercise to stave off bodily atrophy, struck a resonant chord. It not only underscores the physical implications of our evolving relationship with technology but also leads to a broader question about the increasing automation permeating every facet of our lives.

As we integrate technology into more aspects of our daily existence, there’s a palpable risk of creating a future where convenience comes at the cost of mobility and physical engagement. The critique of sitting as a prevailing posture for work, leisure, and transit raises concerns about the potential consequences of an increasingly automated lifestyle. Are we inadvertently designing a future where the need for bodily movement diminishes, contributing to a sedentary existence mediated by screens and devices?

Week 9: digital & analog input/output

Concept

For this assignment, I decided to expand upon the concept I previously developed. In the previous assignment, I built a switch that illuminated my drawer upon opening. Given the utilization of sensors in this assignment, I contemplated enhancing the mechanism from a mechanical process to an automated one. The core idea is to enable the LED to deactivate in total darkness, and as the drawer is opened, with increasing light levels, the LED will illuminate.

Code highlight

const int LED_PIN = 9;        // the PWM pin the LED is attached to
const int LIGHT_SENSOR_PIN = A2; // the analog pin the light sensor is attached to
const int BUTTON_PIN = A3;    // the pin where the button is connected
const int EXTRA_LED_PIN = 10; // the pin for the additional LED
int brightness = 0;           // how bright the LED is
int ledState = LOW;           // initial LED state is off
int lastButtonState = LOW;    // previous button state

void setup() {
  pinMode(LED_PIN, OUTPUT);
  pinMode(EXTRA_LED_PIN, OUTPUT);
  pinMode(BUTTON_PIN, INPUT);
  Serial.begin(9600);
}

void loop() {
  int light_value = analogRead(LIGHT_SENSOR_PIN); 
  brightness = map(light_value, 0, 1023, 0, 255); 
  Serial.println(brightness);
  analogWrite(LED_PIN, brightness); // 0-255

  int buttonState = digitalRead(BUTTON_PIN);
  if (buttonState == HIGH && lastButtonState == LOW) {
    // Toggle the LED state
    ledState = (ledState == LOW) ? HIGH : LOW;

    // Update the LED state
    digitalWrite(EXTRA_LED_PIN, ledState);

    // Update the last button state
    lastButtonState = HIGH;
  } else if (buttonState == LOW) {
    lastButtonState = LOW;
  }
}

To meet the second requirement of obtaining input in a digital format, I incorporated a switch that allows the user to control the light, toggling it on or off as needed. This idea materialized during my reflections on the project when I realized one of the limitations of the initial design – it relied on the room’s illumination to function. Hence, the addition of the switch serves as an effective solution to overcome this constraint.

Reflection

Coming up with an idea for this assignment was a bit difficult but I found the process of revisiting and refining an existing idea very satisfying.

The current version kind of contradicts the intial idea but i think it still works out fine.

 

 

Week 9 – Reading

Making interactive art

This reading brings up a crucial aspect of creating interactive art that, at first glance, might seem counterintuitive: the idea that as artists, we shouldn’t over-explain or over-interpret our own work. It highlights how artists, in their enthusiasm to convey their message or intention, can sometimes go too far in explaining every element of their interactive piece. This over-explanation can, paradoxically, hinder the audience’s experience by limiting the space for interpretation.

What I found most compelling about this perspective is the notion that when we meticulously detail our work, we unintentionally strip it of its openness to interpretation. Art, and especially interactive art, thrives on the engagement of the audience, on their ability to find personal meaning and significance in what they see and experience. When we, as artists, leave less room for interpretation by offering explicit descriptions or interpretations, we inadvertently limit the depth and richness of the user experience.

Physical computing

I find it interesting how physical computing is filled with recurring project themes that continue to inspire innovation and creativity. What strikes me the most is the realization that even within these well-worn themes, there’s an abundance of untapped potential for originality and fresh perspectives.

Reading through the article, it was hard not to draw parallels with a discussion we had in class before the fall break about creativity. The recurring themes in physical computing reminded me of the principle we explored during our discussions: that creativity often emerges when we build upon existing ideas and frameworks. In many ways, this article reaffirms the idea that true creativity doesn’t always require entirely novel concepts. Instead, it encourages us to embrace the familiar and established as a foundation for our own creative endeavors.

Unusual Switch

Concept

Have you ever been startled by a midnight headache, only to find yourself fumbling in the dark for painkillers? Been there, done that. So for this assignment, I decided to tackle this problem. I wanted to create a switch that would illuminate my bedside table drawer automatically as I opened it.

Process

I set up my breadboard inside the drawer and attached it to the side of the drawer using tape. Outside, on the side panel of the drawer, I attached the arduino board. Then I had to figure out how to make the wires connect in a way that somehow allows the drawer to still close all the way. Luckily I discovered this tiny hole (its the same hole through which the drawer locks) on the same side i attached the breadboard and this turned out to be the perfect way to connect the wires to the board outside.

I used two black wires so I can pull the drawer all the way out.

The way the switch works is: as i pull out the drawer, the red wire comes into contact with the metal side slide surface and inside the drawer, i attached another red wire to the breadboard and connected it to a metal nail drilled into the drawer. So when the red wire comes into contact with the metal surface, it allows flow of electricity and lights up the led (current passes to the metal nail inside the drawer). When the drawer is pulled back in, the metal surface also slides back, disrupting the flow of electricity and hence the light turns off.

Here is a video of how the switch works:

 

And to show that the light actually turns off when the drawer is closed, I put my phone inside the drawer to record the inside of the drawer once its closed:

 

Future Improvements

Overall, I feel like I was able to accomplish what i had envisioned. If I could improve one thing, it would be somehow making the connections between the wires more stable. I noticed that as I moved the drawer, the light would fluctuate a little. A more stable connection would make the lights more consistent.

Week 8: Reading Response

I found the article “Her Code Got Humans on the Moon—And Invented Software Itself” to be very inspiring and thought-provoking. I am always amazed whenever I read about people who defy the norms of their times to do something extraordinary. Margaret Hamilton’s story is a shining example of resilience, determination, and innovation in the face of societal expectations.

In an era when women were not commonly encouraged to pursue careers in high-powered technical fields, Hamilton not only ventured into the world of software engineering but also became a trailblazer in the field. What struck me most is how Hamilton balanced her roles as a working mother and a programmer. The fact that she brought her daughter to the lab speaks to her unwavering commitment to her work.

In a world where gender inequality within the tech field still remains a challenge, I think Hamilton’s story provides a very promising avenue for doing the extraordinary.

The second reading “Emotion and Attractive” offers intriguing insights into the interplay of aesthetics, usability, and emotional response in design. I liked how the author used his teapot collection to illustrate the idea that design isn’t a one-size-fits-all concept; it depends a lot on the context, mood, and personal preference. The analogy of transitioning from black and white to color screens in the early days of personal computing is particularly fascinating. The author’s initial skepticism about the value of color screens, despite their popularity, speaks to the subjective nature of design preferences. While the cognitive perspective may suggest that color doesn’t add significant value to productivity, the emotional response to color cannot be discounted.

The concept of “affect” and its role in design has left me with some intriguing food for thought. It’s fascinating to consider how our emotional responses to design can have such a profound impact on our decision-making and behavior. Affect, in this context, acts as a sort of silent influencer, guiding our judgments, shaping our perceptions, and even affecting our reactions.

What’s particularly striking is how affect doesn’t just serve as an emotional compass but also as a practical tool. It can alert us to potential dangers, which is incredibly valuable, but it can also steer our creative problem-solving processes. This dual role of affect makes me ponder the delicate balance between emotional response and practicality in design.

Midterm: DanceVille

Link to my sketch: https://editor.p5js.org/is2587/full/Bn466sW2p

Concept

My midterm project began as a whimsical idea: imagine a disco party where your favorite cartoon characters hit the dance floor. But this idea seemed too simple and I could not figure out how to make it more interactive and engaging for the user. As I began coding, I stumbled upon Dan Shiffman’s Teachable Machine playlist on YouTube. His playlist sparked a new inspiration – why not infuse ML into my project as well? Plus, a repeated suggestion I got from my friends regarding making the project more engaging was to somehow make the users mimic the dancing characters movement.

This fusion of disco vibes and machine learning transformed my simple “disco experience” into an engaging game. Now, users don’t just watch the dance moves; they become the stars of the show, mimicking poses detected by the webcam. To enhance the scene, I added dancing characters, some spotlights, and floor highlights.

Sketch

Problems/WHAT IM PROUD OF

Since working with a machine learning model was a new experience for me, I faced quite a lot of challenges throughout the coding process. One significant hurdle was integrating my trained machine learning model to recognize user poses. I had a hard time figuring out how I can increment the users score according to the poses detected by the model.

function classifyVideo() { 
classifier.classify(video, gotResults); 
}

function gotResults(error, results) {
  if (error) {
    console.error(error);
    return;
  }
  // Store the label and classify again
  label = results[0].label;
  classifyVideo();
}

function updateScore() {
  if (currentImage == clappingImage && label == "Clapping") {
    score += 1;
  } else if (currentImage == dabbingImage && label == "Dabbing") {
    score += 1;
  } else if (currentImage == handsUpImage && label == "Holding hands up") {
    score += 1;
  } else if (currentImage == armRollImage && label == "Rolling arms") {
    score += 1;
  }
}

Here’s how it works: when the machine learning model processes the user’s dance moves, it returns a label indicating the detected pose, like “Clapping” or “Dabbing.”

Then, the updateScore function comes into play. It’s responsible for comparing the detected pose to the pose displayed on the screen (like clapping or dabbing images) and, if they match, incrementing the user’s score.

Another puzzle was dealing with user stillness. Initially, even if users stood frozen, the machine learning model would guess a dance move. This unexpected stillness would inadvertently increase the user’s score. The solution I came up with was to train my model to identify moments of “no movement,” ensuring it could distinguish between action and inaction.

Since I could not find the right poses online that were also consistent with the overall aesthetics of the game, I decided to sketch the different poses on my ipad and integrated that into my sketch which was another aspect I really enjoyed working on.

What I like the most is how little features such as the dancing characters or the music choice really add to the whole experience. Before you enter the disco, I added a special touch to the music. At the beginning, it’s like you’re standing right outside a disco, and you can hear the muffled sounds of music from inside. It sets the stage and builds anticipation. But as soon as you enter, the music changes to something lively and funky, perfectly matching the energetic and vibrant atmosphere of the game.

Reflections

I knew working with machine learning would not be easy however, taking on this challenge working on this project all the more exciting. It was a blend of fun and anxiety I would say. I’m particularly proud of how I managed to keep track of scores and how I elevated the game’s aesthetics. Details like animated characters grooving on the dance floor and hand-illustrated dance move images added an extra layer of vibrancy.

If I could revise one aspect of my project, it would be fine-tuning my model to better recognize distinct dance poses. This, I believe, would further enhance the user’s dance-off experience, making it even more enjoyable and accurate.

REFERENCES

Dan Shiffman’s teachable machine playlist: https://www.youtube.com/watch?v=kwcillcWOg0&list=PLRqwX-V7Uu6aJwX0rFP-7ccA6ivsPDsK5&index=3