Talking Fabric Final Project: Love Always Wins in Triangle Identity

Date: 2018/5/14

Project Name: Love Always Wins in Triangle Identity

Documented by: Angelina Ye

Demo:

Inspiration:

  • I start this project with an idea to do something about Allyship
    • Allyship is not an identity—it is a lifelong process of building relationships based on trust, consistency, and accountability with marginalized individuals or groups of people.
    • Unlearning and re-evaluating beliefs and actions
  • In terms of the media to convey this message, I think of LED matrix. My first idea was to create some game on the LED matrix, such as Tetris and Snake game, however, after trying to work this idea for two weeks, I finally give up because of two reasons: 1) to create an interactive game on the LED matrix is beyond my own programming skills; 2) these two game settings do not match with the Allyship idea I want to convey and do not contribute to convey the key message. Later I came up with the LOVE flag idea, which is to raise a heart flag on the LED matrix by spinning the potentiometer and giving arduino different values.
  • Thanks to Antonius, he inspires me to discover the story behind Ally logo and the importance of triangle patterns. Then I find that the triangle patterns have some historic meanings and they were used to indicate prisoner identity in WWII, then I start my idea of reconstructing the triangle identity
    • Triangle Badge has been used in Nazi concentration camp as part of the system of identification in Nazi camps. They were used to identify the reason the prisoners had been placed there.
    • The use of a triangle being a sort of visual shorthand to symbolize all camp victims.           Source: https://en.wikipedia.org/wiki/Nazi_concentration_camp_badge
    • I want to do a project in response to the camp identification system, and I want to create triangles with different color and different shapes to stand for different identities. The users can define what the triangles mean to them by themselves and choose the ones to “pin” on their T-shirt, and they can change their identity combination at their will and wish at any time. The “pin” is actually the stick of the potentiometer, which can be used not only to control the LOVE flag to raise up on the LED matrix, but also “pin” the colorful triangles on the T-shirt.

Key Message:

Your pride will “empower” the love.

  • I hope everyone to be proud of their identity
    • Wearing different Triangle Identity on the Ally T-shirt
    • Put on different identity combinations
    • No identity discrimination any more
  • Love will always wins
    • Press the “Pin” to light up the LOVE flag
    • More identities pinned, easier to light up the LOVE flag
    • Love is Love

Process:

Actually I struggled a lot in the whole process of identifying my idea and programming for the LED matrix, and great thanks to Antonius for continuous support and guidance along the way.

  1. LED Matrix testing

Two important lessons to learn here: 1) Understand the version of LED matrix you will use before searching for sample codes and do the programming; 2) If you still have no idea what to do with your LED matrix, search for the instruction book with the exact version online, and it will be your best friend! From this instruction, I understand how it works and connects my circuit based on that:

I tried the sample code to test my display a test pattern:

 

Tried to use potentiometer to change the LED patterns:

Then I did the programming to create the heart flag pattern raised up in the LED matrix by using potentiometer to send different values:

After the code worked well to raise the love flag, I removed the two breadboards from the LED Matrix and redesign the circuit and use male wires to connect, in order to make it less bulky and more wearable on the T-shirt.

2. Sewing the LED matrix and the circuit onto the T-shirt and design the T-shirt:

I sewed the LED matrix and the circuits all inside the T-shirt, and started to work on how to design the front side of the T-shirt. At first I was thinking of putting a upside-down triangle in front of the T-shirt and put decorations on it. But when I put them all on, I found the upside-down triangle seem unnecessary and too noisy to convey the idea of Allyship, at that time I realized the concept that “Less is More”.

 

 

So I removed this triangle and looked for other possibilities. Antonius inspired me to discover the meaning of triangle patterns here and take advantage of the stick of potentiometer. Therefore I came up with the idea of using triangles of different color and size to indicate different identities, and use the stick of the potentiometer as the pin to stick the triangle on the T-shirt. Although it is not by design and might be the magical power of nature, I found that the more identity triangles “pinned” to the T-shirt, the easier it is to raise the love flag by simply pressing the top of the stick, which I think is also a beautiful metaphor.

 

