Final-Project-Report

1. project name: a day as an Alzheimer’s patient, my name: is Amelia Ji, my partner’s name: is Yunyi Yang, and my instructor’s name: is Margret Minsky

2.  the concept of my project is for the users to experience one day of the Alzheimer’s patient so they can understand the patient’s difficulties. my previous investigation let me know much about the definition of interaction. according to my definition, interaction means more than two participants (including two) involved in one project and jointly making efforts for that project with or without intention. because of that, I designed my project so that users will use the up-down and left-right buttons on the computer to control the movement of the circle on the screen to trigger specific effects. so the participants’ number satisfies my definition of interaction. they are the user and the computer. also, they are involved in one project which is my project of exploring an Alzheimer’s patient’s daily routine. they all devote themselves to that project. the computer is running and the user pushes the buttons. in this sense, my project is consistent with my definition of interaction. according to WHO, there are over 15.2 million people with Alzheimer’s making this disease deserve serious attention. however, most people still regard this disease as a bad memory and of no importance. this directly leads to my creating this project. because I want my users to experience the feeling of being an Alzheimer’s patient, so I designed them to not know which way is the right way to go as the patient would not have known too. also, I designed them to return to the same position once they entered the wrong room because I want them to experience the frustration felt by most patients.  what’s more, we made the lights light up if they entered the right room because that signal that they have retrieved their memory. during the users’ test, most people think the maze was a bit too difficult and the light stripe was not so beautiful. They don’t know exactly what to do at first. because of those suggestions, we put the maze on the screen so that it becomes easier for the user to play. also, we use cotton to cover up the light stripe to make it more beautiful and dreamlike. finally, we added several words on the screen so that they can guide the users to play our project. these modifications all prove to be effective. 

3. the most important parts of our projects are the code and the building of the toy house. the coding part, we first wrote the processing part. I first draw a sketch of the toy house and then use the “key released” function in the processing and write about a fictional circle whose position is constantly refreshing every time we released the up button, the ball will go up 10, etc. then I draw several lines where every time the ball touch the line, the ball will stay at the former position. then I set the right route by setting every time the ball enters the wrong room, it will go back to the starting position. then, we began to build our toy house. I first 3D printed the couches and other furniture and I designed the size of the bricks of our house and sent it to laser cutting. after it was cut, I stuck them together. after that, Joy set the Arduino. she set different stages. and I set different lights that will light up according to the different stages. we used the code in Arduino to receive the message from Processing. after that, Joy and I found our project’s background song. and Joy cut them into pieces and sent them to me. I insert them into Processing so that they will play according to which room the circle is in. and the piece will ring every time the user pushes the button. then Joy and I together drew the video inserted at the end of our project and I inserted it into Processing. after that, Joy inserts the guiding words into the Processing. during that process, we purchased some more furniture to decorate our house. and I did the finishing thing including making the light flash in the end and testing everything to make sure they work. in the end, we painted the house and the furniture and stuck them together with a glue gun. we use wood instead of 3 d printing our house because it would be too timely for us to 3 d print such a big thing. we use 3 d print in making our furniture because 3 d printing can make the texture of our furniture wood can not reflect. also, we use cotton to soften the light because we want the light to be not so strong and make the whole house dreamy because the patients are living in a different world than ours. 

4. our original goal is to make the user feel like the patient with Alzheimer’s. we kind of achieved that. by saying kind of, I mean the users can feel the sensation of loss when playing our project. but the sense of exploring is lessened because they need to see both the computer screen and the toy house. also, I intend to make the light go as the ball goes. but it was too complicated so we made the whole room light up at once. my audience interacts with this project fine. I would put some monitors so that the audience wouldn’t have to look at two different places. also, I may ask the professor about how to make the light lights up as the ball goes without writing the code light by light. the thing I learned most in my project is that you should always keep the audience in mind. how they will interact with your project is what matters most. also, I learned that we should have a concept in mind so that everything we do is devoted to the concept. if we don’t have the concept in mind, we won’t know what to do. the other thing I learned is that it is important to have conversations, no matter with professors or with la or with your partners. I think the problem of Alzheimer’s disease is a problem all of us should take close attention to as everyone will get old someday and it is important for us to care about the elderly both for our own sake and because we are human being who cares about others. it is our responsibility as the young to take care of the elderly. that is why my project matters. 

5. here is the video

the following is the Arduino and Processing code I don’t know why it is in such a big chunk. I did it twice but every time, it was like this. I can slack you the code if you need it. but please don’t take points out because it’s messy. so sorry for the inconvenience. 

#include "SerialRecord.h"

// Change this number to the number of values you want to receive
SerialRecord reader(1);

