Assignment 4 - Data Critique

I did this assignment as a conceptual project.


Data collection becomes a tool for us to know ourselves today. We post blogs, twitters, instagrams. We took hundreds of selfies. We become more forgetful about true memories but remember forever with self-tracking data.  Would we understand ourselves better by going over all of our past post again? Are they representing the real us? Are we modifying our lives and characters by polished words and pictures? Are we who we are on social media?

For these questions, I was thinking about hosting an event or party, asking people wearing a mask generated by their selfies on social media, and let them hangout with friends and strangers.




There are two options to generate the mask after people registered the event and sent their social media account.

1) Choose the selfie which got the most likes, and use a 3D Face Reconstruction tool to make it.

2) Morph all the selfies together as one face, which has more problem about merging different face angles, then use 3D Face Reconstruction tool

Then make the mask with colored 3D printing and give it to the person before the event.



Assignment 3 -Spatial data

For this assignment, I treat it as a chance to learn new tools in class, such as mapbox.


Public surveillance and privacy is a hot topic today, so I was wondering the surveillance camera setting in this big city. Is it covered everywhere? Is it too dense to cause concern?


1. Download data from here into google sheets

2. Translate address to coordinates in google sheets with tutorial from here 

camera sheets.jpeg

3. Visualization and editing in Mapbox


Final outcome



The translation from address to coordinates is definitely inaccurate, which needs to improve by a new solution.

The  visualization choices in Mapbox is very limited.

Data is not verified. (Should we consider the verification of data source when we use it? )

Assignment 2 - Text data

As a group with Manning and Pan, I was in charge with data finding and basic processing.

Idea building

When we talk about text data, we talk about meaning, communication, emotion, and expression. Since all of us are fans of the TV show <Friends>, we thought about using the scripts of this show as our data source. We were thinking about different kinds of data visualization of this script, such as places they went to in NY, relationship or intimacy between these six characters according to time, and personal characteristic analyzing from each one's words choosing. But finally we decided to try something different from visualization, vocalization.

Then we had this conversation about creature communication with each other without words, like bird. So what is going to be like when we have no text and talk like a bird in a super abstract way, can we express ourselves very well? Can we sense the emotion from each other?

Finally we settled down our idea about "script vocalization in a abstract way".

For this assignment I really want to treat it as a chance to learn node.js with this sentiment library . I failed before our presentation, so I did data processing in Excel, again, for my team. After that I spent more time on it and figure it out as below.


1. Data collection

I kept this 10 seasons <Friends> script for a long time. It's a large quantity of data, so we choose on episode, episode 10 in season 7, as our data source.

2. Basic data analyzing

1) clean up raw data


2) analyse sentences' sentiment in Node.js and export result to team member so that they can play music based on character name and sentiment scores in p5.js.

var sentiment = require(‘sentiment’);
var fs = require(‘fs’);
var path = require(‘path’);

var filePathRead = path.join(__dirname, ‘friends.txt’);
var filePathWrite = path.join(__dirname, ‘friends-out.txt’);

var readStream = fs.createReadStream(filePathRead, ‘utf8’);
var writeStream = fs.createWriteStream(filePathWrite,’utf8’);