Improvement:

  1. The circuit inside the T-shirt is still bulky, so next time I will try to use the Lilypad to reduce the size of these components.
  2. I will try to place a soft button on the “pin” stick, and hope it will provide users a better sense of pressing to raise the lOVE flag.
  3. So far there are too many wires inside the T-shirt, which might be not safe when people wear it, especially when it is raining. Therefore I hope to find a new way to have less wires and make this T-shirt more wearable.


/*
   Example Code for an 8 x 8 LED Matrix
   For More Details Visit http://www.tinyurl.com/yhwxv6h

   Displays a test pattern lighting one LED after another
   To Play around with modifying the bitmap, un comment Example #2
*/


int speed = 5; //the delay time in milliseconds

int pauseDelay = 1;    //the number of milliseconds to display each scanned line

//Pin Definitions
int rowA[] = {9, 8, 7, 6, 5, 4, 3, 2};   //An Array defining which pin each row is attached to
//(rows are common anode (drive HIGH))
int colA[] = {17, 16, 15, 14, 13, 12, 11, 10}; //An Array defining which pin each column is attached to
//(columns are common cathode (drive LOW))

//The array used to hold a bitmap of the display
//(if you wish to do something other than scrolling marque change the data in this
//variable then display)
byte data[] = {0, 0, 0, 0, 0, 0, 0, 0};
int x;

//Setup runs once when power is applied
void setup()
{
  Serial.begin(9600);         //Open the Serial port for debugging
  for (int i = 0; i < 9; i++) { //Set the 16 pins used to control the array as OUTPUTs
    pinMode(rowA[i], OUTPUT);
    pinMode(colA[i], OUTPUT);
  }
  data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[2] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[3] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[4] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[5] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[6] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[7] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  x = 0;

}

//repeats
void loop()
{
  //Example #1 - test pattern
  //Run a small test program which lights up each light in time
  //  test();

  //Example #2 - static image
  //Display a defined bitmap
  resetMatrix();

  x = map(analogRead(A4), 0, 1023, 0, 10);
  Serial.println('x' + x);
  // heart 
  if (x == 1) {
    data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00000000;
  } else if (x == 2) {
    data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00000000;
  } else if (x == 3) {
    data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B00011000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B00111100; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B00111100; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00011000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00000000;
  } else if (x == 4) {
    data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B01100110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B01111110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00111100; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00011000;
  } else if (x == 5) {
   data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B01100110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B01111110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B00111100; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00011000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00000000;
  } else if (x == 6) {
    data[0] = B01100110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[1] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[2] = B11111111; //row 1s bit mask (1 LED is on 0 LED is off)
    data[3] = B01111110; //row 1s bit mask (1 LED is on 0 LED is off)
    data[4] = B00111100; //row 1s bit mask (1 LED is on 0 LED is off)
    data[5] = B00011000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[6] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
    data[7] = B00000000;
  }
  

  showSprite(speed);
}

//An array to store power values to act as bit masks
const int powers[] = {1, 2, 4, 8, 16, 32, 64, 128};

////Runs a pattern where each LED is lit one after another
//void test() {
//  for (int i = 0; i < 8; i++) {
//    for (int ii = 0; ii < 8; ii++) {
//      data[i] = data[i] + powers[ii];  //Goes through each row of lights lighting each column one after another
//      showSprite(speed);
//    }
//  }
//
//  for (int i = 0; i < 8; i++) {
//    for (int ii = 0; ii < 8; ii++) {
//      data[i] = data[i] - powers[ii];   //Goes through each row of lights turning off each column one after another
//      showSprite(speed);
//    }
//  }
//
//}
void resetMatrix() {
  data[0] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[1] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[2] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[3] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[4] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[5] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[6] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
  data[7] = B00000000; //row 1s bit mask (1 LED is on 0 LED is off)
}
void showSprite(int speed2) {
  for (int iii = 0; iii < speed2; iii++) {               //show the current frame speed2 times
    for (int column = 0; column < 8; column++) {          //iterate through each column
      for (int i = 0; i < 8; i++) {
        digitalWrite(rowA[i], LOW);                      //turn off all row pins
      }
      for (int i = 0; i < 8; i++) { //Set only the one pin
        if (i == column) {
          digitalWrite(colA[i], LOW); //turns the current row on
        }
        else {
          digitalWrite(colA[i], HIGH);  //turns the rest of the rows off
        }
      }

      for (int row = 0; row < 8; row++) {                  //iterate through each pixel in the current column
        int bit = (data[column] >> row) & 1;
        if (bit == 1) {
          digitalWrite(rowA[row], HIGH);                   //if the bit in the data array is set turn the LED on
        }

      }
      delay(pauseDelay);                       //leave the column on for pauseDelay microseconds (too high a delay causes flicker)
    }
  }
}