//FOR neopixel----//
int pos = 0;
#include 
//LED PIN
#define LED_PIN 9
// Information about the LED strip itself
#define NUM_LEDS 154
#define CHIPSET NEOPIXEL  //WS2811
#define COLOR_ORDER GRB
CRGB leds[NUM_LEDS];  // Define the array of leds
//set brightness
#define BRIGHTNESS 3
//---------------------//
boolean on, blinking;
void setup() {
  Serial.begin(9600);
  delay(1000);
  FastLED.addLeds<NEOPIXEL, LED_PIN>(leds, NUM_LEDS);
  FastLED.setBrightness(BRIGHTNESS);
}
void loop() {
  // celebration3();
  reader.read();

  Serial.println(reader[0]);
  if (reader[0] == 0) {
    for (int i = 13; i > 12 && i < 44; i++) { leds[i] = CRGB::White; FastLED.show(); } } if (reader[0] == 1) { for (int i = 10; i > 9 && i < 13; i++) { leds[i] = CRGB::White; FastLED.show(); } for (int i = 44; i > 43 && i < 52; i++) { leds[i] = CRGB::White; FastLED.show(); } } if (reader[0] == 2) { leds[0] = CRGB::White; for (int i = 70; i > 69 && i < 85; i++) { leds[i] = CRGB::White; } for (int i = 149; i > 148 && i < 155; i++) { leds[i] = CRGB::White; } FastLED.show(); } if (reader[0] == 3) { leds[0] = CRGB::White; for (int i = 7; i > 6 && i < 9; i++) { leds[i] = CRGB::White; } for (int i = 53; i > 52 && i < 59; i++) { leds[i] = CRGB::White; } FastLED.show(); } if (reader[0] == 4) { leds[0] = CRGB::White; for (int i = 60; i > 59 && i < 65; i++) { leds[i] = CRGB::White; FastLED.show(); } for (int i = 1; i > 0 && i < 6; i++) { leds[i] = CRGB::White; FastLED.show(); } //FastLED.show(); } if (reader[0] == 5) { leds[0] = CRGB::White; for (int i = 114; i > 113 && i < 146; i++) { leds[i] = CRGB::White; } FastLED.show(); } if (reader[0] == 6) { leds[0] = CRGB::White; // for (int i = 146; i > 145 && i < 149; i++) { // leds[i] = CRGB::White; // } // for (int i = 85; i > 84 && i < 113; i++) {
    //     leds[i] = CRGB::White;
    //   }
    //   FastLED.show();
    // }
    if (reader[0] == 20) {
      for (int i = 0; i < NUM_LEDS; i++) {
        leds[i] = CRGB::Black;
      }
      FastLED.show();
    }
    if (reader[0] == 6) {
      // start blinking state
      blinking = true;
    }
    if (reader[0] == 88) {
      // stops blinking state
      blinking = false;
    }
    if (blinking && millis() % 1000 < 25) {
      if (on == true) {
        for (int i = 0; i < NUM_LEDS; i++) {
          leds[i] = CRGB::Black;
        }
        on = false;
      } else {
        for (int i = 0; i < NUM_LEDS; i++) {
          leds[i] = CRGB::White;
        }
        on = true;
      }
      FastLED.show();
    } else {
      for (int i = 0; i < NUM_LEDS; i++) {
        leds[i] = CRGB::Black;
      }
      FastLED.show();
    }
    delay(10);
  }
}
 
//color fillVal = color(126);

import processing.serial.*;
import osteele.processing.SerialRecord.*;
import processing.sound.*;
import processing.video.*;

Movie mov;

SoundFile soundfile1;
SoundFile soundfile2;
SoundFile soundfile3;
SoundFile soundfile4;
SoundFile soundfile5;
SoundFile soundfile6;
SoundFile soundfile7;

Serial serialPort;
SerialRecord serialRecord;

int rad = 20;        // Width of the shape
float xpos, ypos;    // Starting position of shape
float mx;
float my;
int speed = 10;
int radius = 2;
int edge = 0;
int inner = edge + radius;
boolean b = false;
float prexpos;
float preypos;
//0 = bedroom, 1 = toliet, 2 = kitchen, 3 = dinning room, 4 = balcony, 5 = living room, 6 = study
int state = 0;


void setup()
{
  size(1100, 800);
  background(0);
  // Load a soundfile
  soundfile1 = new SoundFile(this, "soundfile1.mp3");
  soundfile2 = new SoundFile(this, "soundfile2.mp3");
  soundfile3 = new SoundFile(this, "soundfile3.mp3");
  soundfile4 = new SoundFile(this, "soundfile4.mp3");
  soundfile5 = new SoundFile(this, "soundfile5.mp3");
  soundfile6 = new SoundFile(this, "soundfile6.mp3");
  soundfile7 = new SoundFile(this, "soundfile7.mp3");

  mov = new Movie(this, "movie.mp4");
  //mov.play();
  noStroke();
  frameRate(30);
  ellipseMode(RADIUS);
  // Set the starting position of the shape
  xpos = 300;
  ypos = 700;

  String serialPortName = SerialUtils.findArduinoPort();
  serialPort = new Serial(this, serialPortName, 9600);

  // In order to send a different number of values, modify the number `2` on the
  // next line to the number values to send. In this case, the corresponding
  // number in the Arduino sketch should be modified as well.
  serialRecord = new SerialRecord(this, serialPort, 1);
}


