cw94 – Helen Wu

CL Final Project – Ocean

Motivation

Continue with Project 2 “Ocean”, I designed a small drawing game with JS D3 library. It just for fun. But people may remember my topic deeply due to this game.

Deployed Link: https://glitch.com/~quiet-mousy-hare

Glitch/Github Repo Link: https://github.com/cw94/Helen-Final-Project

Context

This “Ocean” Webpage design may share with students for them to learn about oceans and seas on the earth. So let students enjoy an interesting game in the end, it will be more impressive to them.

Meanwhile, the different size of the circle looks like bubbles in the ocean, closely related to my subject.

Key Challenges

Since I try to attract people who visit my website, at the beginning I want to design a 3D demo by using THREE JS like moving a 3D module in one client and show the same behavior in another several clients side. I thought just need to pass some key control data to the server. But for the 3D module, I realized that I probably need to pass a DATA which is changing, OR maybe not a DATA but a group of DATA which is from the whole movement of the 3D module. Unfortunately, I did not make it. But I changed my design direction back to the 2D module by using D3.

Next Steps

In the future, I probably will search for some examples for 3D module movement in real-time between clients and servers through socket io. Try to find what I need to pass between clients and servers to get movement in real-time. Will keep studying what is the block issue here.

Continue with Project 2, I load a new container on my web page. This container includes a canvas that can share effects made by the JS D3 library. And I also pass data by using socket io between server and client in order to share a real-time effect among several clients.

Effect

When one of the clients clicks his/her mouse on the canvas, all clients will get a circle in Blue on their screens. Only when the client clicks the mouse, the canvas will show a circle. And then the created circle will turn to PINK and become smaller in 4s after the mouse moves out of this circle. While the mouse moves over the circle, it will turn from PINK to RED and getting bigger.

But on the other clients’ screens, they only can see a circle in Blue which was created, will NOT see any color and size changes based on the mouse move out or move over, because the mouse is NOT on their screens.

Coding

On the server-side, I continue with the opened socket io connection that serves for Project 2 – P5 program. So no need to make another socket io connection, just write code after the P5 program.

Firstly, load a container in div in HTML to carry D3 canvas. And also add D3 JS connection as a source in HTML script.

Then, back to the server page to make another group of listening and sending.

Last time – Project 2 P5 project, I used “socket on (‘data’…)” to listen and use “socket broadcast. emit(‘data’…)” to send the message.

But this time, I change the listen function to the keyword ‘ocean’ and the same keyword for sending messages. This can make both the P5 and D3 library work on the same web page.

Finally, let’s go to client-side.

Create a SVG and connect to the created container and set the width as 800 and height as 1000.

We will need to send Mouse Position changing data (X, Y) to all other clients through SERVER, which is mouse coordinate. Because only click the mouse (mouse position changing) is real-time, other actions (like mouse over, mouse out) are NOT. I get mouse coordinate by D3 code event.clientX & event.clientY. Then send it to the server through ‘ocean’.

The Client-side will also receive mouse coordinate from server broadcast through ‘ocean’.

Then we run the function “addSVG” to draw a circle which center is the mouse coordinate send from the server.

After the circle is drawn and the mouse moves out of the circle, I make a MOUSEOUT function to make this circle change the color from Blue to PINK and become smaller in 4s. Also, a MOUSEOVER function to make the color turn back from PINK to RED and change the circle size back to bigger while MOUSE moves over the circle.

But those two effects only happen on the client where the mouse is there because there is only one mouse which only shows on one client side.

That’s my final project of CL which I would wish can bring people to the very deep ocean. Hope you would like it 🙂

CE – Final Project and Reflection

Topic: Smoke
Audience: Smokers Who Want to Quit

One day, a young man went to the hospital to visit his seriously ill colleague. This colleague said that he had lung cancer. The doctor judged that he had only one year of life, and he regretted it now. He said that the doctor gave him a simple clock and told him that due to long time smoking, on this clock, his life had reached the end of 11 o’clock. At this time, he took out the magic clock with difficulty and asked the young man that you also smoke, what time do you think you are now? After the young man saw the clock, he trembled and stammered: “You scared me. My life has just begun, and it’s still at 1 o’clock.”…The warning of the clock and the terminal illness of his colleagues made the young man ended visit early. After leaving the ward, he threw a box of cigarettes into the trash can and whispered: “This is lucky, I’m only at 1 o’clock. Wish me healthy!!!”