Week 14: Net Art Project Documentation (Krom)

Project Name: Unveil Old Paintings in Windows 98

Link: http://imanas.shanghai.nyu.edu/~alk510/windows98/login/

Team member: Adele and Angelina

Demo:

Idea Description:

Both of us have great interest in paintings and we want to create a Net Art Project that gives the user a brand new experience to explore the famous paintings in a new narrative. So we first came up with the idea of unveiling the famous paintings, which will guide user to scratch off the black layer above the famous painting, and when more and more parts of the painting shown, users can guess which one it is and continue their attempt to unveil the whole painting.

Besides that, in order to create a nostalgia feeling, we pixelized all these famous paintings, and created the Windows 98 system as the environment and the drawing window as the background for these pixelized paintings. We also add different background music based on the style of each painting in the unveiling part to further engage users and entertain them in this beautiful journey of appreciating beautiful paintings.

Process:

  1. Pixelization of famous paintings
    1. To create an interesting narrative to view and appreciate these famous painting, we decided to pixelized each painting by using Photoshop, and the effect can be seen below:

  1. Create the fake unveil effects
    1. Firstly, I intended to put the background picture(the painting) at the back and have the black layer on the front to mask the painting behind. This logic makes sense because the foreground black layer is on top of the background painting. However, I could not find a way to achieve this effect. Then I consulted the amazing TA Chuyi, and she inspired me to draw the whole black layer, and to stamp the stroke of paintings on top of the black layer when the user press the mouse and drag.  She also shared a great resource the codepen to us about how to achieve this effect, which is extremely helpful for us to build upon our idea. So we learned from this method and try to stamp the background painting on the black layer to achieve the effect we want.
    2. Inspired by this idea, we used five steps to achieve the unveiling effect: 1)clear the temp, 2)stamp the drawimage(cavas.draw) on the temp, 3)stamp the black layer on the temp, 4)stamp the old painting on the display canvas and 5)stamp the temp on the display canvas.
    3. set a limitation time for each stroke. Great thanks to Codepen: https://codepen.io/curthusting/pen/fkCzh.
      1. In order for users to scratch off the black layer step by step and gradually discover the painting beneath, we need to set the limitation time for each scratch stroke. So here I create a counter to count the time when the users have their mouse down, and when the counter reach the number of 30, this scratch stroke will finish, and the users can click to start a new stroke.

  1. Add the old Windows system features
    1. Opening page

2.Login page

3.Desktop

User testing takeaways:

The user testing is extremely helpful to us, and we get a lot of useful suggestions and advice from our peers:

  1. Add more music option
  2. Have a login page also in the style of windows 98
  3. Create an ending page with all the paintings

Reflection:

I think the final result seems quite satisfactory to us and it is exactly what we want to achieve in our initial design. The windows 98 system, the function of unveiling old paintings, and the music all match the theme perfectly. However, if we have more time, I think there is still some details we can further polish and build upon the current version, and there are three main perspectives:

  1. Add more gaming methodology based on the function of unveiling paintings to engage users more and make the whole art project more playful.
  2. Add more real functions in terms of different painting strokes, which give the user more freedom to try any effect they want on the old paintings.
  3. As the user spend more time on the scratching off the painting, the pixelized effect will get more and more strong.

 

Sound Making Wristband

Partner: Kai, Sarah, Arizona and Angelina

Material: 4 wristbands, tilt sensor, remote, breadboard, portable battery, Arduino kit,

Project Description:

In this group project, we made a sound making wristband that can play a sound of tone 640 when the user pressed another wristband (with remote inside) and tilt his or her wrist (with tilt sensor inside).

