Week 14: Emily’s Final Project Documentation (Cici&Alvin)

Name of the project: Food Trip

Type of the project: Internet Art Project (utilize html, css, javascript (&p5), photoshop and more)

Group members: Emily & Frances

Link of the project:

Description of the project:

This project is an internet art project based on website, applying coding like html, css, javascript and especially p5, and other techniques like photoshop. Our project is an educational mini-website targeting on kids who always love junk food and its name is Food Trip. So basically, the project is about a little journey for a little cute character the user selected. User will go to three different pages and there will be three interactions:

  1. “DIY bubble tea”
  2. “Draw a unique hamburger”
  3. “Snap as a French Fries”
The intro page of our project

Two little characters user can select from


We first just decide to make a little website about food only for entertainment and aims at people of all age. However, we then find it hard to design a website that appeals to every body and we want to find a meaningful social benefit for it, too. Fortunately, after the class proposal, thanks to Cici and Alvin’s suggestions, we finally figure out what we really want to make–an educational website only targeting on kids. It is not a limitation but rather, an opportunity to make our project more specific and more concrete. After working out an initial plan, we then divide our work mainly into two parts–coding and photoshop, I am mainly responsible for the coding part while Frances doing the photoshop. But it does not have an absolute line, in other words, we do everything together and it is a fantastic cooperation. 😊

How our project works:

As what I mentioned before, our project will first have a page for user to select the character they like and then it will begin with the first one–“DIY a bubble tea”. This one mainly applies p5 and user can choose whatever ingredients they want, including sugar and ice. The best function is what I learnt in Jiwon’s workshop! The color bubble!

(press space to let them move!)

But after clicking on the “pack it” button, there will be a pop-up window at the side telling you that the bubble tea is actually not healthy and kids shouldn’t drink them too much. Playing this little game online is more than enough 😂.

The pop-up window and when you onmouseover, there will be another animation telling you it is actually incorrect.

(on-mouse-over will change)

And after clicking on the button next, user will go to the second page, which is “Draw a unique hamburger”. This part involves p5 again and also a tiny community. For this part, we use filter effect and also critics from our users. And user is also able to save the drawing they draw to their desktop with the filename “hamburger”.

screenshot of part of the page 2

And when user click “finish drawing”, there will be a pop-up window again and if continues, there will be page three which utilize webcam. User are able to take photos of themselves and the image will automatically become the “brand” of a cute French fries.

(of course, there will be a pop-up window again 🙈🙈🙈)

And at the end, we will have a map page again so that user can choose to play which part they like again and again ! ☺️☺️☺️

We really wrote a lot of codes this time and this is really a challenge to both Frances and I, I think in total, there are nearly one thousand lines or even more 😭 but it is really also a big break- through!

(screenshot of a little part of the coding which is about give a button a value and put it in an if condition to control)


In general, I think our project is very successful because the final effect is very satisfying. Though there are still some regrets like we fail to figure out how to make user’s drawing appear at community which is really a pity. But in all, I really like this project and I hope that it is a perfect ending for my communication lab journey! ❤️❤️😊❤️❤️!

Week 11: Response to Web Work: A History of Net Art (Cici&Alvin)

In this article, Rachel Greene clearly illustrates the origin and development of what he calls, the “net.art”. As he depicts in his work, Internet is not only a tool like a painting brush (like what we have just read), but rather, it is a platform with abundant freedom for creation and art. As is known to all, freedom and liberty are necessary, or even indispensable for great creation of art. Therefore, with the birth and rapid further development of “net.art”, many “net.art” communities are established and developed at an amazing rate. Also, as Internet features convenient connections and communications, it’s very simple for those communities to contact and interconnect with each other. Easy access to other groups who share a similar idea is the prerequisite for cooperation and unity, while the collaboration will  generate great power which is not only in terms of art, but also many other areas like social issues, politics or even revolutions.

