Author: Maya Lee

Concept)
I still haven’t fully decided what I want to do for my final project, but I plan to have the main concept as ‘screaming.’ I created a game that required the player to scream and I really liked the concept. One thing I regret from last project is that if I made it so that the player would have to continue screaming in order to make the game playable (i.e. slower the speed), it would’ve made more sense. I think trying this approach in my final project would be nice.

I have two different types (still very general ideas) in mind.

One is a game that would have the goal of attacking (like aircraft wargame). In this case, I think I’ll give a gauge that can be filled up by screaming. Once the gauge is full, the player will be able to press the force sensor to use a booster. When this booster is used, the player will become invincible like players in mariokart when they have used starman (refer to the video below).

Second type is a more challenge-focused game without attacks. One example can be puzzle bubble. Also in this concept, I’ll have a gauge that makes the player scream. When the gauge is full, the player will be able to punch (or press) on the fore sensor. This will work as special item such as clearing 3 lines etc.

Although I’m still thinking about the general structure of the game, I have decided that I will make use of ‘screaming’ and ‘force sensor’ as the main theme of my game. By punching the force sensor, I mean something like below:

Implentation)

I think the first thing to do would be to get the general structure of the game decided. After that, I will decide how to make it clear that there’s a strong incentive for the player to scream and punch. I will first test simple codes with the sensors (arduino) separately, the p5js part separately, and then combine the two parts.

I really liked the approach of the reading. I think until now, based on the readings we’ve had, most of my  discussion on these posts and in class have been from a perspective that design tends to focus on a certain group of people- usually, the healthy and the capable. I remember multiple discussions I had with my classmates in our in-class discussion how different designs and pursuits of certain designs tend to leave out the minority. We had a shared emotion that this may be logical (from a company  or designer’s point of view) but such a sad downside of designs that pursue convenience or attractiveness.

I think this reading really makes us ask ourselves if really, a pursuit of something in a design means a give-up in other factors of a design, and if that’s ideal. One topic the reading looks at discretion and fashion. It talks about how they are concepts with tension, but not the opposite. I feel like there are some factors that we take to blindly think are at opposite ends and a pursuit of one means we would need to give up the other. I think as designers, one of our role is to realize such factors that are actually not at opposite ends and figure out how a design can pursue both (although there would be tension between them).

Teammate: Jiho

1st exercise: 
We used the existing example: Week 11 Bidirectional serial communication(p5js Sketch) to fulfill the 1st exercise. We created a new variable “moveEllipse” to map the alpha value to the canvas width. We then used our variable as the x-position of the ellipse, successfully enabling the ellipse to move from one edge to the other as the potentiometer value increased.

let moveEllipse = map(alpha, 0, 1023, 0, width);
stroke(0);
ellipse(moveEllipse, height / 2, 60);

2nd exercise:
Editing that same example, we added the bouncing ball javascript from p5.js: https://editor.p5js.org/icm/sketches/BJKWv5Tn . The LED becomes brighter when the ball moves towards the right edge of the canvas. Conversely, the LED becomes dimmer when the ball moves towards the left edge of the canvas. We edited the arduino to replace digitalWrite with AnalogWrite to enable the control of the LED brightness.

let x = 320;
let y = 180;
let xspeed = 3;
let yspeed = 2;
let r = 25;

ellipse(x, y, r*2, r*2);
// mapping brightness to canvas width
let rightValue = map(x, 0, width, 0, 255);
right = int(rightValue);

x += xspeed;
y += yspeed;
if (x > width - r || x < r) {
xspeed = -xspeed;
}
if (y > height - r || y < r) {
yspeed = -yspeed;
}
}

3rd exercise: https://youtu.be/YFucULMGidI