void draw() {
  if (state == 6) {
    if (mov.available()) {
      mov.read();
    }
    image(mov, 0, 0, width, height);
  } else {
    background(0);
    fill(255);
    circle(xpos, ypos, rad);
    //keyPressed();
    prexpos = xpos;
    preypos = ypos;
   
    stroke(255);
    line(0, 270, 50, 270);
    
    stroke(255);
    line(150, 270, 540, 270);
    
    stroke(255);
    line(640, 270, 740, 270);
    
    stroke(255);
    line(370, 600, 430, 600);
    
    stroke(255);
    line(480, 600, 650, 600);
    
    stroke(255);
    line(700, 600, 910, 600);
    
    stroke(255);
    line(1000, 600, 1100, 600);
    
    stroke(255);
    line(370, 270, 370, 350);
    
    stroke(255);
    line(370, 450, 370, 730);
    
    stroke(255);
    line(550, 600, 550, 730);
    
    stroke(255);
    line(740, 0, 740, 90);
    
     stroke(255);
    line(740, 180, 740, 450);
    
    stroke(255);
    line(740, 550, 740, 730);
    
    
    
    
  }
   if (xpos<370 && xpos>0 && ypos>350 && ypos<730){
     textSize(50);
    fill(255);
    text("You are an alzheimer patient,",width/4,height/2);
    text("you had just woken up",350,500);
  }
  
  if (xpos<550 && xpos>370 && ypos>600 && ypos<800) {
     textSize(50);
    fill(255);
    text("And you realize you need to go to the bathroom",100,height/2);
  }
  
  if (xpos<740 && xpos>370 && ypos>270 && ypos<600){
     textSize(50);
    fill(255);
    text("After go to the bathroom, you cook for yourself",100 ,height/2);
  }
  
  
   if (xpos<740 && xpos>550 && ypos>600 && ypos<800){
     textSize(50);
    fill(255);
    text("You grab some tools", 300,height/2);
  }
  
  if (xpos<1100 && xpos>740 && ypos>600 && ypos<800){
     textSize(50);
    fill(255);
    text("And you go to the balcony to take care of the plants",0,height/2);
  }
  
  if (xpos<1100 && xpos>740 && ypos>0 && ypos<600){ textSize(50); fill(255); text("And you stay in the living room to watch televison",100,height/2); } if (ypos == 701 && xpos ==301){ textSize(50); fill(255); text("You go to the wrong room, and forget what to do,",90,600); text("so you go back to the bedroom",170,700); } //if (xpos == 550 && ypos>730 && ypos<800){ // textSize(50); // fill(255); // text("You go to the grocery, and forget what to do,",100,height/2); // text("so you go back to the bedroom",150,height/2); // } //if (ypos == 270 && xpos>540 && xpos<640){ // textSize(50); // fill(255); // text("You go to the study, and forget what to do,",100,height/2); // text("so you go back to the bedroom",150,height/2); // } // if (xpos == 370 && ypos>350 && ypos<450){ // textSize(50); // fill(255); // text("You go to the kitchen, and forget what to do,",100,height/2); // text("so you go back to the bedroom",150,height/2); // } // if (xpos == 740 && ypos>450 && ypos<550){ // textSize(50); // fill(255); // text("You go to the living room, and forget what to do,",100,height/2); // text("so you go back to the bedroom",150,height/2); // } } void keyPressed() { println(state); ////if ((b == true) && (key == CODED)) { // if (key == CODED) { // if (keyCode == UP) { // ypos = ypos - speed; // } else if (keyCode == DOWN) { // ypos = ypos + speed; // } // if (keyCode == LEFT) { // xpos = xpos - speed; // } else if (keyCode == RIGHT) { // xpos = xpos + speed; // } // xpos = constrain(xpos, inner, width - inner); // ypos = constrain(ypos, inner, height - inner); // fill(76); // //} // //b = false; //} } void keyReleased() { //b = true; if (key == CODED) { if (keyCode == UP) { ypos = ypos - speed; } else if (keyCode == DOWN) { ypos = ypos + speed; } if (keyCode == LEFT) { xpos = xpos - speed; } else if (keyCode == RIGHT) { xpos = xpos + speed; } xpos = constrain(xpos, inner, width - inner); ypos = constrain(ypos, inner, height - inner); fill(76); //} //b = false; } if (xpos>0 && xpos<1100 && ypos==0) { xpos = prexpos; ypos = preypos; } else if (xpos==740 && ypos>0 && ypos<90) { xpos = prexpos; ypos = preypos; } else if (xpos==740 && ypos>180 && ypos<450) { xpos = prexpos; ypos = preypos; } else if (ypos==270 && xpos>640 && xpos<740) { xpos = prexpos; ypos = preypos; } else if (ypos==270 && xpos>150 && xpos<540) { xpos = prexpos; ypos = preypos; } else if (xpos==370 && ypos>270 && ypos<350) { xpos = prexpos; ypos = preypos; } else if (ypos==270 && xpos>0 && xpos<50) { xpos = prexpos; ypos = preypos; } else if (xpos==0 && ypos>0 && ypos<800) { xpos = prexpos; ypos = preypos; } else if (ypos==800 && xpos>0 && xpos<1100) { xpos = prexpos; ypos = preypos; } else if (xpos==370 && ypos>450 && ypos<730) { xpos = prexpos; ypos = preypos; } else if (ypos==600 && xpos>370 && xpos<430) { xpos = prexpos; ypos = preypos; } else if (ypos==600 && xpos>480 && xpos<650) { xpos = prexpos; ypos = preypos; } else if (xpos==550 && ypos>600 && ypos<730) { xpos = prexpos; ypos = preypos; } else if (ypos==600 && xpos>700 && xpos<740) { xpos = prexpos; ypos = preypos; } else if (xpos==740 && ypos>550 && ypos<730) { xpos = prexpos; ypos = preypos; } else if (ypos==600 && xpos>740 && xpos<910) { xpos = prexpos; ypos = preypos; } else if (ypos==600 && xpos>1000 && xpos<1100) { xpos = prexpos; ypos = preypos; } else if (xpos==1100 && ypos>0 && ypos<800) { xpos = prexpos; ypos = preypos; } else if (ypos == 270 && xpos>50 && xpos<150) { xpos = 301; ypos = 701; state = 20; serialRecord.values[0] = state; serialRecord.send(); } else if (xpos == 550 && ypos>730 && ypos<800) { xpos = 301; ypos = 701; state = 20; serialRecord.values[0] = state; serialRecord.send(); } else if (ypos == 270 && xpos>540 && xpos<640) { xpos = 301; ypos = 701; state = 20; serialRecord.values[0] = state; serialRecord.send(); } else if (xpos == 740 && ypos>450 && ypos<550) { xpos = 301; ypos = 701; state = 20; serialRecord.values[0] = state; serialRecord.send(); } else if (xpos == 370 && ypos>350 && ypos<450) {
    xpos = 301;
    ypos = 701;
    state = 20;
    serialRecord.values[0] = state;
    serialRecord.send();
  }
  if (xpos<370 && xpos>0 && ypos>350 && ypos<730) {
    state = 0;
    serialRecord.values[0] = state;
    serialRecord.send();
    
    
    if (soundfile1.isPlaying() == false) {
      soundfile1.play();
      soundfile2.stop();
      soundfile3.stop();
      soundfile4.stop();
      soundfile5.stop();
      soundfile6.stop();
      }
     
  }

  if (xpos<550 && xpos>370 && ypos>600 && ypos<800) {
    state = 1;
    serialRecord.values[0] = state;
    serialRecord.send();
    if (soundfile2.isPlaying() == false) {
      soundfile2.play();
    }
    soundfile1.stop();
  }

  if (xpos<740 && xpos>370 && ypos>270 && ypos<600) {
    state = 2;
    serialRecord.values[0] = state;
    serialRecord.send();
    println(serialRecord.values[0]);
    if (soundfile3.isPlaying() == false) {
      soundfile3.play();
    }
    soundfile2.stop();
  }

  if (xpos<740 && xpos>550 && ypos>600 && ypos<800) {
    state = 3;
    serialRecord.values[0] = state;
    serialRecord.send();
    if (soundfile4.isPlaying() == false) {
      soundfile4.play();
    }
    soundfile3.stop();
  }

  if (xpos<1100 && xpos>740 && ypos>600 && ypos<800) {
    state = 4;
    serialRecord.values[0] = state;
    serialRecord.send();
    if (soundfile5.isPlaying() == false) {
      soundfile5.play();
    }
    soundfile4.stop();
  }

  if (xpos<1100 && xpos>740 && ypos>0 && ypos<600) {
    state = 5;
    serialRecord.values[0] = state;
    serialRecord.send();
    if (soundfile6.isPlaying() == false) {
      soundfile6.play();
    }
    soundfile5.stop();
  }


  if (xpos<740 && xpos>0 && ypos>0 && ypos<270) {
    state = 6;
    serialRecord.values[0] = state;
    serialRecord.send();
    if (soundfile7.isPlaying() == false) {
      soundfile7.play();
      soundfile6.stop();
      mov.play();
      float md = mov.duration();
      float mt = mov.time();
      if (mt == md){
        serialRecord.values[0] = 88;
        serialRecord.send();
    }
  }
}

} 

