Recitation 7: Functions and Arrays——Cindy Xie

  • Overview: This week we learned how to make our functions in processing and also learned the function arrays.
  • Step 1:

The first step was to build three different faces. I imitated the code of the class and drew two blue and yellow faces, then I used the triangle function to draw a triangle purple face. In this step, I invented three functions of my own to draw three different faces. Then I put those three functions into my draw function.

link

  • Step 2+ Question 1:

for loop:

I used for loop for two circle faces(  because the triangle face will distort if I use for loop on it). By using for loop and function random, those faces appeared in the canvas randomly.

link

draw loop:

By using the draw loop, those faces can repeatedly keep appearing on the canvas. Compared with for loop, the draw loop can repeat the “for” action and those faces will look like keep moving on the canvas. But if we use the for loop, the faces on the canvas is unmovable because once there are 200 faces on the canvas, the action will stop. This is the difference between the draw loop and the for loop.

link

step3:

Then I used the function array to change the X, Y positions of those faces as well as their color. I used 5 arrays, two of them to control the positions and three of them to control the colors.

link

  • Step 4+Question2:

In the last step, by using the function random and function if, those faces can move on the canvas without moving out of the edge. The function random gives the rage for the movements of the images and the function if constrains them to fix on the canvas.

The benefits of the function array are: you can use a huge number of variables to control your function but also use certain defined variables at the same time. It makes the code easier to see. Also, compared with the function random, the function array gives a certain track for those images.

I would like to use the function array to draw a picture of snowing with a certain track. Because the number of snowflakes is big, and  I don’t want them to fall randomly but with a certain track, I then can use the function array to control my snowflakes and draw a beautiful picture.

link

Preparatory Research and Analysis——Cindy Xie

  • Chronus exhibition

“JUST WHAT IS IT THAT MAKES TODAY’S COMPUTERS SO INTRIGUING, SO NONSENSICAL?”

An indescribable thrill came over me after viewing Chronus’ exhibition. When technology and art are combined, such a mysterious and aesthetic product can be created. Nowadays, when people talk about science and technology, they regard it as a commodity that creates economic value. But in this exhibition, I see that when technology is no longer just a tool, but an object of aesthetic and artistic value, I think it is a great progress of human aesthetics. It has given the computer new meaning and new value, namely the ornamental value.

What impressed me most was the work “Rechender Raum”. In this huge work, I saw the original parts that I was very familiar with, such as arduino, servo, motor and so on. I never thought that these original parts could be combined and displayed as works of art. This work is mainly composed of numerous electronic components, which work together and control each other. At the same time, through rubber bands and lead pendants, the whole work is organized like a neural network.

(Rechender Raum)

In the exhibitions I have seen before, most of the works of art are not combined with technology. By contrast, the biggest reason why the art in this exhibition makes me feel different is that these machines seem “alive” and animate. Whether you look at it or not, they’re doing their job, which means the art combined with technology is self-conscious. Your viewing or interaction may be part of the task for them, but they can still work without you.

  • Research

I think this product — love box messager — gave me a lot of inspiration. For this final project, I want to make a product aimed at the interaction between couples. The product love box is very consistent with my definition of interaction. Although modern people can chat with their mobile phones and computers, they cannot feel the true feelings across the cold screen, and the messages you receive are not necessarily what you want to receive, such as deadline for homework. But with love box as a medium, when you see the lovely red heart swing, you can’t wait to open it, because you know it’s a message from someone who loves you. Love box builds a more warm communication bridge for people. It enables people to interact with each other in a novel and warm way. Meanwhile, people also interact with Love box in this process. Therefore, this product is not only a new manifestation of interaction, but also has a strong use value, which inspires me a lot.

However, for this product, Hey Bracelet, it does not meet my standards for interaction. This product is also aimed at couples. When both of them are wearing hand rings and connecting with each other, if one of them covers the bracelet, the other’s bracelet will move up and down as if to say “Hey”. The original intention of this design is very good, it is designed for long-distance couples, when missing each other, touch a ring to tell each other I miss you. However, I think the fact that the receiver only feels the movement of the ring does not reflect interaction. In addition to greeting, the movement of the bracelet can’t represent any other information, let alone telling the other what my mood is. Its only function is to say “Hey”. Therefore, I think this product does not well interpret interaction.