This is interesting for me because before, I only consider the power of art on a very limited level.  I used to hold a firm belief that art is only an elegant way for entertainment and it can at most affect issues related to art. However, after reading this article, I begin to realize that art, especially “net.art”, is not only a way to amuse, but instead, it is a crucial way to express an individual’s opinions or sometimes a community’s appealing and ideas. In this way, I think net artists are somewhat like a group of politicians with elegance and wisdom–they use graceful lines rather than cold policies to sketch the blueprints of their ideal society; they are also like gentle revolutionists, who use brilliant colors instead of violence or weapons to fight for justice, love and freedom.

(source from Web Work: A History of Net Art)

When I saw this net art, the first thing occurs to me is Modernism. Because they are not traditional style of art but kind of like an attitude, a strong belief which pursues freedom and liberation. This really impresses me because I realize that art is also an inheritance. Though medium keeps changing, the main spirit of art can be well preserved  and improved from generations to generations.

However, “net.art”, the paradise for liberal art, is also facing threat and restrictions. Greene also mentions that the freedom should be guaranteed and preserved. Yes, freedom is important, but we have to give this freedom an extent. In other words, does absolute freedom really a good thing for net art and even our society? Or shall we limit it on a scale which is both appropriate and safe? Lack of freedom is a dark prison without hope while extreme freedom is just a relative to chaos and disorder. For art, for society, for ourselves, in my opinion, freedom is like salt, yes, it is crucial and significant to life, but once taken too much, it can also cause harm or even death.


Week 11: Proposal for Internet Art Project (Cici&Alvin)

Project name: Little Johnny’s food trip (just temporary, very likely to be changed 😂)

Project type: Internet Art Project (utilize html, css, javascript (&p5), audio, video and more)

Group members: Emily & Frances

Description of our initial ideas of this project: 

For this project, Frances and I decide to mix all what we have learnt before and since we are all girls…we really want to do something cute and interesting. Therefore, after a long discussion, we reach an agreement on our topic–“food” and our project’s name is ” Little Johnny’s food trip” ( temporary). So in brief, our plan is to make a mini website about different food, which involves audio, video and interactions with Javascript animation. This time, we will provide our users with very detailed instructions and will design our layouts as both clear and attractive. In regard to the style, we will make it like cartoon and use a lot of drawing similar to my previous comic project.

How our project works:

We will have a home page which is like a map with several “food shops” (handmade?) and a little character named Johnny. User can click on button to decide which shop to go. And we will use animation here, when user choose a shop, the little character will automatically walk to that shop just like real shopping. And we now have designed three “shops”.

One is a dumpling shop, here is like a little game. Users can choose what they want to put in the dumpling. To add fun, we may provide some crazy material, too. Then if the combination is good, the little character will appear to be content, while if not, the little character will throw up and even die.

The second option is a hamburger shop called NYU Donald’s. User can draw their ideal hamburger through p5 animation. We will also have some images drawn by former users at the bottom of the page and new user can give them comments and mark stars to show how much they like them.

The third one is NYU cafeteria…This part is mainly a video using what we learnt about film editing. We will film the cafeteria food and students’ remarks on those food. And at the end we may have some new interactions which haven’t been decided yet.

This is only our initial draft plan. We may make some or even a lot of adjustments to them later.


Week 11: Response to “Computers, Pencils and Brushes” (Cici&Alvin)

Are we gradually become the loyalest willing slaves to computers? Are we lost in the coding world with illusory 0 and 1? What is our mind? What are the real ourselves? And, where is the happiness? All these questions are what came to my mind after I read this article.

As the author argues in the article, we are more and more manipulated by computers nowadays and this has become a serious social problem. With the increasing use of new techniques featuring computers, people gradually forget that computers are also tools like pencils and brushes instead of “gods”. We grow into more and more dependent on computers and in the end,  “lose the precious experience of practicing, revising and reflecting”. It is creepy that if the cost of using modern technique is sacrificing our own humanity, is it really worthwhile? (source:www.pinterest.com)