Amelia’s Tenth Documentation Blog

1. in this project, we are going to use a physical sensor to control media on processing to change. in my project, I use the potentiometer to control the location of the media in processing. when I turn the nob, the picture’s position will change. we hope to learn how to control the media through Arduino.

2. the process went as planned. I first opened the example to send and receive the variables on processing and Arduino. then, I change the code so that instead of sending the position of the ball, I’m sending the position of the picture I put in the file of the processing. after changing the code, I connect the Arduino to the computer and test it. it worked. what didn’t go as planned is that the first time I connected the Arduino, I connect the middle one to the ground so that there was a shortcut there and my potentiometer went very hot. 

3. what I learned is how to control the media through Arduino. I also remembered deeply the middle of the potentiometer is used for the pin only.

4. the following is my code and the video.

/**
 * Example sketch for the SerialRecord library for Processing.
 *
 * Receives two integers from the serial port, and uses them to control the x
 * and y position of a circle on the canvas.
 */

import processing.serial.*;
import osteele.processing.SerialRecord.*;
PImage photo;

Serial serialPort;
SerialRecord serialRecord;

void setup() {
  size(500, 500);

  String serialPortName = SerialUtils.findArduinoPort();
  serialPort = new Serial(this, serialPortName, 9600);
  photo = loadImage("syt.jpeg");
  // If the Arduino sketch sends a different number of values, modify the number
  // `2` on the next line to match the number of values that it sends.
  serialRecord = new SerialRecord(this, serialPort, 2);
}

void draw() {
  background(0);
  int value1 = serialRecord.values[0];
  int value2 = serialRecord.values[1];
  
  float x = map(value1, 0, 1024, 0, width);
  float y = map(value2, 0, 1024, 0, height);
  image(photo, x, y);
  serialRecord.read();

} 
/*
  SendMultipleValues

  Reads an analog input on pin 0, and sends a record that contains two values:

  1. Value of `millis()`, modulo 1024.
  2. The analog value that is read from pin 0.

  If you attach a potentiometer to pin 0, you can control this value by moving
  the pot.

  This sketch pairs well with the RecieveMultipleValues example from the
  Processing SerialRecord library
  <https://osteele.github.io/Processing_SerialRecord/>.

  Things to try:
  - Connect a second potentiometer to the Arduino, and send the values from both
    potentiometers, instead of send a value that is based on `millis()`.
  - Send the value from another sensor, such as temperature or proximity.

  by Oliver Steele, 2020-2022

  This example code is in the public domain.
*/

#include "SerialRecord.h"

// Change this number to send a different number of values
SerialRecord writer(2);

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

void loop() {
  int sensorValue = analogRead(A0);

  writer[0] = millis() % 1024;
  writer[1] = sensorValue;
  writer.send();

  // This delay slows down the loop, so that it runs less frequently. This can
  // make it easier to debug the sketch, because new values are printed at a
  // slower rate.
  delay(10);
}
 

Amelia’s Ninth Documentation Blog

1. in today’s recitation, we are asked to make a turning wheel by laser cutting. we should be making the wheel using a specific website so that we can exercise the ability to make laser-cutting things. 

2. first, I grouped up with Joy and divided the work, she was student A and I was student B. after a few minutes, we succeeded in making both of the boards, and she copy the website link of her work to me on weChat and I put our works together. I designed the still part of the turning wheel and Joy designed the moving wheel and we made their turning direction differently. then came the part of watching the laser cutting. we both come to 823 to learn things about laser cutting. and watched our wheels being cut. however, one of the wheels which is the still one should have a hole in it. but instead, the whole was not being cut. after consulting with professor Rudi, we know how to design it. we need to first make a bigger rectangle and then put the rectangle we need inside it and made the whole. after some time, we manage to cut out the piece we need. and the part of putting them together is rather simple. and after installing the program on Arduino, we successfully made the wheel spring. 