I took the main structure of the code from the exercise we looked at in class- where we had to press our spacebar to connect to our board. There, I added the code with the bouncing ball given to us through this link(https://editor.p5js.org/aaronsherwood/sketches/I7iQrNCul).

The approach was to call bounceBall() function once the serial is activated, where p5js will continuously send touch value (1 means it touched the ground and 0 means it’s above ground) to the arduino. In return, the arduino would send lightStatus value (the input read from the light sensor). If the received value is bigger than 500, the wind blows from left to right and right to left if below.

Below are parts of code that highlights the appraoch:
P5js

if (position.y > height-mass/2) {
      velocity.y *= -0.9;  // A little dampening when hitting the bottom
      position.y = height-mass/2;
    touch = 1;
    //////////////////////////////////
    //SEND TO ARDUINO HERE (handshake)
    //////////////////////////////////
    let sendToArduino = touch + "\n";
    console.log(touch);
    writeSerial(sendToArduino);
    touch = 0;
    sendToArduino = touch + "\n";
    writeSerial(sendToArduino);
    }

Arduino

int ledPin = 5;
int lightPin = A1;
int lightStatus;

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

  // start the handshake
  while (Serial.available() <= 0) {
    digitalWrite(LED_BUILTIN, HIGH);
    Serial.println("0");
    delay(1000);
    digitalWrite(LED_BUILTIN, LOW);
    delay(100);
  }
}

void loop() {
  while (Serial.available()) {
    digitalWrite(ledPin, HIGH);

    int ledLight = Serial.parseInt();
    lightStatus = analogRead(lightPin);
    if (Serial.read() == '\n') {
      digitalWrite(ledPin, ledLight);
      delay(50);
      digitalWrite(ledPin, LOW);
      Serial.println(lightStatus);
      delay(5);
    }
  }
  digitalWrite(LED_BUILTIN, LOW);
}

Concept)
There were two conditions I wanted to meet when creating this instrument
– it should involve both hands
– it should be able to play different notes separately  (i.e. the sound is not continuous)

It naturally made sense to have one of the hands be responsible of how long a note should be played, and the other hand to specify the note. I saw different videos for inspiration and saw instruments that use the distance to decide the note to be played.

Production)

Code)

int trig = 10;
int echo = 11;
int light = 5;
long  duration;
long  distance;
int   buttonState;


void setup() {
  pinMode(echo, INPUT);
  pinMode(trig, OUTPUT);
  pinMode(light, OUTPUT);
  Serial.begin(9600);
}

void loop() {
  digitalWrite(trig, LOW);
  delayMicroseconds(2);
  digitalWrite(trig, HIGH);
  delayMicroseconds(10);
  digitalWrite(trig, LOW);
  duration = pulseIn(echo, HIGH);
  distance = (duration / 2) * 0.0344;
  /*
    duration = time it took for ultrasonic pulse to travel to and back from the object
    distance equation: conversion from duration to distance
    because the duration includes the travel time to and back from the object, 
      divided by 2
    multiplied by 0.0344: speed of sound in air (in room temperature
                            = 343 m/s ==> convert to cm
  */


  int notes[7] = {261, 294, 329, 349, 392, 440, 494};
  //C, D, E, F, G, A, B

  buttonState = analogRead(A1);

  int sound;

  if (distance < 0 || distance > 50 || buttonState < 100) {
      sound = -1;
  } else if (distance <= 5) {
      sound = 0;
  } else if (distance <= 10) {
      sound = 1;
  } else if (distance <= 15) {
      sound = 2;
  } else if (distance <= 20) {
      sound = 3;
  } else if (distance <= 30) {
      sound = 4;
  } else if (distance <= 40) {
      sound = 5;
  } else {
      sound = 6;
  }

  if (sound != -1) {
      digitalWrite(light, HIGH);
      Serial.println(sound);
      tone(12, notes[sound]);
  } else {
      noTone(12);
      digitalWrite(light, LOW);
  }

}

I think the most interesting part of this code was figuring out how to convert the duration to distance, and the distance to different notes.

Future Improvements)
I think it’s be interesting if I can connect a force censor, for instance, to create the beat on the background. Then, it would have a simple instrument that consists of the base beat (like a drum) and the melody part through the hands.

< A Brief Rant on the Future of Interactive Design>

Looking at the video, I think my very shallow but instant impression was: cool. It definitely is close to what I’ve been picturing- something that’s been displayed to us through media (like Netflix Black Mirror series) until now, somewhat brainwashing this is what we have coming and this is all we could expect.