Although they are all couple bracelets, Bond Touch bracelet are more interactive. After a couple wear those rings, one side can tap the bracelet according to different frequency and amount. So couples can preset a sign, such as short three taps represent “I love you”, and if one side suddenly want to express their emotion, he/her can through this way to tell the other. Bond Touch Bracelet conveys a much richer meaning than the Hey Bracelet.

  • My perspectives of interaction

After learning for most of the semester, I started to think that interaction is the process between machines and people, which is divided into three steps: receive, process, and speak. Through the group presentation and midterm project, I think the interaction on the basis of before, should have more practical significance, and can affect people’s real life. After visiting the exhibition of Chronus, I think the interaction between machine and human is of aesthetic significance, which should not only define a product from the perspective of pragmatism, but also from the perspective of aesthetics. So I think it’s very important to make the machine artistic. However, now, I think interaction not only means that machines interact with people, but also means that machines are a bridge for people to interact with each other. From love box messager and Hey bracelet, it can be seen that the machine is of great significance for interaction between people. So far, I think a good interaction should include two parts. The first part is the interaction between people and machines, and the second part is the interaction between people through machines. Meanwhile, good interaction should have two meanings: practical value and aesthetic value. In the exhibition of Chronus, I saw a sentence that philosopher Gerald Lee said: “Machines are the unconscious brains of the world…”Because of this, the interaction among human, social and mechanical is so important and worthy of our consideration and discussion.

  • work cited
  1. https://www.youtube.com/watch?v=lA-ROtD85jo
  2. https://www.youtube.com/watch?v=ZPlessKQXyE
  3. https://www.youtube.com/watch?v=4gtccVMJNfs

Recitation 6: Processing Animation——Xintong Xie

Based on the basis of last recitation, I improved my project by using functions like “mouseX/Y”, “atan2”,polar equation of oval and “lerp”

my code for moving eye ball( the other parts are written in the recitation5):

int x0 = width/2;
int y0 = 267;
float angle = atan2(mouseY-y0, mouseX-x0);
float ballX = x0+50*cos(angle);
float ballY =y0+11*sin(angle);
tempX = lerp(tempX, ballX, 0.1);
tempY = lerp(tempY, ballY, 0.1);
ellipse(tempX, tempY, 50, 50);

  1. (x0,y0) is the center of the eye
  2. By using atan2, I can know the angle of the mouse and the center. 
  3. I used the polar equation to restrain the eye ball into an oval, so that the eye ball will not leave the eye socket. It needs the angle of step2.
  4. function lerp is used to let the eye move more smoothly. If the mouse leave the picture and appear at another point, the eyeball will move smoothly to the new angle instead of move to it in a sudden.

Recitation 5: Processing Basics——Cindy Xie

  • Step 1: My Image

(The Eye of Horus)

I saw in the movie that The Eye of Horus represents rebirth and the protection of gods. It is very artistic and gives people a sense of mystery and sanctity. I like this figure very much. At the same time, it is not particularly complex, suitable for processing beginners like me. 

  • Step 2:  Draw it!

size(600,600);
background(255);
noFill();
stroke(0);
strokeWeight(10);
triangle(298,0,0,520,600,520);
//eyebrow
strokeWeight(10);
bezier(194,190,246.5,210,240,150,404,190);
//eye
strokeWeight(10);
bezier(145,273,160,290,320,160,451,270);
strokeWeight(10);
bezier(140,285,180,240,340,380,451,270);
//tongkong
fill(0);
strokeWeight(10);
ellipse(340,270,72,72);
//zuo
strokeWeight(15);
noFill();
bezier(110,400,60,450,120,500,330,320);
//you
strokeWeight(10);
line(340,320,340,450);
fill(0);
triangle(340,470,390,360,340,345);