3. the process generally goes as planned except for the part where the hole was not cut through. what we have learned is how to draw things using the website. also, we know how to make a perfect hole in our works without making it fall apart. in addition, we learn that in order to make our shape after rotation beautiful, we should make the original shape strange. what we also learned is how to make the two shapes into one website. 

Final-Project-Essay

1. the name of my project is “Memory”

2. the problem it is addressing is Alzheimer’s. according to WHO, there are over 15.2 million people with Alzheimer’s making this disease deserve serious attention. however, most people still regard this disease as a bad memory and of no importance.  my project will allow users to experience the day of a patient with Alzheimer’s; by doing so, people will understand the patients’ difficulties. thus more attention will be given to this kind of disease. the targeted audience is not the patients but those young people who thought this disease is far away from them. by interacting with this project, people will be able to understand Alzheimer’s is just around the corner in our life so they can pay extra care to those with Alzheimer’s.

3. first, my partner and I will make a big maze in the shape of a house with all the furniture inside it. then I will put some light sensors in the place where people will usually go in their daily routine. and the light was shed on the sensors, then a piece of animation will be played showing pieces of memory with music. what the audience should do is use two turners to control the light and explore the whole house. if they have succeeded in going around the house in the right order which is the order of a person’s daily routine then the whole house will light up with full music instead of only pieces of music. 

4. I think this project is a typical interaction project in which the person moves something on the computer and the computer will react. this accord with my definition of interaction. the computer doesn’t know what the movement of people means but it can still react accordingly.  

Amelia’s Eighth Documentation Blog

1. I didn’t know what we were doing after watching the video. so I consulted a learning assistant who told me that it is using the potentiometers to draw pictures. so I first downloaded the initial code successfully can found it worked. the ball can move as my potentiometers move. then the question is how to make the trace materialize because now we can not see its trace. so I asked professor Rudi how to do it and he told me to define a line from the previous position of the ball to the current position of the ball. that’s exactly what I did but still, I couldn’t see the trace. then Christine the learning assistant told me the reason which is the problem of background. because my previous setup made the black background cover the trace once it is drawn because it is outside the loop. so I move the setup of the background inside the loop and then I can see the traces. 

2. what I have learned is that we should check what is inside the loop and what is not before running the whole process. the whole process mainly go as planned and I succeeded on my second try. the interaction involved is using the potentiometers and there will be patterns on the screen. after seeing what we have drawn, we can then decide our next step in drawing which is interactive.

3. here are the pictures and videos

4. here are the codes 

/**
 * Example sketch for the SerialRecord library for Processing.
 *
 * Receives two integers from the serial port, and uses them to control the x
 * and y position of a circle on the canvas.
 */

import processing.serial.*;
import osteele.processing.SerialRecord.*;

Serial serialPort;
SerialRecord serialRecord;

float prex;
float prey;


void setup() {

  size(500, 500);
  prex = 0;
  prey = 0;
  background(0);
  String serialPortName = SerialUtils.findArduinoPort();
  serialPort = new Serial(this, serialPortName, 9600);

  // If the Arduino sketch sends a different number of values, modify the number
  // `2` on the next line to match the number of values that it sends.
  serialRecord = new SerialRecord(this, serialPort, 2);
}

void draw() {



  serialRecord.read();
  int value1 = serialRecord.values[0];
  int value2 = serialRecord.values[1];

  float x = map(value1, 0, 1024, 0, width);
  float y = map(value2, 0, 1024, 0, height);
  //circle(x, y, 20);
  stroke(255);
  strokeWeight(10);
  line(prex, prey, x, y);

  prex = x;
  prey = y;
} 

/*
  SendMultipleValues

  Reads an analog input on pin 0, and sends a record that contains two values:

  1. Value of `millis()`, modulo 1024.
  2. The analog value that is read from pin 0.

  If you attach a potentiometer to pin 0, you can control this value by moving
  the pot.

  This sketch pairs well with the RecieveMultipleValues example from the
  Processing SerialRecord library
  <https://osteele.github.io/Processing_SerialRecord/>.

  Things to try:
  - Connect a second potentiometer to the Arduino, and send the values from both
    potentiometers, instead of send a value that is based on `millis()`.
  - Send the value from another sensor, such as temperature or proximity.

  by Oliver Steele, 2020-2022

  This example code is in the public domain.
*/

#include "SerialRecord.h"

// Change this number to send a different number of values
SerialRecord writer(2);

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

void loop() {
  int sensorValue = analogRead(A0);
  int sensorValue1 = analogRead(A1);

  writer[0] = sensorValue1;
  writer[1] = sensorValue;
  writer.send();

  // This delay slows down the loop, so that it runs less frequently. This can
  // make it easier to debug the sketch, because new values are printed at a
  // slower rate.
  delay(10);
}
 

5. the second project goes rather roughly because I couldn’t get the signal passed from Arduino to Processing. the name of my teammate is Joy. almost everything didn’t go well. we first download the initial two codes and then we are stuck on how to make the ball bounce. so we approached the learning assistant Iris and she assist us in making the ball bounce. we first fail to understand the mathematical theory behind the code so our ball will bounce beforehand. after some math calculations concerning radius and diameter, we successfully made the ball bounce as is shown. then comes the problem of transmitting the information to the procession and making the motor move. after consulting professors and other classmates, we succeeded in making our code right. but still, the motors do not move or move just once and stopped moving ever since. after consulting Iris the learning assistant, we found we open the Processing before Arduino which made all the problems. after adjusting the sequence we succeed. 

6. what we have learned from this project is to smartly use the resources on the internet and make it the prototype of our code. also, we know how to send signals from Arduino to Processing. the interaction in this project is between the motors and the balls. the two objects do not have consciousness but they can still interact with each other without needing to understand the other’s meaning. 

7. here are the videos. 

8. here are the codes