I love how the reading questions if the aspect of our future daily lives shown in the video is the next form of ‘technology’, or interaction, as the author focuses.

I think a big part of why technology has limited power to fascinate people and bring joy with the littlest thing is that lack of feeling. The reading talks about how if we were to read a book, we’d be able to feel it. With basic interactions with ‘Pictures Under Glass’, this is not possible. I think we’ve all felt this limitation with certain technology like e-books and simply visually satisfying games.

The author acknowledges that this is just a rant and that the current developments the world is showing are still great. It’s just a matter of how do we progress from here, using everything humans can do. Regardless of any statements that can be made around his opinion, I like how he approached the concept of ‘tool’ and what that can mean when we are inventing or developing a tool.

Greatest Hits (and Misses)
The reading went over how different materials were used in different projects. I think there is 2 ways of approaching a project: come up with the idea first and look at available technologies or methods, or look at available technologies or methods and think about what you can do with it.

I wouldn’t say any of them is superior than the other. However, I do want to say that it does mean knowing what’s available will be helpful in terms of thinking outside the box, doing remix, and creating your project.  In this sense, it was interesting to see how different technologies were used. Some were crazier than others, but regardless, they still make it to my reference list.

Making Interactive Art
I think the reading very well points out how certain performers or artists tend to directly guide the audience to think a specific way or come to a specific conclusion. I think it’s easier to fall into this pitfall as an interactive media creator, as there’s a limitation to different types or cases of interactions we can think of as creators, which will make us limit the conclusion and the emotions we create with our project.

I think this can both work against you or work in your favour. It is true we, as creators, should try not to have a set conclusion and just ‘educate’ our audience of it. However, at the same time, interactive media holds the power to guide people to experience certain things and, in return, think a certain thing. I think this is a strength not many forms of media has. For instance, a painting may go through so many interpretations of different individuals. While I agree the charm lies within this characteristic, it is also very true that the painter may fail in delivering the message with the correct context and depth.

Concept)

When I thought about what I could do with 2 LEDs, I again thought about the colours. Looking at buttons and red and blue LED lights, I thought of an old-style game that used to be played on primary school sports day: “Blue Flag, Red Flag.”

How you play the game:
There’s one referee who gives orders like…
– Hold up red flag
– Don’t hold up red flag and hold up blue flag
– etc..
It makes much more sense and has more thrill in Korean grammar.. The grammatical order of English kind of giving everything away.

Anyways, I wanted to create a game control for this game.

Materials I Used:
– Arduino Uno
– 2 LEDs (red & blue)
– 4  resistors (330 ohm)
– 2 push button switches
– breadboard
– jumper wires

Video: (just realized the top part is a little cut off, but the subtitles on top of the video or examples of the orders)

Code:

const int redButton = 3;
const int blueButton = A1;
const int redLight = 6;
const int blueLight = 5;

void setup() {
  Serial.begin(9600);
  pinMode(redLight, OUTPUT);
  pinMode(blueLight, OUTPUT);
  pinMode(redButton, INPUT);
}

void loop() {

  int redState;
  int blueState;

  redState = digitalRead(redButton);
  blueState = analogRead(blueButton);

  //Serial.print("restate: ");
  //Serial.println(redState);
  //Serial.print("bluestate: ");
  //Serial.println(blueState);
  if (redState != 0)
  {
    Serial.println("red high");
    digitalWrite(redLight, HIGH);
    delay(100);
    digitalWrite(redLight, LOW);
  }
  if (blueState > 500)
  {
    Serial.println("blue high");
    digitalWrite(blueLight, HIGH);
   delay(100);
    digitalWrite(blueLight, LOW);
  }
}

The code is very simple as it’s just recognizing the buttons and turning on the LED lights. It is notable that the push of the buttons are recognized differently (analog and digital input) and therefore the if statement is a little different.

Maragret Hamilton’s Story

I think it’s really empowering to see historical figures (that not much of the public knows about) having made impact that, again, we sometimes don’t know well about or take for granted in some way.