I mainly use bezier, strokeWeight, ellipse, triangle and other functions, among which bezier is the one I use most, because I am drawing eyes, so I need a lot of curves.What is more difficult is that the decoration of the lower right part of the eye is not easy to draw, so I choose to use triangle instead. Although it is different from the original picture, it is also very aesthetic.At the same time left decoration I do not know how to draw a spiral, perhaps I can learn later!The most difficult thing is that the inflection points of the curve are not well set, and very accurate data is required.

Processing makes me think that painting can also be digitized, which improves the accuracy. However, I still think it is not very convenient. Maybe I just started to learn it, and many functions are still unclear.But I like this feeling very much, I like programming, at the same time programming to make up for my painting skills poor shortcomings!

 

Library Noise Detecter—Cindy Xie—Professor Rodolfo

  • Why do we make it?  (significance)

we want to make something helpful and interactive in our daily life.

In the previous Group Project, our team presented the magic mirror, which can help people choose clothes faster and more effectively, and solve the problem of recycling discarded clothes. In this activity, my inspiration is that what we should do should be helpful to life and have practical meaning to life. Therefore, starting from our own life, we carried out research, hoping to do a project to improve our daily life. My partner Mary and I often go to the library and find that although the study room of the library has a noise detector, it does not tell us clearly how many decibels above is noisy and how many below is quiet, which is vague. At the same time, the noise detector was just showing numbers, not interacting with people. It was very dull and boring. I believe that interaction should be the corresponding response of the machine after thinking and processing human behavior. People’s different behaviors should correspond to different results, while the noise detector in the library only has two kinds of behaviors, namely receiving and output, instead of “processing” and “analyzing” people’s behaviors.

 

(noise detector in the library.)

  • What does it do? (context)

Remind the users of the noise in an interactive way and help the children to comprehend

The box man brings the number to life by adding a “processing” on the basis of the original noise detector. That is to say, box man no longer simply receives and displays the decibel, but converts it into an action. Different noise levels have different actions. Also, it’s more interactive, because box man tries to interfere with your behavior after you make a sound, it interacts with you through different actions, and if people see it react and stop talking, then they connect with it.

We saw a project on Facebook about recycling books in a children’s library, and it was so cute that kids were willing to donate books and knew how to do it.

https://www.facebook.com/kayla.casiello/videos/10162253998475597/

Therefore, we think that the target of this product is school library, and it is more inclined to young children, who have no concept of the number of noise detector, but can better understand box man’s behavior.

  • How does it work?

make different actions according to different decibels

We wanted to make a more explicit, vivid, interactive noise detector. Mary Shared a Korean video, in which all the toys can interact with people, and different small figures have different reactions.

So, we wanted to make a box man who could make different actions according to different decibels. Normally, the box man was reading a book.

 When the volume was low, he would put the book down. 

When the volume is relatively high, a sign will be put up saying “silence”. 

When the volume is constantly high, it will move the sign up and down for several times to protest.

  • How was it made?

Tinkercad, 3D printing, motor, arduino, breadboard, plank, laser cut

The principle that we choose materials and technologies is that we have a certain foundation and understanding of them. Our materials are tinkercad, 3D printing, motor, arduino, breadboard and plank. We first used tinkercad to draw box man’s head, body, limbs, books and signs saying “silence” and then printed them with 3D printer. At the same time, two small motors are used to turn the arms, arduino and breadboard are used to connect the circuit to the computer. Finally, a wooden box was cut and assembled with laser cut to load wires, arduino and breadboard, making the product more beautiful. The reason why we choose to use 3D printing is that we learned relevant knowledge in IMA workshop. 3D printing is the easiest way for us to make it, and tinkercad is also very easy to modify the product. 

(the model of the box man in Tinkercad)

The reason we chose the motors is because we learned in recitation how to use and compile servo, and we apply it to our product. The whole project is the integration and application of what we have learned, including our knowledge of recitation and lecture.

  • Our challenges and solutions

There are four of the most significant steps.