/*
ReceiveMultipleValues
This sketch repeatedly receives a record that contains a single value, and
uses it to control the builtin LED. The value should be 0 or 1.
This sketch pairs well with the SendSingleValue example from the Processing
SerialRecord library <https://osteele.github.io/Processing_SerialRecord/>.
You can also interact with this sketch from the Serial Monitor. Enter
`100,200` into the text area at the top, and press "Send". Then enter `!e` to
ask the Arduino to send back the last values it received.
by Oliver Steele, 2020-2022
This example code is in the public domain.
*/
#include "SerialRecord.h"
// Change this number to the number of values you want to receive
SerialRecord reader(1);
#include 
Servo myservo1; // create servo object to control a servo
Servo myservo2;
int potpin = 0; // analog pin used to connect the potentiometer
int val; // variable to read the value from the analog pin
void setup() {
Serial.begin(9600);
myservo1.attach(8); // attaches the servo on pin 8 to the servo object
myservo2.attach(5); // attaches the servo on pin 5 to the servo object
}
void loop() {
if(reader.read()){
if(reader[0] == 0){
// do one movement here
myservo1.write(180); // sets the servo position according to the scaled value
delay(200);
myservo1.write(0);
}elseif(reader[0] == 1){
myservo2.write(180); // sets the servo position according to the scaled value
delay(200);
myservo2.write(0);
// do another movement there
  }
 }
}
 
 /**
 * Example sketch for the SerialRecord library for Processing.
 *
 * Maps the horizontal and vertical position of the mouse on the canvas to the
 * range 0…1023, and sends them to the serial port.
 */

import processing.serial.*;
import osteele.processing.SerialRecord.*;

Serial serialPort;
SerialRecord serialRecord;

int rad = 60;        // Width of the shape
float xpos, ypos;    // Starting position of shape    

float xspeed = 2.8;  // Speed of the shape
int xdirection = 1;  // Left or Right



void setup() {
  size(500, 500);

ypos = 250;

xpos = 61;

  String serialPortName = SerialUtils.findArduinoPort();
  serialPort = new Serial(this, serialPortName, 9600);

  // In order to send a different number of values, modify the number `2` on the
  // next line to the number values to send. In this case, the corresponding
  // number in the Arduino sketch should be modified as well.
  serialRecord = new SerialRecord(this, serialPort, 1);
}

void draw() {
  background(0);
  // Update the position of the shape
  xpos = xpos + ( xspeed * xdirection );
   
 
  
  if (xpos > width - rad/2 || xpos < rad/2) { xdirection *= -1; if (xpos > width - rad/2) {
      serialRecord.values[0] = 0;
      serialRecord.send();
    
    } else {
      serialRecord.values[0] = 1;
      serialRecord.send();
    
    }
    
    
    
    
  }
   // Draw the shape
  ellipse(xpos, ypos, rad, rad);
} 

Fina-Project-Proposals

1. the first project’s name is “Lost Memory”. the topic of the program is  Alzheimer’s Disease. it focused on the patient’s experience and make people understand what it was like to lose memory and make clear a point that only a complete memory can bring love and hope. the form of the project is a maze. the maze is made by 3D printing and is covered with a black cloth. the audience will use the computer to control a laser light to lighten up a part of the maze. they need to memorize the way they have gone through to know where they are going. the maze will be arranged as the home of an Alzheimer’s patient. and inside the maze, there are four letters L, O, V, E. if the laser light found one of the four letters, a piece of music will be played. only when four letters are all found and the audience will find the four pieces of music can be arranged into a whole musical piece. only then, the whole maze will lighten up. this project is meant to make the audience realize the meaning of losing memory. but in this project, we also wanted to show that everyone has a light, even if you have lost your memory and need to work hard to memorize the layout of your home. once you have found love or experienced love, then your world will lighten up. 

2. the second project is called “behind the mask”. this project focuses on a special kind of depression. the patient with this depression will not look depressed. instead, they look very happy. but inside they are very sad. the whole program is presented by a man with a smiling mask on him and the lights behind him will shine happily with happy music. but if someone ripped off his mask, then you can see his face with tears and wounds. all lights will go off and start to play sad music. you will wear a device and if you patted his head the light will light up a bit, if you hold his hand then the light will light up a bit. only when the lights all light up, you will find it will form thank you on the screen. this project is meant to raise awareness of the so-called smiling depression. people need others to find out that they are not happy actually and need warmth. if you can give them some comfort, they will be very happy.

3. the third project is about knowing a person. we may be able to see and hear a mother person who is very far away from us using modern technology, but we can’t see them emotionally. this project is about transforming the heartbeat of someone into music and then transforming music into a drawing. heartbeat at different frequencies will correspond to different music and we will use different shapes to draw that music out. this project is meant to let people not only see and hear the other person but also see and hear their heartbeat. so that the distance between people and people is closer. 

4. here are the sketches for my projects.

Final-Project-Research and Analysis

1 now I think the definition of interaction is that more than two participants involving in one project and jointly make efforts for that project with or without intention. my explanation for this definition is that according to Ernest Edmonds,  “Dynamic-Interactive: All of the conditions of the dynamic passive category apply with the added factor that the human ‘viewer’ has an active role in influencing the changes in the art object. ” this means that it can be called as interactive if one just walks across a project and that project reacts in response. in that sense, the intention of interacting is useless and the response from the other party is not intended to be intentional. the response only needs to exist. 

2. the first project I use to prove my point is the “Drawing Machine” by Balint Bolygo. in this project, one pen will automatically draw what was felt on the other end of the pole. in this project, the two participants are the pen and the object being painted. the object being painted doesn’t have the intention of interacting with the pen but its existence is enough to assist this project from completing. it is interactive in my definition in this sense. also, the pen’s interaction with the object is very obvious. 