I think as a person studying computer science, the question of what fields will rise and fall, and what impact I will be able to make in different fields is always daunting as much as it is exciting. It might be because I am still a student, but the decision to go into a field that’s not perferred or considered prospective would not have been easy. I think the burden would have also come from the fact that once such big projects go wrong, they may lose both a lot of money and individuals. Becoming pioneers under these pressure, and leading future generations follow the way is definitely ( in my opinion) something all future programmers dream of.

Emotions & Design

I’m very excited that this topic has been raised again. I remember that in one of the readings from the first half of the course, there was a question of how designs need to consider both the funcitons and the attractiveness.

I remember this as the discussion I had with my group in class was really interesting. It is without doubt that finding the right balance between function and design is important. However, it also becomes a question whether this applies to all cases.

For instance, maybe if it’s something that’s not that frequently used. Maybe in that case, it’s more important for the product to merge into the design of its environment and not be considered as a hideous object.

Or, in other cases, it might be that something is for such private use that there is no need for it to be attractive. Maybe people don’t care about how something looks, if they are just going to use it at homes, on their own.

I think it really shows that yes, it’s important to find a balance, but this question is even harder as ‘the right balance’ differs by every situation.

Concept

When I thought about a LED lighting up, I wondered what connotations or messages it could give. The red and blue lights are commonly used to let people know if something’s good to go or not. With this, I thought about simple ways to connect LED lights and safety.

Approach

I found a safety vest that had velcros on them. When one wears the vest, they need to close the velcros, which means the two sides will meet. This is the exact concept of switches, so I decided to use this action.

When you wear the safety vest, the blue light will turn on, signalling that you’re good to go outside and have fun! (or work, to be realistic)

Expansion

I only used blue light to show that things are good to go. I think a good feature to add is the red light, that shows that the vest is not worn properly. This action would be eliminating contact, so I would need to think about how I would use this action as a switch (as it’ll be different from the blue light’s logic).

Full Link to the Project: https://editor.p5js.org/MayaLeeeeee/sketches/-N67RBhJJ

Project: Hey, Breathe

*** The project is shown cut-off due to the layout of the Intro to IM page.

Concept)
The overall concept was to create an interactive game, where the movement of the player would depend on the voice of them. I initially planned to use both pitch and volume for the movement. (Higher pitch would move the character up, lower pitch would move the character down; higher volume would make the character move faster,  lower volume would make the character move slower).

However, as I continued with my work, I had to change that. Although playing with the pitch of sound was interesting (the playing of the game was really funny), it was absolutely impossible to play the game. The pitch changed so much that the character couldn’t stay still and it continuously spiked up and came down. I tried to manipulate it, but there was not much I can do to lower the sensitivity etc.

So, I changed the up and down movement to arrow keys. However, I did keep the idea of the input sound’s volume deciding how fast the character is moving. I wanted the character’s x position to stay still, so this eventually became the speed of the map moving.

Methods)
Basically, I have 3 elements in my game: character, obstacles, and collectibles. The red circle is the player, the black box the obstacles, and the green circles the collectibles. For the obstacles and the collectibles, I had to find a way to keep track of their locations, so that I can check if the player has hit the obstacle or has collected the collectible. I do so by using an array.

for (let i = obstacles.length - 1; i >= 0; i--) {
    obstacles[i].move(characterSpeed);
    obstacles[i].show();
    if (gameStart && character.hits(obstacles[i])) { //check if it hits obstacles
      console.log("Game Over");
      isGameOver = true;
      song.play(); //sound effect for when game over
    }
    if (obstacles[i] && obstacles[i].offscreen()) { //if offscreen, delete the obstacle from array
      obstacles.splice(i, 1);
    }
  }

I push a new obstacle/collectible into the corresponding array. I also use splice when I check if there’s anything off screen. I check the locations of obstacles and collectibles, see if they’re off screen, and if so, delete them from the array by using splice.

Future Improvements)
There is a bug where if the volume of the input sound is too big, the player passes right through the obstacles and doesn’t end the game. I am guessing that the speed of movement is quicker than the speed of checking (or something like that), and the program is not perfectly checking all the obstacles etc.

*** sound used: https://freesound.org/people/MATRIXXX_/sounds/345666/