As far as I am concerned, it may sound like a cliche, but computer is indeed a double-sided sword. The key point is how we design it and how we use it. We are living humans and we should be the one who take the initiative. For designers, they should design computer towards a better way, a way that is appropriable and good for whole human beings. Computer should be improved and polished towards a better tool instead of a monster who will deprive the freedom from us. While for users, we should recognize that if we over-rely on those techniques, we will make them become “barriers to the link between mind and work”, which is definitely what we don’t want to see. We should treat those tools properly and pay more attention to our mental world. We shall practice, we shall revise and we shall reflect, using our own brain, our own mind, instead of only depending on those electric machines.

Besides, in terms with this topic, computers, I come up with one ted talk I have recently seen, that is What happens when our computers get smarter than we are? by Nick Bostrom. In this ted talk, he talks about the future of human-level machine intelligence. He argues that artificial intelligence may be a big threat to humanity if not used properly. But meanwhile, if we used them in a correct way, to let them help with what we value and help with humanity, the world will become better instead of worse. That is what he said:”We invent super-intelligent AI and have to make sure their perfect safety to humans”. It is hard, but the key point is how we design, same as the assigned reading, which is very impressive and thought-provoking.

Week 11: Response to “Hackers and Painters” (Cici&Alvin)

Hackers and Painters?

Before I read this essay, in my mind, I have to admit that they are two completely different items, or even two contradictory existences. One is scientific and rational, while the other is passionate and emotional. These two images are exactly what those two concepts like in my mind:

(hackers, resource:gettingsmart.com)

(painters, resource:google.com.hk)

However, after reading this profound and meaningful essay, something changed in my mind. I began to realize that hackers and painters are to some extent, very consistent with each other. To support this, the author first points out that “both hackers and painters are makers”, or more precisely, they are both creators. Creativity is a crucial requirement for them because of course, it’s self-evident that painting needs a lot of creativity and inspiration while only few people understand that hackers also need a lot of creativity. Hackers are not mechanical coding machine, their real value exists in creating some new, original, innovative softwares and writing some codes that are beneficial to the whole world. Secondly, another commonality shared by both hackers and painters is that both of their jobs need a lot of time and efforts in order to become perfection. And what’s more, both hackers and painters, at least the real ones, are not only willing to but also strive to achieve the best. An initial draft of coding is like a rough sketch of painting, only after a lot of corrections(debugs) and improvements, can a satisfying software or painting really come to this world. Though, there are many barriers nowadays preventing coding becomes a form of art, for example, many bosses force their employees to code like a machine or as the author defines, ” a robot translating readable language into computer language”, there are still ways we can take to overcome this situation. A effective way may be what the author favors–“hackers having day jobs”. 

Besides the two similarities which are already mentioned above, I also find some thing interesting in this youtobe video clip. According to Agarwal, both hackers’ coding and painters’ painting focus on “the incredible juxtaposition of essentially the micro and the macro”. Agarwal also puts up an interesting point is that “computer language is the only new language we create recently and every one should understand it because it’s important”. I think this point really worth noticing because as computers more and more popular, it may be the time to let computer language takes off.

Week 11: Emily’s Video Project Documentation (Cici&Alvin)

 Name of the project: Seven Deadly Sins of Students

Type of the project: Interactive Video Project on Webpage

Group members: Mostafa, Patricia, Emily

Link of the project:

Description of the project:

Our project is a interactive video project based on website, applying coding like javascript, html, css, and other techniques like video editing and photoshop. It presents seven sins that can happen on students, which are pride, greed, lust, gluttony, wrath, sloth and the last one–envy. We decide to let the main actress performs the first six sins and let a mysterious character to present the seventh sin so that it creates a sense of mystery for our users. The rough story is like this: Vittoria (the main actress) is a girl who literally has EVERYTHING, she is rich and she is beautiful; she is popular and she has good grades…But she still wants more–a handsome boyfriend. One day, however, her dream came true. She began dating a handsome boy and they really had some sweet, romantic time after that. But, suddenly, one day again, they broke up. The boy left Vittoria and she began to go insane–“wrath, gluttony and sloth”. How does all it happen? Is it a coincidence or a purposefully designed plot? In the end, NYU Conan provides his answer and reveal all the riddles. It was the envy girl, a friend of Vittoria, who had planned everything. Isn’t it creepy? THIS IS NOT ALL! We have designed more during the video and after the main video! Go and watch it now! Hope that you will like our project!