Prototype:

This prototype I call it “life clock”. It is the form of my topic. Its main body is made by carton paper. And in the middle, one cigarette represents the hand of the clock. 12 pictures show 12 different status of a smoker in his life and represent 12 hours. It’s easy to play, you just show this clock to any of smokers and ask them move the hand of clock to tell himself what time he/she is at. I think this is a big shock to smokers.

I shared this prototype to my cohort group which include “Dorian, Haoqi and Parisa”. And here is some comments from them.

Dorian — Could u be connected this clock to cigarette box, like design an QR code on box and when scanning it user will get a virtual clock and if user enter his age of smoke and quantity of daily smoke, this virtual clock will show you what time you are at now. This probably will be the next step to design.

Parisa — have some terrible pictures to scare smokers like bad tooth or lung with cancer. This is give a big shock to warning smokers.

Haoqi — Previously, I wrote many words to explain the status of each hour, but Haoqi suggest that big cords in center is enough, because words will limit people’s imagination. So I removed words from final version.

When you see my prototype, I think you have know my direction which is help people who want to quit smoking.

Why people will smoke by generation and generation? It is because chemical substance Nicotine which makes smoker addictive and a psychological addiction.

Smoking addiction is actually a chronic neurological disease that is addicted to nicotine, and addiction to cigarettes is essentially addiction and dependence on nicotine. Nicotine enters the brain through the blood, and the central nervous system of the brain secretes “dopamine” when stimulated by nicotine. Dopamine is like a stimulant, which can make the human brain excited and happy. However, nicotine is easily excreted from the body. When the nicotine content of the human body decreases, the secretion of dopamine decreases. At this time, the smoker is eager to smoke another cigarette… The problem does not stop there. The dopamine level in the brain of the smoker will be about 20% lower than normal. Now it is assumed that the dopamine level in the brain of non-smokers is 100, then the dopamine level in the brain of smokers is 80, and smokers can only increase the level of dopamine secretion by smoking (it can only increase to 100). But after smoking, as the nicotine decreased, dopamine dropped to 80 or even lower, and then couldn’t help but pick up the next cigarette.

Psychological addiction refers to the result of the combined effect of memories, habits, hobbies, conditioning, etc. about smoking in the subconscious. The long-term repetition of these behaviors has formed memories. If you don’t smoke, you will feel empty. The longer you smoke, the heavier your psychological addiction and the harder it will be to quit. This process of quitting smoking will be very helpless, but it can only be wiped out and forgotten by time.

Key point is how we can make smokers quit ?

If you follow below suggestions your life will be changed.

— You must have a very strong belief and you need to set a quit target date.

— Prepare substitutes, which can be vegetables and fruits, or even a chewing gum that you often chew after smoking.

— Stay away from places that will tempt you to smoke.

— Make yourself busy in the beginning 2 weeks.

— Mark number on cigarette from 1~30, it means only 1 cigarette a day.

— Tobacco company can make same length of cigarette but with longer filter.

— Pass the money that you use to buy cigarette to your family members who can return to you every month. Then you will be happy to get extra salary monthly.

— E-cigarette and Quit smoking stickers could be a temporarily solution.

Final Presentation Link

Reflection:

Regarding my research smoking, I learned that it is the physical and psychological addiction that makes people unable to leave cigarettes. Although everyone knows that physical addiction comes from nicotine, I have only understood the principle of nicotine addiction through this research. What is more mysterious is that psychological addiction is the greatest resistance to quitting smoking, because it has become a habit, not the will that can be overcome, but the need to remind yourself all the time.