A potential future application of this project is to have 7 wristbands playing 7 notes (do, re, mi, fa, so, la, si) wearing by different people. Then they can make up a Wristband Chorus. With a conductor getting everyone to play ensemble or synergy, the Wristband Chrous will hopeful play any songs at their wish.

DEMO:

Procedure:

a) Idea Generation

The final idea is actually a combination and recreation of everyone’s own individual idea from brainstorming process. Arizona wants to make a yoga band which can evaluate the difficulty level of different yoga postures and give bonus to the users by triggering different sounds. Sarah wants to make a dress which trigger beautiful music when the sleeves touch the skirt. Kai wants to make a T-shirt which can show different colors according to people’s movement. And I want to make a pair of shoes that can give users instant feedback (such as sound or vibration) based on different

distances the user can walk or run through. The most beautiful thing is we connect everything together and makes a wristband that is intended to track the users’ movement, and give instant feedbacks by trigger sound.

b) Arduino Placement

We used wristbands to hide all the components including breadboard, Arduino kits, battery and the remote. Our initial idea is to hide everything in a single wristband so that it will be more flexible and neat. One of the most important thing to achieve this goal is to have Lilypad to replace the bulky Arduino Uno board. However, it later turned out that we could not find the correct package to communicate to Lilypad, therefore we finally gave up the idea of using Lilypad, and used three wristbands to hold the components. Therefore in the following steps, we all use Arduino Uno but not Lilypad to connect to the other components.

 

 

c) Breadboard Components

On our breadboard, we used a remote sensor, a buzzer, a LED light and resistor. Although we will remove the LED in the final version, we find it really helpful to have it in the testing process, because it can perfectly indicate whether the circuit connected or not. And I think in my future circuit planning, I will reserve a place for some indicator to better control the risk of each step. For the testing code, we use the sample code in the Arduino package, and based on that, we programmed the Volume+ and Volume- buttons to trigger two different tones.

 

d) Tilt Sensor

To add the tilt sensor into the remote, we cracked more than 5 remotes. Great thanks to Antonius for teaching and showing us patiently on how to make the best use of the remote by taking it apart  and connect it to different components (for example by using conductive tape to make the circuit always short) to play out different functions. And we tried reconnect the circuit here by two means: 1) solder the button of the Volume –  to make it always on; 2) take out the battery and connect it to the tilt sensor. For the first part, although we tried for a lot of times with different approaches, it did not work out finally, so we used the conductive tape instead. For the second part, it worked perfectly in the prototype and we soldered the tilt sensor and the battery firmly to connect with the circuit in the remote.

 

Reflection:

As a prototype of the Sound making Wristband, I think our project works well in terms of function. However, it is still far away from our initial idea of making a Wristband Chorus. Actually therefore are three main parts we can further work on to achieve a better result. The first thing is about the size of the wristband, we hope to find a way to use Lilypad to communicate instead of the Arduino Uno therefore we can hide everything in the Wristband in a more neat and flexible way. Secondly,  so far the user still need to press the button to trigger the sound, which might demand too much inputs from the user and undermine the flexibility of a wristband. We intend to solve problem by soldering the button to make it always on. When we found it failed, we used the conductive tape to achieve that. However, at last we found it is still too loose and need users press it by themselves. It would definitely be better if we can optimize this part as well. Last but not least, if we put more efforts in the remote design and make it more sensible and more functional when the user tilt their arm, the project will be more interesting by triggering different sounds with different user interactions.

#define BUZZER  10                        //Connect Buzzer to Digital Pin 10
#define LED_RED 11                        //Connect a Red LED to Digital Pin 11
#define IR_IN   8                         //Connect the Infrared receiver to Digital Pin 8
 
int Pulse_Width=0;                       //Pulse width
int  ir_code=0x00;                       //IR command code

void timer1_init(void){                  //Initilize timer
    TCCR1A = 0X00; 
    TCCR1B = 0X05; 
    TCCR1C = 0X00;
    TCNT1  = 0X00;
    TIMSK1 = 0X00;  
}