The first intro page is like this, as you can see there 
is a "PRIDE",one of the seven sins, on the screen. But itis not all, other six sins will appear too. Based on a
gif made by Photoshop and accompanied by creepy music, we
hope this page can impress you a lot.😊❤️


First, we discussed and decided to use this topic. Second, we worked together for hours and finally worked out the whole plot and the storyboard, which I have posted before. Third, we shoot the film together and we all actually act in the film…It was fun but also tiring because in order to get the best effect, we had tried many different ways to shoot and act. But also, during this process, I found myself better at taking videos and in addition, cooperating with others, which I think is really a big achievement. While taking videos, we also designed the website and the interactions. We discussed for many times and worked together for a lot of time. When we met problems, we would always try to overcome it together. And with the help of Instructors and workshop, we finally managed to realize most effects we design! 🙂

a part of our storyboard

How our project works:

After user click on the link on the intro page, we comes to the main page of our project. As we can see, there are only six sins on the screen and if you move your mouse over those little blocks, they will play a short cut of the video and when you move mouse away, they will pause. In the center is the main video and below the video, as the video is playing, there will be interactions down below with the use of Inner HTML. There will be links or description of the sin which is presented then. We will use the current time function as well.

screenshot of our main page

screenshots of the interaction below the video

(a pop-up window of the interaction part)
(look here we have a link for another page in the comment box, we hope it can help improve our interaction)

In the last, we will have “a secret clip” to explain everything which is super dramatic…

At the very end, a button named “Time to Confess” will appear and if user click it, they will go to a new page to write down their sins and confess. They can submit the input and something interesting will happen again. A window will pop up and there will be an audio to end our whole project. For this part, we apply the use of webcam to work as a mirror.

screenshot of the last page

In the end, I want to show the very beginning of our video which is one of my favorite clips.

A clip of our video 😊

Post-mortem:  In general, I think our project is very successful because we realize the most effects we expected. For the video part, though, the final result is not completely same as we had designed, for example, we are not able to use a WeChat format in one scene, we really create something even more interesting in the end. The last part, the flashback is one of my favorite because it is really exciting! When it comes to the webpage, I would say all our group members have made a really big breakthrough and I really love our web design. For the interaction parts, again, we have made some changes during the process, so it is not entirely the same as we first planned to be. But the new application of webcam is such a challenge and we are all very excited about it for the presentation. Also, the spirit of teamwork and the power of cooperation impress me a lot and I really gain a lot from this treasuring project! 😊

Week 8: Storyboard Update (Cici&Alvin)

Project name: Seven deadly sins of students

Group members: Emily,Mostafa,Patricia

Description of our project: 