My project works surround the prototype “life clock”. This is my sudden inspiration. Initially, I made this prototype with cardboard and cigarettes based on inspiration. And designed a scene story with clear meaning (visiting patients). Take this as the beginning of my speech. Then, through a lot of reading materials, I used data and graphics to show you the reasons why it is difficult for people to quit smoking. Finally, I also provided many simple and effective ways to quit smoking. I hope that smokers can be warned after reading my research and give up smoking. After I showed you the results of my research, the most attractive one was probably the prototype. The most common feedback is that this clock of life is a simple and clear warning sign, which can be placed in more conspicuous public places to replace ordinary no-smoking signs to give people a more eye-catching warning. The students also look forward to seeing the finished product of this prototype, an electronic version of the APP, which is more practical and interesting. The electronic version of the APP will be designed to more accurately predict the impact of smoking on your life, and use some more explicit photos as a warning. At the same time, the teacher also asked, can this clock go back? The answer is yes. If you are determined to quit smoking, and have obvious results, such as smoking less every day, or even successfully quitting after a period of time, then you can move the pointer back to tell yourself that my life has gone back. The user of this study currently defines smokers who want to quit. Of course, I still hope that it can be extended to all smokers who will be deeply moved after reading my research. Therefore, I hope that this research can reveal in more depth that smoking not only causes great harm to the smoker, but also seriously affects the people around him. Even if you don’t care about yourself, think about your relatives around you, they may become victims of cigarettes unknowingly. Maybe I want to find a more effective warning method, such as another obvious metaphor other than the clock of life, rather than just some explicit photos. Secondly, I will also consider how to make it easier for people to see my research. For example, hang the prototype clock in a public place, push a virtual APP to everyone who buys cigarettes, and go to school for promotion, so that the new generation of people will put an end to the temptation of cigarettes before they fall into the abyss of cigarettes.

In short, I will continue to improve this project, hoping to bring pure air to this earth.

CE – StoryBoard & User Test

Story Board:

One day, a young man went to the hospital to visit his seriously ill colleague. This colleague said that he had lung cancer. The doctor judged that he had only one year of life, and he regretted it now. He said that the doctor gave him a simple clock and told him that due to long time smoking, on this clock, his life had reached the end of 11 o’clock. At this time, he took out the magic clock with difficulty and asked the young man that you also smoke, what time do you think you are now? After the young man saw the clock, he trembled and stammered: “You scared me. My life has just begun, and it’s still at 1 o’clock.”… The warning of the clock and the terminal illness of his colleagues made the young man ended visit early. After leaving the ward, he threw a box of cigarettes into the trash can and whispered: “This is lucky, I’m only at 1 o’clock. Wish me healthy!!!”

User Test:

This prototype I call it “life clock”. It is the form of my topic. Its main body is made of cardboard paper. And in the middle, one cigarette represents the hand of the clock. 12 pictures show 12 different status of a smoker in his life and represent 12 hours. It’s easy to play, you just show this clock to any of the smokers and ask them to move the hand of the clock to tell himself what time he/she is at. I think this is a big shock to smokers.

I shared this prototype to my cohort group which includes “Dorian, Haoqi and Parisa”. And here are some comments from them.

Dorian — Could you connect this clock to a cigarette box, like design an QR code on a box and when scanning it the user will get a virtual clock and if the user enters his age of smoke and quantity of daily smoke, this virtual clock will show you what time you are at now. This probably will be the next step to design.

Parisa — has some terrible pictures to scare smokers like bad teeth or lung cancer. This gives a big shock to warning smokers.

Haoqi — Previously, I wrote many words to explain the status of each hour, but Haoqi suggests that big cords in the center are enough, because words will limit people’s imagination. So I removed words for explaining each hour, as showing above the final version.

CE – Public/Audiences

My topic is cigarettes. For most people, smoking is harmful to them. But for others, such as the government, the existence of cigarettes may be essential. Therefore, the connotation of my case varies for different public.

When the public is a teenager, smoking is very harmful to them, and I will publicize that it should be completely eliminated. Smoking easily induces bad behaviors, such as playing truant, playing games, gambling, and being mentally empty. You can only rely on smoking to kill time, which is not conducive to the learning and growth of young people. Smoking increases one’s own financial burden, and young people have no independent income, and they tend to embark on the path of crime, such as theft and robbery. Smoking damages the body of young people. Young people smoke too early, which severely damaged body cells, decreases their memory, loses energy, and is unable to concentrate on studying. Smoking can cause damage to the lungs, mouth, digestive tract, and heart. It may be serious. Lead to premature aging.

When the public is an overstressed adult, I may consider from the perspective of alleviating mental stress and suggest a small amount of smoking. For example, smoke 1 to 2 cigarettes only when the mental stress is too high. But again, as long as you smoke, it is 100% harmful to your health. It’s just that a small amount of smoking is less harmful than long-term heavy smoking. Therefore, my project still warns such people not to smoke.

