Yuyang Hu

• Pros and cons

The benefits of the Web are too much, the most obvious one is that any person can share information with anyone else,anywhere. This function encourages people to share their lives and express their own opinion, which can help a person to understand others and himself.

There are also some ill effects that threatening the Web, for instance, the online habits of the Web users can be monitored, resulting in the endanger of important human rights. In my personal experience, I found that many network platforms will analyze users’ preferences and push relevant information to them according to the links users have clicked on the website. At present, this does not endanger my important power, but it makes me feel monitored all the time, which is very bad.

• Concepts

Here are some interesting concepts that the author mentioned.

Universality and isolation
Universality is the primary design principle underlying the Web’s usefulness and growth, the URI is the key to universality. Isolation can be regarded as a contrast concept of universality, it occurs because each piece of information does not have a URI, it might leads to the limit of innovation.

Open standards and closed worlds
Open standards refers to standards that can have any committed expert involved in the design, that have been widely reviewed as acceptable, that are available for free on the Web, and that are royalty-free for developers and users. Openness also means you can build your own Web site or company without anyone’s approval. In contrast, not using open standards creates closed worlds. It means not all links can be linked via internet, but they are actually separate from each other, which could develop into monopoly.

The Web and the internet
The Web is an application that runs on the Internet, it’s like a household appliance that runs on the electricity network. The two layers of technology work together but can advance independently.

• The Web in the future

Talking about the Web in the future, the author mentioned open data and said that it can help with people’s daily life. Indeed, ten years later, the Web can help us solving more problems in life, for example the map Webs can monitor the traffic condition in real time and tell travelers the best route.

A Lonely Fisherman — Fishing in snow with mountains and rivers

By Yuyang Hu

https://editor.p5js.org/Yuyang-Hu/sketches/KrK4Eorii

The elevator pitch:

A fisherman is fishing on the river in in the late winter with snow falling down, you can control where he goes and create birds and ripples to make the picture more vivid.

 

Abstract:

The world is so big, how can the fisherman is alone and far away from the secular world? Is he fishing? Why didn’t he stir up ripples? Isn’t he fishing? Why did he raise his fishing rod in the deep winter?

The project aims to show the loneliness and desolation of fishermen fishing alone in winter rivers. At the same time, it takes fishing as a symbol to show the traditional hermit spirit of China, that is, living in seclusion in the turbid secular life and dark political environment, not taking up official posts, being clean, and maintaining their true and pure heart. Hope this project can help you calm down and be true to who you are.

Users can interact with the screen by clicking the mouse and keyboard. Click the left and right arrows to move the fisherman’s position, click other keys on the keyboard to generate birds at random positions in the sky, and click the mouse on the lake to create ripples.

 

 

Reflection

As a crazy fan of Chinese traditional culture, I always gain inspiration from the wisdom of my ancestors, for this project, I was inspired by a poem that I enjoyed very much. The poem, Fishing in Snow, described…… I decided to visualize the picture of the poem.

At the beginning I planed to make a game that players can fishing by themselves, but after receiving suggestions from my professor and learning assistant, I think it will be better if I can make a more abstract frame, rather than an entertaining game.

 

Talking about the visual design of my work, I use a large area of low saturation color as the background to create a visual effect of winter snow, and use different gray to distinguish the nearby river and the distant sky. And I have abstracted the elements appearing in my picture, for example, I only drew the outline of fishermen and ships, and the birds are represented by two simple lines.

I know this picture is very suitable for viewing, but I can’t ignore the user’s interactive experience. There are three elements in my program that can interact with users: birds, ripples and the fisherman.

Among the three, I am most satisfied with the bird. It can appear randomly in the sky, and gradually reduce the transparency and shrinkage, forming an effect of gradually flying away, which is inspired by the first sentence in this poem, “from hill to hill no bird in flight”. The fisherman can be controlled by LEFT_ARROW and RIGHT_ARROW to move left or right. The ripple can show up then gradually disappear.

 