3. another project I was going to use to illustrate my definition of interaction is “Flying Machine for Your Hand” by Dukno Yoon. in this project, a person will use his or her hand to make a device flap its wings so that it looks as if it is flying. the two participants in this project are the hand and the machines. again, the machine doesn’t have the intention of participating in the project but its existence is to promote the project. and the reaction of the machine is not intentional, it’s mechanical but this project is still interactive. 

Amelia’s Seventh Documentation Blog

1. this time, our recitation is about how to link the sound with the light strap as well as connect the light strap with the computer. first, we are asked to link the computer with the light strap and make sure the program works. then we are asked to use the computer and the mouse to control the light strap so that it was more interactive. also, it is required that we should make the circle change as the music goes on. lastly, the requirement is to blend the two codes and make the light strap change as the music goes on as well as make the music interact with the shape on the screen. 

2. the whole process is fairly successful. however, there was something wrong with the Arduino part, because I opened two pages on one Arduino so it doesn’t know which one to run. I asked one of the learning assistants and found out about this question. finally, I manage to solve this problem with their help. also, I forgot to close all serial monitors so I wasn’t able to run it. also, when blending the two codes, I first determine the direction of wanting to change the color of the lights as the music plays. so I use the map function to make the color correspond with the volume. but I forget to insert the import part into the code as well as define the sound. after some help from learning assistant Christine, I managed to mend those mistakes and successfully made my whole code works. 

3. I have achieved what I was set to do. what I learned is how to make Arduino and Processing work together. also, I learned how to insert an audio file into the Processing. I have also learned the lesson that always first define something before using it. also, we should know the logic of different loops and put them in the right order. 

4. here are my project’s videos, pictures, and code. 

/* This is a code example for Processing, to be used on Recitation 7
 You need to have installed the SerialRecord library.
 
 Interaction Lab
 IMA NYU Shanghai
 2022 Fall
 */

import processing.serial.*;
import osteele.processing.SerialRecord.*;
import processing.sound.*;

Serial serialPort;
SerialRecord serialRecord;

int W;         //width of the tiles
int NUM = 60;  //amount of pixels
int[] r = new int[NUM]; //red of each tile
int[] g = new int[NUM]; //red of each tile
int[] b = new int[NUM]; //red of each tile


SoundFile sample;
Amplitude analysis;

void setup() {
  size(600, 200);
  W = width/NUM;


  // You can use this syntax and change COM3 for your serial port
  // printArray(Serial.list());
  // serialPort = new Serial(this, "COM3", 9600);
  // in MacOS it looks like "/dev/cu.usbmodem1101"
  //or you can try to use this instead:

  String serialPortName = SerialUtils.findArduinoPort();
  serialPort = new Serial(this, serialPortName, 9600);
  serialRecord = new SerialRecord(this, serialPort, 4);
  serialRecord.logToCanvas(false);
  rectMode(CENTER);

  // load and play a sound file in a loop
  sample = new SoundFile(this, "qian.aiff");
  sample.loop();

  // create the Amplitude analysis object
  analysis = new Amplitude(this);
  // analyze the playing sound file
  analysis.input(sample);
}

void draw() {
  println(analysis.analyze());
  background(66, 118, 227);
  noStroke();
  fill(245, 236, 54);

  // analyze the audio for its volume level
  float volume = analysis.analyze();

  // volume is a number between 0.0 and 1.0
  // map the volume value to a useful scale
  float diameter = map(volume, 0, 1, 0, width);
  // draw a circle based on the microphone amplitude (volume)
  circle(width/2, height/2, diameter);

int n = floor(map(volume, 0, 1, 0, 60));
  r[n] = floor(map(volume, 0, 1, 0, 255));
  g[n] = floor(random(map(volume, 0, 1, 0, 255)));
  b[n] = floor(random(map(volume, 0, 1, 0, 255)));

  serialRecord.values[0] = n;     // which pixel we change (0-59)
  serialRecord.values[1] = r[n];  // how much red (0-255)
  serialRecord.values[2] = g[n];  // how much green (0-255)
  serialRecord.values[3] = b[n];  // how much blue (0-255)
  serialRecord.send();            // send it!
} 

Amelia’s Sixth Documentation Blog

1. this assignment is about letting us draw our own poster about an IMA activity that has an animation in it. we also need to make a picture full of one single pattern and make them interact with the user. we hope to achieve a moving image that can both interact with people and have practical use. my homework piece was inspired by the smiling flowers.

2. for the poster. I first put in the words IMA and repeat it and every time made it smaller with a different color. then, I write about the Fall 22 End-Of-Semester Show below the words “IMA” in yellow. and write 6 pm-8 pm at the top of the words “IMA” while making “IMA” blinks. after that, I write a huge L, and above it, I write the location of this event. at last, comes the animation part. I first draw a circle and then draw two triangles on top of it. then the problem is how to make the combination move. I first use random coordinates for the triangles but then I found it was too much work to make the triangles move so I use one variable to represent the whole triangles and the circle and use millis to make the whole pattern move up and down. for the homework, I first make a single smile and then make the image print every time it moves to the right and below. after that, I make one smile appear at a random place in the background. at last, I make the mouth turn right and left with the move of my mouse. 

3. the plan didn’t go as planned because I was planning to make a beautiful poster but it turned out very extremely ugly. I think the problem is that I was trying to put too many things inside one poster and made everything too big and important. if I can make it again, I would make emphasis a single thing instead of making everything important. I learned from this project that we should always try to use as few variables as possible to represent the shapes so that it will be easier to move them. also, I learned how to use the function of “map”. the homework piece went as planned, although if time allowed, I would make them colorful. but because I don’t have enough time, so I didn’t do that. 