void remote_deal(void){                         //Get IR command
    Serial.println(ir_code,HEX);
    switch(ir_code){
    case 0xff00:                                //Press stop button on the remote controller
        digitalWrite(LED_RED,LOW);              //Turn off red led
        digitalWrite(BUZZER,LOW);               //Silence the buzzer
        break;
    case 0xfe01:                                //Press VOL+ button
        tone(BUZZER, 784, 1000);
        digitalWrite(BUZZER,HIGH); ;             //Turn off Red LED
        break;
    case 0xf609:                                //Press VOL- button
        tone(BUZZER, 640, 1000);
        digitalWrite(BUZZER,HIGH);              //Turn on Buzzer
        break;
    }
}

char logic_value(){                                         // The function determine the logic value "1" and "0".
    while(!(digitalRead(8)));                               //Wait low 
    Pulse_Width = TCNT1;
    TCNT1 = 0;
    if( Pulse_Width >= 7 && Pulse_Width <= 10 ){               //low level 560us
        while(digitalRead(8));                                //Value is high, then wait.
        Pulse_Width = TCNT1;
        TCNT1=0;
        if( Pulse_Width >= 7 && Pulse_Width <= 10 )            //High level 560us
             return 0;
        else if( Pulse_Width >= 25 && Pulse_Width <= 27 )      //High level 1.7ms
             return 1;
    }
    return -1;
}

void pulse_deal()  {                                 //Receive address code and command code pulse function
    int i;   
    // Run 8 zeros
    for(i=0; i<8; i++) {
      if( logic_value() != 0 )                       //If it isn't 0.
          return; 
    }
    // Run 6 ones
    for(i=0; i<6; i++) {
      if(logic_value()!= 1)                        //If it isn't 1.
          return;
    }
    // Run 1 zero
    if(logic_value()!= 0)                          //If it isn't 0.
        return;
    //Run 1 one
    if(logic_value()!= 1)                          //If it isn't 1.
        return;
  
    //decode the commands of IR remote control codes 
    ir_code = 0x00;                                  //clear
    for(i=0; i<16;i++ )  {
      if(logic_value() == 1)   {
        ir_code |=(1<<i);
      }
    }
}

void remote_decode(void){                          //decode function
    TCNT1 = 0X00;       
    while(digitalRead(8)){                         // Value is high, then wait.
      if(TCNT1>=1563) {                            // High level duration exceeds 100ms,which means "no button pressed".
        ir_code = 0xff00;
        return;
      }  
    }
    
    // High level duration doesn't exceed 100ms.
    TCNT1 = 0X00;
    while(!(digitalRead(8)));                           // wait low
    Pulse_Width=TCNT1;
    TCNT1 = 0;
    if(Pulse_Width>=140&&Pulse_Width<=141) {            // 9ms  
        while(digitalRead(8));                          //Value is high, then wait.
        Pulse_Width=TCNT1;
        TCNT1=0;
        if(Pulse_Width>=68&&Pulse_Width<=72) {          //4.5ms
          pulse_deal();
          return;
        }
        else if(Pulse_Width>=34&&Pulse_Width<=36){     //2.25ms
          while(!(digitalRead(8)));                    //wait low
          Pulse_Width=TCNT1;
          TCNT1=0;
          if(Pulse_Width>=7&&Pulse_Width<=10){         //560us
            return; 
          }
        }
    }
}

void setup(){
  unsigned char i;
  pinMode(LED_RED,OUTPUT);                      //Set red led pin output
  Serial.begin(9600);
  pinMode(BUZZER,OUTPUT);                       //Set buaaer pin output
  pinMode(IR_IN,INPUT);                         //Set ir receiver input
}

void loop(){  
  timer1_init();                                //timer init
  while(1){
    remote_decode();                            //decode
    remote_deal();                              //Run decodeerout
  }  
}

Week 11: Response to Rachel Greene (Krom)

Rachel Greene gives a great introduction and description of what Net.Art is and how it evolved and revolutionized throughout the development of the internet history.

The most interesting for me is to see how the internet ensures the environment and provides the motivations for people from all over the world work together to create something unique and meaningful, even though maybe none of them know who their co-workers are. I think this is the most beautiful thing about Net.Art to me.