//read file and split it to myData[][]
readStream.on(‘data’, function (chunk) {
var myData = new Array();
var data = chunk.toString().split(‘\r’);
for (var i = 0; i < data.length; i++) {
//console.log(“data[“+i+”]:” + data[i]+”\r\n”);
myData[i] = new Array();
myData[i] = data[i].split(“:”);
//console.log(myData[i][0]); //all the [][0] is the name of scentence speaker
// for(var j = 0;j// console.log(“myData[“+i+”][“+j+”]:”+myData[i][j]+”\r\n”);
// }

readStream.on(‘end’, function(){
//console.log(“length of myData:”+myData.length);

function getSentiment(data){
for(var i = 0; i for(var j = 1;j data[i][j]=sentiment(data[i][j]).score;


In this project, I went through the whole Node.js basic tutorial which is super helpful for my future skill set.

Assignment 1 - Data Self-Portrait

Final piece:


I feel interesting that someone says "you might present yourself as someone else on anonymous social networks". That makes me curious about how I look like on internet. So I made this self-portrait according to 7 years' data from my most used social network website, Weibo, which is a Chinese version of twitter. Each row is one month and each dot is one day. The different shapes of dots represent different number of my posts on that day. This is the evidence of my existence on this digital public. It show's how I appeared on and gradually disappeared from this web public.




Home page of my Weibo

1. Data collection

The website only allow me to download some useless data, so I found a crawling tool called gooseeker, which can automatically grab specific informations on webpages. Then I got all my 1894 posts in 7 years as a .xml file.

2. Data screening and rough analysing

The raw data has so many information, but I only need is the time I posted. I separated the"year-month-date time" column with function "text to column", counted posts based on dates by function "subtotal", then inserted zero-post dates to the timeline using formula "=IF(ISERR(VLOOKUP(F2,B:C,2,)),"0",VLOOKUP(F2,B:C,2,))", finally I got the "date to post number" set, and a rough graphic analyzation to get better understand of this data set.

Raw Data

Raw Data

Final data set with rough graphic analyse

Final data set with rough graphic analyse

3. Translate number to image

I manually separated every month as a column and replaced the number to different symbols, so that I can get a image by screen capture.


4. Image processing in Photoshop/Text editing in Illustrator


The Nobody

Yes, it got a name, Nobody! This week I made him move a little.

This idea comes from the scene that when I see the moment someone is really focusing on or obsessing with his own work, I just super want to say "Hi" or disturb him, and see his reaction...


1. Coding and testing

2. Making the scene

I used clay again to make the Nobody, modeling it with a thick wire in the body and a thin long wire in the head which let it can pass through the body hole. Then I made the floor, desk, chair,and laptop with cardboards. The laptop had a LED in it trying to make it like a real computer screen. (Standoffs are really useful and save me lots of time on all these legs.)

3. Connecting with Arduino

This is a simple circuit with one microphone sound sensor, a servo motor, and a LED. I decided the servo's position first based on the Nobody, then just roughly collected all other parts into the under layer.

4. Assembling

I'm so lucky that I bought these two boxes separately in Container Store and they were perfectly matched! It saved me bunch of time that I just needed to focus on the inner part.


1) I haven't figured out how to sense the knocking direction, and how to dynamically sense the default decibel when there's nothing happen.

2)The head moving is not smooth enough.

3) I didn't mount the servo on anything. Because the iron wire passing through the body was not technically straight, the head is moving better when I let the servo move with it a little. It must had a better way than iron wire.

4) There is no switch! Since I don't want people see the power supplier so I used batteries placed in the box, which made me confused about how to make a switch...

Synthesis workshop: balloon

Lin and I did this on the workshop. We spent some times to figure out "don't open web editor and arduino serial monitor at the same time" and "keep the p5.serialcontrol open". The only problem was that we were so frustrated with the web editor then.

Materials: Brick Story

The final product of this week below.


1. Dig a hole on a brick

I picked a brick from a construction site near my home and dig a hole on it using the pointed end of a hammer, then painted its side part white.. In my design, the LED supposed to be flash like a wave and had some color change effect. But it was difficult than I thought to dig a deep hole for Arduino board on a brick. But after that I knew there's a kind of drill bits can do that efficiently...

2. Pouring wax

The hole was a irregular shape and I wanted to make the surface half translucent like a water. So I picked colored wax after thinking about some modeling materials. If I poured wax directly into the brick, I would never pull it off, so I used cling film as a isolator. In order to save some spaces to LED, I put some beans under the cling film to occupy the space.

I water heated the wax to liquid and poured it by couple times.

3. Make a little character

I hand-maded the character with clay, baked it to dry, and refined the appearance.

4. Combine elements

I drilled a hole for the character's legs and refilled some wax to fit the shape. The character can help user lift the wax lake.


1. The wax is not translucent enough to let people see the brick texture under it, which is the main reason I chose brick to do this. And it's very fragile since the edge of the wax lake is thin. But I haven't found another material to replace it.

2. The brick is not rough enough to get the strong contrast feeling between materials. Seems like it is made by concrete which make it clean and hard to drill.

3. The way that I put the LED in it is super dumb!


Plan A:

I tried to build a box for my team filming project in video&sound class, and I drew a sketch, bought a black 12cm*12cm project box, a white spray paint to change the box's color, and some plastic standoffs.


1) I found out the standoff couldn't match the hole on the corner of the box, so I drilled the holes bigger, but not fitting well.

2) The design of acrylic top was totally wrong. I didn't find a good solution to make a joint for the cover.

3) Painting is so hard! I sprayed too many layers on the box and couldn't know when it would dry. Then I got a finger printed scratched bumped box that I had to discard it. (It's so depressing everything seems wrong that I forgot documentation, sorry.)