We have changed a little bit of the story line because we want to make it more focused and concentrated. Our story will present six sins (pride, greed, lust, gluttony, wrath, sloth ) on the seemingly main actress and the mysterious seventh sin on another mysterious character…(you will know after watching our video 🙂

Description of our storyboard:

We decide to use a lot of different ways of shooting to present different scenes and we really get many inspirations from other films we have watched before. We also try to take some sample shots with our phones to decide which is the best way.

Here are our storyboards…They are a little messy and…abstract…but we hope it can be turned out to be really good video in the end!!!


(part of our storyboards)

Week 8: Response to Walter Benjamin’s works (Cici&Alvin)

There always seems to be an extremely clear line between pure art and mechanically reproduced “art”. The quotation marks are added because according to Walter Benjamin, those “mass reproductions” are only goods instead of real art. From his perspective,  “artwork loses its value as its reproduced” and thus, art should not be mass produced and should not have any relationship with merchandise.

However, is it really impossible to have a real art reproduction? Or is mass reproduction really a one hundred percent bad thing for art?

As far as I am concerned, Benjamin’s opinion may be a little too arbitrary for he regards all mass reproduced art as anything but good. I hold a belief that, although the combination of mechanical reproduction and art has its disadvantages, it also has its own positive aspects that should not be denied. For example, mass reproduction makes art, which used to be only accessible to people with high social status, available for most people in the society.

Take film, which is mentioned by Benjamin in the article, as an example. In the past, only rich people can afford the cost of watching  a film because films are so little and rare. However, nowadays, a ticket for a film is usually below 60 RMB, which means most common people are able to watch whatever they want thanks to the mass reproduction. We can’t deny that mass production does help to spread art and brings art to almost all corners of the world. Especially in today’s Internet era, there are lots of mass reproductions of art floating online and we can get almost whatever we want only by searching them online. Except piracy, which is illegal and immoral, I think mass reproduction of art does provide convenience and promote the spirit of art.

In a nutshell, I think mass reproduction of art has both benefits and negative effects. The key point is that we should have have sincere respect and true love for art. If our original intention is pure and correct, then no matter what forms of art are, we are always able to appreciate the real  beauty of them.

An interesting point I want to bring up is China’s production-line painting workshop, it is in my opinion, a very controversial topic about art mass reproduction. Basically, people in those painting workshops draw paintings exactly like those masterpieces. Those paintings are not meant to fool others into believing that they are true, but are sold as decorations. I wanna ask, what do you think of this issue?

Week 7: Idea of Video Project (Cici&Alvin)

Project name: Seven deadly sins of students

Group members: Emily,Mostafa,Patricia

Description of our project: 

After a long discussion, we decide to name our video project “Seven deadly sins of students“, which includes envy, pride, lust, gluttony, wrath, sloth and greed. This means that we are going to  have a main homepage presenting seven buttons to represent seven sins. When user click one of them, they will enter a new page with a video explaining what the sin is. We may design more interactions for those pages later when we learn more about what we can do for video.

Brief plan for each part:

Wrath: one play “honor for kings” and get angry when defeated

Lust:kiss or hug with bf/gf or looking at beautiful girls on the computer

Pride: Instagram of 10 thousands likes making one pride

Gluttony: Fat guy eating a lot in the restaurant/ ordering food on the Eleme.

Sloth: act “Zootopia”, the flash part

Envy:Someone get A+ in  GPS/beautiful dress

Greed:in Familymart someone want almost everything


Week 7: Response to The Danger of A Single Story(Cici&Alvin)

Studying at such a diverse university with schoolmates from all over the world, it is really necessary for us to understand the danger of those single stories. As is defined in the Ted talk, single stories are those deductions made by people who usually have very limited knowledge about the objects they are judging. This can be dangerous because some stories may contain misunderstandings of other people or culture, especially when they are usually spread at a shocking speed. As Chimamanda Ngozi mentioned in her talk, “A single story creates stereotypes, and the problem with stereotypes is not that they are untrue, but that they are incomplete.”  This means those single stories are usually indeed based on the so-called “fact” or “personal observation”, but the problem is that their perspective is often limited and not thorough. Seeing is not believing, let alone just hearing or assuming. Seeing from a different angle, things can be different or even completely contradictory. This reminds me of some pictures I have seen before:

 (what do you see?) (Turn this picture upside down)

This picture is my favorite, if you see the picture from a different angle, you can see completely different expressions on people’s face. Imagine if you see the first image and you immediately make a deduction that these two people are very happy…But in fact, these two people are enemies like the second picture…This is indeed a dangerous single story and can often be seen in our daily life.

Single stories are dangerous. As a “storyteller”, we should be quite aware of what we are saying and try to get a thorough understanding of the whole thing instead of just guessing and assuming. As an “audience”, we should develop an ability to read those stories critically to distinguish the fake ones from the facts.