Another important feature of Net.Art is that it goes beyond the limitation of identity and position, and only cares about the collective efforts and accumulated innovations. Besides that, I think the anonymity also encourages people to voice their opinion freely and the immediacy of seeing and sharing facilitates the process people sharing information and also leads to the limitless information flow. After reading this article, I begin to appreciate all the Net.Art I see today because I realize now how valuable and critical every person’s contribution is.

Week 11: Response to Paul Rand (Krom)

In Rand’s “Computer, Pencils, and Brushes “, he points out the importance of developing mind and manual experience and criticizes the over dependence on technology and tools. He explains that even though computers are usually regarded as “creative tool” to innovate and design people’s unique ideas, essentially they are the same as other writing tools such as pencils and brushes.

I agree with Rand on this comparison because it is humans’ creativity and knowledge that make codes meaningful and unique. Even though the outcome does not look the same comparing pencil, brushes and computers, the essence of the creation itself is the most important element that differeciates it from the others.

Rand also argues that the problem with computers is that it is changing people’s conception of learning and encourage people to be more lazy in terms of thinking. Personally I disagree with Rand’s argument to instrumentalise the computers and simplify people’s thinking abilities. In his argument, I can see his mindset that the past is always better than today, and even the tools people used to use seem less effective compared to the technology and skills today, the meaning of that can never be replicated and replaced. It is common that people tend to be nostalgic about the beautiful things in the past and rationalize their preference by emphasizing on the shortcomings of the latest replacements, but I do not think this is a legit reason to refuse and reject any new invention today. For example, Rand discusses about how the designing process on the computer and printing process to make the prototype come into shape is different from the totally manual work in the good old days, and his argument reminds me of what Walter Benjamin refers to as “diminishing the aura of the artwork”. But I think manually writing does not make any difference to digitally printing in terms of idea creation, and that is the most important part at the end of the day.

Week 10: Response to Paul Graham (Krom)

I really enjoyed reading Paul Graham’s “Hackers and Painters” as it offers a new perspective for me to understand hacking and coding. In his article he argues that hackers are like painters and computers are just a kind of new medium to support artists to express themselves in a new form.

He discusses the similarity between hackers and painters, and also points out the difference between hackers and engineers, which is really interesting to see and it totally refreshes my understanding about the hackers. And this idea also enlightens me to think about which category the computer technology is more inclined to, science or art?

Before reading this article, I only saw computer technology and coding methodology as part of the science, because it has strong dependence on numbers and logics. However, after reading this article, I begin to realize the aesthetic value of the computer technology as a way for humans to express, to interact and to change. It is really beautiful to realize that. Also, it reminds me of a quote from one of my Math-major friend: “The ultimate form of Mathematics is Art”. I think it is so true for computer technology. It is based on the rule and logic people designed and implemented, but there also exists great randomization in the computer world which is usually hard to experiment and analyze in the real world. The existence of randomization in the computer technology actually brings the most valuable property to humans, and uncertainty itself is a kind of art.

I think what Graham might disagree with Rand is that Graham regards computer science as a tool linking today to the future, which brings huge benefits to humans, while Rand regards computer science as a disaster that ruins the beauty of the past. Personally I agree with Graham’s view and I think that the tool will never stop the creation and preservation of great ideas, so the only thing humans need to consider is not how current technology downplays our value, but how we can take advantage of the tools we have in hand and paint the bright future by ourselves.

Interactive Video | The Mystery of the Missing Essay

Team members: Chris, Dora, Angelina

Project Name: The Mystery of the Missing Essay

Link: http://imanas.shanghai.nyu.edu/~crp378/interactivevideo/

Description:

For this interactive video project,  we present a NYU Shanghai student’s life in the academic building with something strange and horrible haunting around her that our audience can relate themselves to. 

Our interactive video begins with a brief background introduction, and with a cute START button on the left:

After clicking START, the story begins with Lauren gets off the shuttle bus, walking into the elevator and thinking about where to go next. We put the main character Lauren’s to-do-list at the very beginning of the video so the users get to know her plan for the day. Here users can make the first choice for her. For the options here, we put the elevator image of both 4th floor and 8th floor, and the user can type the floor they want to go to.

If they type in other numbers, the “Invalid floor selected” notification will pop up and encourage the users to type in for the second time.