void setup() {
  size(1024,768);
}
void draw() {
  background(225);
  for (int i = 64; i< width; i += 128){
    for (int j = 64; j < height; j += 128){
      smile(i, j);
    }
  }
  
  //println(mouseX, mouseY);
}
void smile(float a,float b){
  circle(a,b,128);
  circle(a,b,5);
  float value = mouseY;
  float c = map(value, 0, 768, PI/2, PI);
  float d = map(value, 0, 768, 0, PI/2);
  arc(a,b,64,64,d,c,CHORD);
  circle(a-64/3,b-64/3,64/3);
  circle(a+64/3,b-64/3,64/3);
  
} 
void setup() {
  size(1024,768);
}
void draw(){
  background(225);
  
      float a = random(64,960);
      float b = random(64,704);
      smile(a, b);
    
  
  
}
void smile(float a,float b){
  circle(a,b,128);
  circle(a,b,5);
  arc(a,b,64,64,PI/4,3*PI/4,CHORD);
  circle(a-64/3,b-64/3,64/3);
  circle(a+64/3,b-64/3,64/3);
  
} 
void setup() {
  size(1024,768);
}
void draw() {
  background(225);
  for (int i = 64; i< width; i += 128){
    for (int j = 64; j < height; j += 128){
      smile(i, j);
    }
  }
  
  //println(mouseX, mouseY);
}
void smile(float a,float b){
  circle(a,b,128);
  circle(a,b,5);
  arc(a,b,64,64,PI/4,3*PI/4,CHORD);
  circle(a-64/3,b-64/3,64/3);
  circle(a+64/3,b-64/3,64/3);
  
} 
void setup() {
  size(1024, 768);
}
void draw() {
  background(225);
  float h = millis()%3000;
  float h1 = map(h, 0, 2999, 360, 768);
  circle(860, h1, 180);
  triangle(860, h1-112, 735, h1+81, 983, h1+81);
  triangle(739, h1-56, 998, h1-50, 859, h1+81);
  
  textSize(250);
  text("IMA", 320, 300, -120);
  fill(98, 118, 227);
  textSize(200);
  text("IMA", 360, 400, -240);
  fill(226, 98, 227);
  textSize(150);
  text("IMA", 400, 470, -360);
  fill(98, 227, 121);
  textSize(100);
  text("IMA", 430, 520, -480);
  fill(245, 231, 79);
  textSize(50);
  text("IMA", 460, 540, -600);
  String s = "Fall 22 End-Of- Semester Show. ";
  textSize(30);
  text(s, 460, 550, 120, 320);
  textSize(300);
  text("6-------8", 20, 200);
  textSize(30);
  text("pm", 190, 190);
  text("pm", 970, 190);
  textSize(100);
  text("Friday Dec 16th", 180, 110);
  textSize(700);
  text("L", 0, 730);
  textSize(50);
  text("ocation", 124, 680);
  textSize(100);
  String s2="8th Floor";
  text(s2, 120, 340, 230, 320);
  noStroke();
  
  int m = millis();
  noStroke();
  fill(m % 255);
  println(mouseX, mouseY);
} 

Amelia’s Fifth Documentation Blog

1. this is the image I choose.

I choose this image because the lines are easy and there are many basic shapes in this image so it is easy for me to do my painting. another reason why I choose this is that I enjoyed Harry Potter very much and always want an owl of myself so I wanted to draw an owl to satisfy this wish. 

2. I plan to first draw a triangle with two circles as the owl’s head and then another two circles as the eyes of the owl. I’m going to use a line and an arc to draw the owl’s wing and two arcs as the body of the owl. the tail will be using a triangle. the feet will be using a few lines. I lost my paper drawing so I couldn’t put it here. but here is my final version of the owl.

it is generally similar but the head is a bit different from the original painting. also, the eyes are not linked together and the mouth is a bit lopsided. in general, the head is not big enough. and the tail is not as beautiful as the original one. 

I don’t think Processing is a good way of realizing my design. because it can only fill in the color with neat shapes, it can not fill in the color between lines where there’s no shape. also, it is difficult to adjust the shape so that the ends can meet. also, I first didn’t realize that you can input a negative angle in the brackets so I failed to make perfect shapes. also, I didn’t realize that you can only fill in colors within shapes so I fail to fill in colors as well. but I asked professor Rudi and solved the questions. 

here is my code for the painting. 

void setup() {
  size(600, 600);
}
void draw() {
  // Your drawing code goes here
  background(41,88,14);
  //noStroke();
  line(325, 368, 341, 378);
  line(341, 378, 338, 386);
  line(325, 368, 333, 380);
  line(333, 380, 331, 390);
  line(325, 368, 325, 381);
  line(325, 381, 320, 389);
  line(359, 351, 375, 362);
  line(375, 362, 376, 369);
  line(359, 351, 368, 365);
  line(368, 365, 367, 370);
  line(359, 351, 362, 367);
  line(362, 367, 360, 371);
  fill(147,110,65);
  triangle(212,99,403,97,303,157);
  fill(222,207,190);
  arc(277, 275, 267, 200, PI/2, PI,OPEN);
  arc(278, 235, 280, 280, -PI/5, PI/2,OPEN);
  triangle(240,233,239,155,390,156);
  triangle(240,156,300,157,266,135);
  triangle(300,157,347,129,391,155);
  fill(222,207,190);
  stroke(222,207,190);
  triangle(144,276,277,378,392,155);
  fill(188,145,93);
  arc(165, 193, 167, 167, -PI/4, PI/1.5,OPEN);
  fill(175,173,173);
  arc(234, 120, 67, 67, 0, PI+PI);
  arc(380, 120, 67, 67, 0, PI+PI);
  fill(98,85,70);
  triangle(167, 86, 435, 86, 301, 120);
  fill(147,110,65);
  triangle(166,333,135,330,149,352);
  fill(41,13,20);
  ellipse(231, 125, 30, 30);
  ellipse(378, 125, 30, 30);
 
  
  println(mouseX, mouseY);
}