For the technical development of my project, I first made the classes to build my elements that will show up in the picture, including class Fisherman, class Ripple, class Bird and class Snow. Then I work on their interaction part by writing some conditional judgement sentence, making arrays and so on. The interaction part of ripple and fisherman has some parts that I tried but didn’t do. I tried to make the fisherman move left and right all the time, stop when the mouse approached, and continue to move in the original direction when the mouse moved away, but I failed to write the conditional judgment sentence. I also tried to combine the ripple with the fisherman. When I click the fisherman, the fishing rod and ripple appear, but I don’t know how to make this effect without global variables, so I had to separate the ripple from the fisherman. This led me not to make the action of “fishing”. (Though it still makes sense for the whole picture as long as we understand it from a different perspective that the fisherman is not actually fishing, because nobody can catch fish in the late winter. In this way, the fisherman can be regarded as a hermit, fishing only to show his unconventional attitude, just like Jiang Taigong.) Although I have some ideas that have not been completed and have made some compromises, I have tried hard to solve them. In the process of solving the problem, I learned a very useful way to identify where the program has a problem, that is, to perform an extremely simple action at different positions of an error code, such as displaying the text “hello”, or using console. Log () to display whether the value of a variable changes, so as to find out the specific error position and analyze or eliminate it.

 

Looking back on my process of doing this project, I put forward an interactive idea at the beginning. After accepting the suggestions of professors and classmates, I changed my mind and decided to do a project that focuses more on displaying the artistic conception of poetry through vision. In the process of programming, I encountered many technical problems. I didn’t succeed in doing some interactive actions, so I finally decided to focus on showing the artistic conception and improve the user experience by improving my existing interactive details. My final version of the program has a regret, that is, I didn’t make a “fishing” action, which supposed to be the most interesting part of my project. However, to my surprise, I’m really satisfied with the present of the whole picture, especially the fly-away birds and the flow of the fisherman that I didn’t expect in the first place but decided to add it to show that the fisherman is on a river.

 

There are a lot of things in my program can be better, I hope users will like it and give me more feedback.

 

Feedback during the project presentation

During the presentation, my professors and classmates said they enjoy the color and style of my project and they liked my picture effect very much. They also give me some suggestions to improve my project. Professor Leon suggested that I not use the left and right arrows to control the movement of fishermen, but use them to control the movement of mountains, so as to make a broader picture; In addition, he suggested that my ripples can be smaller when users click mouse near the mountain, and be bigger when mouse is pressed at the bottom of the screen, so as to make the picture more realistic.

https://editor.p5js.org/Yuyang-Hu/sketches/a9Qf9FCm-

In my opinion, a very important feature of dancing is that the dancer need to move its body on beats, so I decide to create a dancer that can reflect to the music regularly. The reflection of my object dancer is to rotate its arms and legs , change its color and open or close its eyes with music.

I used this.size in class as a parameter to make sure my dancer can be scaled up and down, but I think it makes my code seemed complex, so I would like to find a more effective way of dong so.

While creating my dancer, I gained a deeper understanding about the function of map and how to use it.

I also found that using the symmetry of graphics can write code quickly, which is very convenient, but the rectangle is drawn from the CORNER, which makes the calculation a little difficult. On the other hand, symmetrical patterns are monotonous and not very abstract.

 

 

As a fan of the Star Wars series, I chose to create a creature based on the famous robot R2D2. 

Firstly, I created a function to draw the positive vision of R2D2, and separate its image into parts: head, body, arms and feet. So I programmed to draw each part and add a “k” or “m” to make sure I can adjust its size or position in proportion.

I did the same thing to draw its left side and right side vision of R2D2. 

After I am done with all the 3 functions, I use these functions in the “draw” function to draw R2D2 on the canvas randomly. So that we can see a lot of R2D2 of different size, angle and location show on the screen. 

Here are some aspects that I think can improve in the future. In my opinion, to make the program more interactive is a good idea. I can use “if”, ”else if” to make some interaction with the mouse or key to change the size, position or color of R2D2. What’s more, I can also change its location continuously by using loops.

    

I tried to cooperate with the computer and drew some images through P5. These images are mainly geometric, and I tried to make them symmetrical as much as possible.

I’m not very proficient in P5 language. Sometimes I want to draw several similar graphics on a picture, but I can only reuse the same text, but I can’t set variables well and simply convert the position, size and color of graphics.

My inspiration is not very rich. I basically refer to the patterns I learned in class, and try to make a picture more beautiful by superimposing graphics and changing colors.

I found out that push() and pop() are very useful tools, I can easily change the settings of one particular image without touching other images. It’s really convenient.