Option1: Library(4th floor) vs Piano room(8th floor)

If the user choose the 4th floor, they will see Lauren press the 4th floor button and goes into the library.And on the to-do list, a tick will appear on the task “Print out the essay on the 4th floor” (The similar process will also work if the user chooses to go to the 8th floor)

Then when she prints out her essay, she found it is actually swallowed by the printer and prints out something like a clue card with 3 numbers on that. She then wonders whether it is room 606 or 909. And here the user can make the second decision:

Option2: Room 606 vs Room 909

No matter which option the user chooses, the story will end up with Lauren locked in Room 909. Then the user can choose to click “Play again” to figure out what the other option will lead the story to, or click “here” to figure out why the unexpected plots happen and the reasons behind that. For example, for the piano plot, the reason is that the piano is muted accidentally.

We create this story in order to show that a lot of strange or weird things happen for some trivial reasons people might not notice and know. In these cases we should try to keep calm and look for the potential reasons behind that, instead of being panic about that and scare ourselves, otherwise we will fall into a horrible loop that continuously frighten ourselves and leads us to the situation we can not control.

Process:

  1. Discuss about the main idea

We first decided on the type of story as a horrible one, and used the branch narratives to present that. We also discusses the pro and cons of having one character or two characters, and finally decide to have the story with one character, for the reason that the user will feel closer to the character and make the decision on their own instead of being distracting by anything else.

2.  Draw the storyboards

We first wrote about the whole story in the flow chart and later we find that it is really hard to shoot films properly without storyboard. Therefore later we came up with a storyboard with all the positioning details of objects which really benefits our later shooting experience. The evolution of our main storyline can be seen below:

3. Shoot videos

The equipment: Canon 6D, tripod, Tascam field recorder and gorilla tripod.

When my team tried to shoot the walking scene with camera moving, we found that the video is very shaky and cause the effect to be too dizzy. Then professor Krom gives us really helpful suggestion by fixing the camera on a wheel chair and keep it shoots in a stable way. During the process of shooting, we put what we learned in class into practice, and followed the rule of thirds and keep our main character always on the same side of the screen, which make the whole video more consistent and professional.

4. Edit videos

One important lesson we learned when editing and uploading the movie is to do a good video folder management:

 

We shoot several videos in different places on different dates, so when I upload them onto the google drive to share with my team members,  there are several different folders (video, Edited video, New video, realVideos). And later we found that it might confuse people which video is which, and it usually wastes a lot of opening the wrong file again and again. Therefore we realized that the most efficient way and effective way can be to name the files with the content and version, so that no matter who sees it on the google drive, he or she will have a general idea about the content inside (As shown on the right).

For editing videos, we tried both iMovie and Premiere, and we found that iMovie is really helpful for beginners to edit the video and change the details in a rough way, as shown below for general color change:

But the thing is if we want to make delicate changes, for example if we want to change the background color tone and keep the human skin color still natural, it is really hard to use iMovie to achieve that. And Premiere can do the job pretty well by using Color correction to adjust Highlight, Shadow and Midtone, so the color change will be more accurate and easy.

5. Webpage coding

For the Webpage, Chris did all the coding and we discussed together to make a classic layout. There are several steps we think highlights the final design:

  1. We changed the basic buttons to either image button or text box to make it look better.
  2. We use the same font and design for all the texts both in the video and on the webpage, which makes the whole project more consistent.
  3. We use most of the percentage method to adjust the size of the image and video in order to ensure it keeps the same format when displaying on different laptops and different servers.
  4. We test all the different ways the users can play around with the buttons and text boxes and ensure that every choice will lead to a satisfying outcome.

Reflection:

In general, I am very proud of this interactive video project and I really enjoyed working with both of my partners. Each of us fulfill our own individual task efficiently and effectively, and when we put everything together, the whole project works pretty well. We make a detailed plan of the timeline to decide on the story, to shoot the video, to edit the clips and to write codes since the spring break makes the working time a little bit tricky. The timeline works pretty well and prepares us to have everything on track.

In terms of the content, I think the plots are interesting, but if anything to improve, I hope to bring in more connected plots that can explain the whole story in a more logical and reasonable way. And personally I also hope to include a second character to complicate the situations and make the whole story more interesting and engaging if we have another chance.