Plan B:

The final enclosure below.

First I laser cut the acrylic sheet to compose the top part.



The acrylic got so mach stains, and even more next morning. I used a gel glue which gave me a good control, but still got this stain mass.

The bottom part of the enclosure is a firm paper box of my beats ear pod. I putted some cardboard supporting in it, and manually drilled two holes for USB and DC plug.  

Coming soon:

Because of delivery delay, I haven't got my buttons and toggles now. I will keep updating this blog.


Observation: laundry card machine

This is the machine which sell and recharge laundry card in my living building.

Your assumptions as to how it’s used

If I never saw the machine, considered its function, I would assume:

1) There were 2 buttons - "new card" and "recharge".

2) Asked me insert old laundry card if I choose recharge.

3) Let me input the number I want to pay for a old card, or showed me how much I have to pay for a new card.

4) Asked me to swipe bank card, insert cash or coins.

5) Showed me the value of my laundry card now and returned it.

Describe the context in which it’s being used

It's in the mailbox area at the first floor of the building. It's quiet and clean. When residents in this building need to buy a new laundry card or to add value to their old card, they will go downstairs and use this machine. Rare people use it and there is definitely no one hurry you when you do it.

How people use it, what they do differently

I was waiting there and met one people tried to buy a new card. She looked the machine for a long time, holding her purse, searching the first thing she need to do. After she found the instruction on the small screen over the keyboard, she was confused about where was the button and which was the correct one among these three purple button. Then she pressed the right one, swiped her credit card, looked at the screen again, waited for few seconds, took out the output laundry card and receipt. After that she still checked the screen for a while, then left.

what appear to be the difficulties and takes the longest

Finding out "the first step" instruction seems difficult and takes the longest.

What appear to be the easiest parts and takes the least amount of time

Swiping credit card and taking out the laundry card and receipt are easy and spend lease time.

How long the whole transaction takes

Almost 1 minute.

How the readings from Norman and Crawford reflect on what you see

The interface of this machine is not a good design. Even it has the affordance of input, output and card swiping, which make some parts of the process easier, its instruction is barely visible because it appears on the unexpected small screen. Also, the mapping of button and indicator is worse, since there is a relatively long distance between them. The whole keyboard attract user's most attention, however it has the least function in the whole process. All these design confuse user and lower the effectiveness of interaction.


Promotional video - week 1

Stephanie, Jade, and I as a team, worked out our first concept of our video project this week.

Description of the product

- Summerized by Stephanie.

The Memory Pill
What if you could buy someone’s memory? Or record every emotion you felt and play it back exactly as it was? Would you want to? 
The Memory Pill temporarily alters the biological formation and experience of memories. It operates in two states: record or experience. When taking a blank pill, users record all that they experience for 24 hours. Emerging from their belly button, the 24 hours are physicalized into a memory growth . Upon removal of the physical growth, it is uploaded to the Universal Memory Bank  and reconstituted into an experience pill.  Browsing the Universal Memory Bank, individuals can download, print and then ingest the experience pill of someone else, or from their own catalogue of uploaded memories. But while the potential experiences of an individual have now exploded, what does it meant to share memories? How can multiple people experience a moment from a single point of view? How is the “memory” reinterpreted? Would this enable ‘true’ empathy? Is empathy ever possible—or do we only attempt to empathize and are completely able? Swallow and find out.


- Drew by Yuan (ACT 1) and Jade (ACT 2).

Laser cut: snack plate

Final product below:

The idea came from paper garland, and I found the pattern from web.

Since the acrylic sheets are harder than paper, I tried the design with cardboard first.

I accidentally found out the shadow was beautiful. If I had a opaque acrylic sheet, I could carve some sentences between two edges, then it would have the sentences on the shadow when it was under appropriate light. But, I just recklessly bought a transparent clear sheet and didn't have time to buy another one for this assignment.