The above two situations are directly smokers, and the third type of public is directly related to cigarettes, but does not smoke. It is the governments of various countries. As we all know, government policy is always based on complete information and calculations. For cigarettes, you may not dare to imagine how comprehensive the government’s calculations are.

British drama [Yes, Prime Minister] the third episode of the first season.

Humphrey: “Tobacco revenue is the main source of taxation.”

Prime Minister: “It is also a major source of fatal diseases. The diseases caused by smoking cost the Ministry of Health 165 million and claim 100,000 lives each year.”

Humphrey: “Yes, but if these 100,000 people survive, they will need more pension and social insurance than medical expenses.”

From a financial point of view, maintaining the current mortality rate couldn’t be better. Without calculating the value of life itself, the answer is: Yes, smokers are the source of money. It provides tobacco taxes and reduces the country’s pension expenditures. Although it sounds scary, this may be the ulterior reason why governments around the world are unwilling to ban smoking. Therefore, for the government, they want people to continue smoking.

CE – Janky Prototypes

Yesterday I had crabs for dinner. I used a crab leg and a chopstick to form a “cigarette”. The rope that binds the crabs is used to make smoke rings. Simple image.

When you see the picture below, you may think that this is a box of cigarettes. But this is actually a box of egg rolls. Shooting from a certain angle will make you feel different.

The picture shows the production of cigarettes, which is very simple. Just a piece of paper, some shredded tobacco, and finally the paper is rolled up, and the cigarette is ready.

CE – Affordance

When people see cigarettes, they usually think of its harm to health. So, I trapped cigarettes together and made it into the shape of a bomb. The alarm clock next to it means that this is a time bomb, so it will endanger your life. Meanwhile, in the second picture, you can see that a cigarette under the smoke ring is drawn as a gun being fired. This means that when you smoke, new inspiration may be triggered.

CE – Daily Practice

Topic : Cigarette

As we all know, smoking is 100% harmful to our health. But I’m curious why people are aware of the health hazards of smoking, but they still have to smoke every day. Here is a pack of cigarettes belonging to my colleague. I recorded the number of cigarettes he smoked every day in the form of photos. Basically, he smokes one cigarette a day. I try to reveal the reasons behind people smoking through my study.

In my initial study, smoking can relieve stress, “Medium” of social activities, remove odor …

CE – Reflection of Presentation

Regarding my topic 5G, in my speech, I mainly embody the convenience of 5G high-speed Internet browsing. And when the wireless network connection speed can reach this high speed, what are the new applications that will be produced in various fields. But from my audience feedback, I learned a lot of different points, which I haven’t considered yet.

1. There may be different stakeholders. The stakeholders considered in the system I set up are people who use 5G networks, but the audience’s suggestion to me is whether they can consider some people. Their purpose is to sell 5G connections to you. If you start from this point, after the stakeholder changes, the system mapping will also change. Local telecom operators generally sell 5G, and they provide ordinary people with various speed and traffic restricted network connections. For them, 5G is pure business, not technology, not fashion. Business will involve money. People need to spend money to get 5G. Then the system will map economy, and so on. This will be a bigger topic.

2. Meanwhile, for different stakeholders, they will also care about different aspects of the same thing. Although 5G highlights high-speed Internet access, after careful investigation, it may also affect people’s health. Compared with 4G, 5G has a smaller signal area covered by each base station, which means that more 5G base stations are needed to cover the same area. However, as long as it is a communication device, electromagnetic radiation will be generated during operation, and electromagnetic radiation will cause certain harm to the human body. As the number of base stations increases, the amount of electromagnetic radiation is bound to increase and cause greater health hazards to the surrounding residents. This can also be considered as the negative impact of 5G on people, and so on, are there more negative impacts on 5G? I may need to understand and research more deeply.

3. Regarding my speech, the teacher also put forward suggestions that can combine metaphor and guide together. This can not only explain what 5G is, what is the difference between 4G, 3G, and 2G, but also let the audience intuitively understand why 5G is faster than other link methods. For example, a truck can be compared to 3G, an ordinary family car can be compared to 4G, and a sports car can be compared to 5G, so that the audience can understand the key to my research on this subject from the guide: speed.

In summary, 5G not only has its positive side, but also contains flaws. When I study a thing, I should look at it from all angles, and discover all its implications. I hope that in the next stage, I can study a subject in a more in-depth and comprehensive manner.