The first is that we have abandoned the school’s sensors and bought four more sensitive sound sensors. The new sound sensor is more sensitive to decibel changes, which makes it easier for our project to monitor noise.

The second is the use of digital output. We consulted Rudi, he gave us a very valuable advice: he suggested that we use the digital sound sensor output rather than analog output, because the arduino identification of analog is insensitive, there will be delay at the same time, while digital only has “yes” and “no” two choices, so we only need to manually adjust the sensitivity, without having to identify the specific values, which helped us save a lot of time and step.

The third one is to solve the delay. We always have a very long delay in the compilation process, so we consulted a staff. He found that our program put pinMode and attach into the loop, which led to the redefinition of each loop and wasted a lot of time. So, we put them in setup, and the latency problem is solved!

The last one is the use of superposition.In the process of our production, we wanted to use three sensors at the beginning, but the third was too insensitive, and must be very very loud that can be detected, so we gave up using the third sensor, but use the superposition method instead. Whenever comes once a second level, it adds 1 (s=0 at the beginning, s= s+1;) When s= 4, it will trigger the third level, that is, lifting up and down the arm. In this way, the third level can be used to detect whether someone is chatting for a long time. If someone is chatting loudly for a long time, the second level will keep appearing, and then when it accumulates to 4, then it will trigger the third level. Abandoning the third sensor makes the design more practical and rigorous (because normally no one speaks very, very, very loudly in the library).

if (s >= 4) {
Serial.println(“NOISY!!!!!!!!!”);
delay(10);
servo1.write(20);//放书
delay(150);//时间加长—————
servo2.write(40);//举
delay(500);
servo2.write(110);
delay(500);//放—–1
s = 0;
} else {//吵
if (sensor2 == 1) {
Serial.println(“NOISY!!!”);
delay(10);
servo1.write(20);//放书
delay(1000);//时间加长
servo2.write(40);//举
delay(3000);
s = s + 2;
Serial.println(s);
delay(10);
t=0;

( part of our coding )

In user testing session, we received a lot of valuable suggestions. For example, one student suggested that action should be generated when the noise is detected for a long time, and also, we should carry out 3D printing in advance to avoid too much printing work. At the same time, another student suggested that we add different colors of LED lights to indicate the noise level, but I thought that the change of LED color might distract students’ study, so I did not adopt the last suggestion.

  • Conclusion

In my opinion, the most key of the interaction between human and machine lies in the corresponding response of the machine ( after thinking and processing human’s behavior), that is, “analysis” and “processing”, instead of simply “receiving” and “expressing”. Although our project is a simple interaction, but it reaches my definition of interaction. When I was making the presentation, the audience talked to it, made different volume and observed box man’s reactions. At the same time, some students said that if the cute little robot asked him not to speak, he would follow its instructions. This shows that the audience is willing to communicate with our project and that our interaction is effective.

If I had more time, I would like to replace the current motors with two silent motors, so that box man won’t affect other students when he works. At the same time, I also want to add more actions. During the presentation, a teacher suggested what to do if the children could not understand the word “silence”. I think I can change the sign into other gestures, so as to be more comprehensive to young children.

At the same time, I felt a sense of accomplishment. When I integrated what I had learned into my own project, my heart was full of pride and pride. Especially when it worked, my partner and I screamed with joy. We failed many, many times in the process of making it because the sensor was not sensitive or there was something wrong with the wire. However, we finally achieved our goal and achieved satisfactory results. I think teamwork is indispensable to this. My partner has given me a lot of help. This box man integrates the efforts of both of us and is the crystallization of our knowledge and wisdom.

Through this production, I think the designed products should be close to life, and the products that are valuable and meaningful to life are good products. Meanwhile, interaction makes a product more vivid and aesthetic. I think our box man is just the beginning. There are more unknowns to explore and more to try.

Resources:

  • https://www.youtube.com/watch?v=2SJGNwzP-Qs
  • https://www.facebook.com/groups/ALAthinkTANK/permalink/2995666503839483/