Then I started the first try on acrylic sheet (3mm) with a small model. I heated the joints and bent them one by one from outside to inside.

The problems are: It broke when the temperature was not high enough, and the angle of each joint was different. After I practiced, I got some experiences of this job.

After that, I laser cut another bigger one with more circles and with words carved at the bottom as decoration. I used wood sheets to secure the bending angle of every joint. It was still not that perfect because the wood left marks on the heated soft acrylic.

However, the outcome seems fine, and also has the beautiful shadow under light.

P.S. When I pictured it, I broke one of the edges in the middle. I think the acrylic sheet should be thicker than 3mm to make sure it's strong enough. And I can make a longer round headed wood piece to be the angle controller next time.

Sketch of week 2

  • The circle controlled by the mouse.
  • The background shapes flash over time, independently of the mouse.
  • The background color is different every time you click.

Make multiples of something

If I want to make 100 wood stars, what should I do?

Since it is 100-stars, I want to make a long piece of wood with a star shape intersecting surface, then I can easily cut it to a lot of pieces with no matter how thick I wanted. Then I think about to make a pentagon bar with 5 triangle pieces gluing on it, and also I need to make some jigs to cut the angles.







I made 3 jigs, but none of them worked as I expected. I ran out of my time and still don't know how to make straight cutting.

As a compromise, I chose to use a easier way, the sander. I finally got my pentagon bar, even this process only worked for 6 now, not for 100. Then I glued, drilled, and re-sanded them to make an earring box.

I haven't figured out the angle-cutting problem. I will keep trying.


After I finished this documentation, the idea came out that maybe I made jigs right but use them wrong. For example, I tried to stable the jig-01 on the left hand, then just push the bar through the saw. I should try place the jig-01 at the right hand and push the bar with it just like my sketch.

And another problem: the jigs I made can only be used for cutting the first 2 edges of the pentagon !

Sound story: Bloodchild - Gan's emotion room

This sound story is based on the narrator - Gan's emotion change. The listener should imagine walking into a room which is showing Gan's feelings changed with timeline.

We recorded most parts of the sounds from our daily lives, except the gun shot, glass smashing, women screaming, and background music.

Dianna and I discussed the story and both brought out the first idea about what we want to tell in the sound. The first agreement was making a one piece song with multi layers to express the reader's thinking - it is a horrified disgusting alien story, but with some kind of warm family love in it. But this plan would make the sound too short and has no arc in it. So we finally decided to use Gan's shifting emotion to construct the sound's structure.

Then we decided what kind of sounds we needed in each part - the happy childhood with little awkward background, the frightened scary feeling about giving birth, the struggled denial and fighting with new informations, and the last grown-up accepting with little sad. We focused on finding and recording matching sound in our daily life separately for 4 days. I chose to walk from WTC to NYU, expecting to find some surprises, and I did find some. For example, I accidentally got the awkward sound coming from the escalator's rub handrail in a mall of WTC, the carousel music and rain drop at the playground of my living community, and the the underground train noise on the street, etc. The serendipity is, I also got a traditional chorus of indians from my neighborhood and two country musics from Washington Square. How beautiful are they!

Dianna and I both wanted to try editing, so we decided to do our own sound stories and put them together at the end. I found a guitar album in my old hard drive by chance, and solved the music searching problem. I tried not only to cut and connect the guitar song to an ideal duration, but also to edit the recorded natural sound to fit the rhythm of each background music. Dianna also got some amazing effects such as the bubble sound. We cut and combined the good parts from each of our works, and dowloaded some necessary sound pieces from internet, the women screaming, the gun short, etc.

I truly enjoyed this assignment, because I found so many beautiful things from my normal life, and this is the first time I used english to discuss serious subject with partner from a different country. In order to understand each other better, you need to listen, guess, and reconfirm everything patiently. It is hard, but fun.

If I had a second time to do the project, I would do it with more details by adding more interesting sounds and effects.

My screen drawing

This is my evil p5.js monster.

I used Adobe Illustrator to draw the sketch First. Because at the end, it will look clean and have all the coordinate informations I needed when I put the mouse point on each shape points. However, typing in all these coordinates into p5.js is still annoying.

I found out that the "arc" function is very hard to use, since the reference is not that clear and make me confuse. I checked the original code in javascript to understand the "PI" and angle things.