And the most important takeaway about this project is that it opened a new door for me to learn and practice how to create a interactive web content, including adventure stories, educating game (like the liar detecting webpage by Roy, Ally and Nicole) and detective stories from zero to one, which is really cool for me personally. And I definitely can see millions of possibilities it will bring to me in the future.

 

Talking Fabrics | Social Switch | Hug Light

Project Name: Hug Light

Partner: Dania

Material: LED strip, Arduino kit, battery, T-shirts

Main Concept:

We want to make sweet T-shirts which will light up when people hug each other. And in order to indicate the idea more clearly, we also decorate the T-shorts with heart-shape plug and socket, therefore when the plug meets the socket, the LED strip light up and warm the huggers. For the T-shirts as the base, we used my T-shirt from NYU Shanghai and NYU Florence. Therefore we think it can also be functioned as NYU Alumni T-shirt when NYU students meet after graduation (Sadly I am now a Senior).

Process:

  1. Prototype our idea on a plain model, we use the conductive tape to achieve the effect that hugging activates lights by creating some gap between the tape on one T-shirt. And when the two T-shirt touches, the circuit connects and works, and the lights are turned on.

2. T-shirts ready

3. Pattern design

 

4. Solder the LED strip and connect it to the Arduino

DEMO of attaching the circuit on two T-shirts:

DEMO of attaching the circuit on one T-shirts and use the conductive tape to connect:

 

 

 

Week 9: StoryBoard for Group Video Project (Krom)

Group Members: Angelina, Chris, Dora

Our aim of doing this interacive video project is to present a NYU Shanghai student’s life in the academic building with something strange and horrible haunting around him that our audience can relate themselves to.

We are going to present the main character’s to-do-list at the very beginning of the video. Viewers are encouraged to choose different decisions for the main character, in order to help him finally figure out the truth behind a series of mysterious things and who he actually is. Our main storyline can be seen below.

Week 9: Response to Walter Benjamin (Krom)

In The Work of Art in the Age of Mechanical Reproduction, Walter Benjamin discusses how the industrial society transformed the art. Two different manifestations showed the significant changes in art, that is, the reproduction of works of art and the art of the film. The former change enables more people to have the access to enjoy the art, but at the same time weakens the uniqueness and permanence of the art, especially eliminates the cult value of the artwork. What’s more, reproduction destroys the aura of the art with lack of its presence in time and space, weakens the authenticity, uniqueness and external value of the art, especially eliminates the cult value of the artwork and its unique existence at the place where it happens to be.

But at the same time it also significantly strengthens the exhibition value of the work, which expands the influence of the artwork and leads to the contemporary mass movement. Another change leads to the advent of the films, with the characteristic of transitoriness and reproducibility. The films cause distraction to spectators while art demands concentration. It changes the function of art from requesting the spectators’ concentration to recreational pastimes. Art is no longer based on cult culture but political purpose from the author’s perspective. But at the same time it makes the reservation of valuable moments become possible.

This article has also reminded me of the movie Modern Times with the similar discussion about the advent of the technology that would bring revolutional changes to the industry. In the movie it shows the bad living and working condition of workers during Great Depression. It can not only reflect the history of that time, but also has realistic significance for us to learn a lesson today. During the times of machinery, capitalists exploited workers to achieve biggest profit. There’s a sharp contrast in the film that when Chaplin was in the jail, he lost freedom, but he didn’t have to worry about employment and hunger. But when he was in the street and in the factory, he had freedom but was worried about unemployment and hunger all the time. From the movie it is not hard to discover that the spread of machinery use threatened workers’ employment and made workers to become the slaves of the machines. And I believe the movie still has constructive meaning today because human lives are invaded more and more by technology and machinery. It’s hard to judge whether human beings are the masters or the servants of the technology. If putting it through Benjamin’s lens, I think that if we don’t have movies and reproduction of the art, we will not be able to have the access to great movie like Modern Times today. Therefore it is without denying that the mechanical reproduction is an irrefutably great benefit to the artwork by the industrial method in terms of spreading, but not subliming.