Author: Hangkai Qian

Step 1: Choose an image to be your motif

To complete this exercise, you will need to select an already existing image as a motif. This image can come from any source, so for your documentation you should download and cite where this image came from and by whom it was designed. 

I choose this picture because of  its simple design. Under the design, I found that there is some basic logic in it such as minimalism. First, the difficulties lies in the colors in the rectangles. Second, I cannot draw the a little curved corner. I ‘ll use rect, line, and quad functions to solve these problems.

From:https://www.guggenheim.org/artwork/161    Artist: Josef Albers

Step 2: Draw your image in Processing

Use your motif as a starting point or inspiration to draw a new image with Processing using any 2D primitive or vertex shapes. Your canvas size should be at least 600 x 600 pixels. To draw your new image, you may directly emulate your motif’s design or create an entirely original interpretation of the motif. Then, using the functions and methods covered in class, modify any shapes and adjust color to enhance your design. Using paper to sketch your idea before you begin coding may help.

You can use the following functions to help compose your drawing:

• •  

I used the color picker to pick up the value of the color. For the white corner, I drew a white line without stroke to realize it. For my final creation, I hope I can do that simple but meaningful things，with interactive part.  

Processing gave me a way to draw on the computer, and I think we can use it to do some more interactive part instead of just a motif.

Here is my code:

size(420,600);
background(255);

fill(134,134,134);
rect(12,12,396,576);//first

fill(214,214,214);
rect(60,60,300,480);

fill(134,134,134);

rect(108,96,228,408);
rect(84,228,24,228);

fill(160,156,156);
rect(60,60,24,96);//on the corner
fill(70,68,68);
rect(60,60,24,60);

line(108,96,336,96);//5 the space
line(336,96,336,504);//longest vertical line
line(108,96,108,228);// vertical line1
line(108,228,84,228);//horizital line1
line(84,228,84,456);//v2
fill(160,156,156);
rect(84,456,120,48);//r2
fill(70,68,68);
triangle(204,456,204,504,252,504);//t1
line(252,504,336,504);

fill(44,44,44);
rect(108,228,96,72);//r3
noStroke();

fill(44,44,44);
quad(108,300,204,408,300,408,204,300);//q2
noStroke();

fill(44,44,44);
quad(204,12,204,300,300,408,300,120);

stroke(255);
strokeWeight(4);
line(204,12,204,300);
line(204,300,300,408);

Here is my picture:

Recitation 4: Drawing Machines

Step 1: Build the circuit

Build the following circuit to control the stepper. You can use the stepper_oneRevolution(Arduino>File>Examples>Stepper>stepper_oneRevolution) example code to get your motor to make one revolution. If done correctly, your motor should rotate smoothly. Make sure you orient the IC in the correct position; this can be seen in the Components section at the bottom.

 

Step 2: Control rotation with a potentiometer

Add a potentiometer from your kit to the circuit in such a way as to allow you to read analog input. Then, upload the MotorKnob (Arduino>File>Examples>Stepper>MotorKnob) example  to control your motor. Please modify the number of steps within the code to 200, because the 42STH33-0404AC Stepper Motor is a 200 step motor. You can use the function “map()” in order to match the movement of the knob with the rotation of the motor.

 

Step 3: Build a Drawing Machine!

Once you have your motor moving via input from a potentiometer, find another person who has also completed Step 2 and pair up with them. Collect the materials needed for Step 3 and combine your parts into a mechanical arm that can hold a marker on paper, as seen in  the picture below. Use your potentiometers to make the motors turn and draw something.

  

Congratulations, I have just created a drawing machine AND DRAW!

Question 1:

What kind of machines would you be interested in building?Add a reflection about the use of actuators, the digital manipulation of art, and the creative process to your blog post.

I ‘d like to build a robot to deliver cheese , like ‘Rick and Marty’ did. With the actuators added, we can use that to carry the cheese from the table and with DC motor, we can keep the robot moving.

Question 2:

Choose an art installation mentioned in the reading ART + Science NOW, Stephen Wilson (Kinetics chapter). Post your thoughts about it and make a comparison with the work you did during this recitation. How do you think that the artist selected those specific actuators for his project?

I choose the Natalie Jeremijenko’s Feral Robot Dogs as an example. It is built to detect the pollutions of the environment. In this case, he used the actuators to make the dog move. I think it is a ordinary use of a actuator.

In my last group project, we considered about the definition of interaction and made a product called ‘Watch Alpha’, which is a wearable device. We draw the conclusion that to make an interaction, there has to be a input and a output. Thus, I come up with the idea to make a wearable device, like a helmet, which can say hello to whoever went by it. It’s cute and the others cannot see the face of the person who wear it. Other people will also find it interesting to interact with it. Hellobot will definitely help to overcome the social barriers between strangers.

In our project, the helmet acted as an aid to help interactions between people: The one who is wearing the helmet and the audience who is interacting with the helmet. When the user put on the helmet, the two LEDs which are positioned on the cheeks of the ‘face’ will be lit up to give the response of wearing the helmet. In this case, I used an IR sensor inside to detect whether the head is in the helmet.  When the audience come close to the Hellobot, the two ears, which are driven by two servos, will begin to wave, and the take-copter on the top of the helmet will be driven by the DC motor. At the same time, the buzzer behind the helmet will make rhythm of the Nokia Tone. To realize it, I used a Ultrasonic Sensor on the face of Hellobot.  We have combined lots of ideas together. First, the Lighten up LED is the idea from Iron Man: When the mask of the suit get down, light of the eyes lighted up. Second, our helmet looks like a box: the inspiration is from the game ‘Minecraft’ and other pixel games. Third, the Take-copter is from the cartoon ‘Doraemon’. Take-copter is a tool that help Nobi and Doraemon to fly. Last, the Nokia tone is to remind people of the boot animation that the Nokia phone has, which means the communication between people. By the way, the Ultrasonic sensor at the position of nose made it looks like a pig!

In our Version 1, we made a helmet made of the cardboard box. When the user wear that, the LED will be lit up and the motor will be spinning.  I had some trouble when I connected the servo: the servo did not work. After I asked the fellow, I found that I have connected the motor directly to the pin 11. As a result, the Arduino cannot provide enough power for both servo and the motor. Thus, in the user test(Version 2), I took the motor off and replaced it with a servo. With the IR sensor on the face and a hand attached on the servo, the function is that if you put your hand before the device, the small hand will wave and the LED lit up. However, during the user test, we found some problems. First, the person who wear the helmet cannot see things outside. Second, due to the function of the IR sensor, the distance of the interactor must be very short. Third, since we used the cardboard box, the device is ugly. To deal with this, I used laser cut to make a new box with eyes on the face so that the user can see things from inside. Moreover, it looks better, too. I also 3D Print Pig’s ears to make it cuter. During the final version process, I used the circuit of the transistor to control the motor and used a new Ultrasonic sensor to replace the IR sensor. The IR sensor is used as the detector. Everything goes right except the motor. To drive the heavy take-copter, I used a external battery pack to support the motor. However, the signal problem happened. First, when I attached the servo into the circuit, the signal of the Ultrasonic sensor will go wrong from time to time. With the help of the professor, I solved it by take some delays in the code. Second, when I attached the motor, the signal went completely wrong. After I used the multimeter to detect the voltage, I found that it is because of the big circuit of the motor interfere with the signal. With the help of Rudi, I made motor spin from time to time, and since the motor spins really fast and it will keep spinning even when digitalWrite low, so it will look like it is spinning all the time.

In conclusion, we want to use this device HelloBot to closer the distance between strangers and through the interaction, we want people to have more communication with each other and find the device interesting to interact with. Gladly,  I found that the audience liked to interact with this device. If I have more time, I will make the appearance of the HelloBot better and make it response quicker.

Refection of Interaction Lab Project

According to Crawford, Interactivity means ‘ a cyclic process in which two actors alternately listen, think, and speak.’ (P5,The Art of Interactive Design)  From his definition, we think that the interaction has to be input (listen), processing(think)and output(speak).  

One project I researched is ‘The Light Barrier, Third Edition – Drawing volumes in the air with light’, in which they built a device that use 3D structured light to reflect the volume in the air.  In this case, the input is the volume, the processing is the algorithmic solution of calculating the exact point of the rays, and the output is the great 3D picture from the projector. They used ‘8 video Panasonic 20,000 lumens WUXGA 4-lamp projectors’ and lots of mirrors to reflect the light from the projector and build the image through the calculation of the path of every pixel. And the sensor can detect the sound of the environment.

However, a project called ‘Massive Murals Are Popping Up Around Detroit’ is not regarded as interactivity. It’s about collecting and making murals on the wall of Detroit. In this project, there is only speaking(output) segment. No input and processing section is involved.

In our project, we imagine a watch which can use sensors to monitor the condition of the users’ heartbeat , temperature , chemical, breath rate mood … and process the data to predict what food the users want to eat. We named the watch: Watch α.

You can use the watch to check your time, and its battery life is wonderful —it can work for a whole year without charging! Of course, if you want to make the function works better, you should keep wearing it to monitor your condition all the time. Its AI module enables it to learn the appetite of the user and make food in advance and exactly at the time when you want to eat something: it can think what you think. The food is already done when you want something. In our presentation, we chose three scenarios: Homesick, sick, and the date night. In the first case, the device put up of voice input and some other data and find Ruben is homesick, so it made hamburgers and chips, which is the typical food of Ruben’s hometown. In the second case, the device mainly picked up the body temperature of the user and knew that the user is sick. So it searched for proper food for a patient. It chose chicken soup for the user. For the third case, it took in the tone of the voice and the date that is typed in beforehand.

During our discussion, we had changed our idea lots of times.  Initially, I came with the idea of a flexible device inspired by MI Alpha(a concept phone by Xiaomi). In my mind, it’s a device whose screen can be flexed. The largest form of it is a really thin laptop or a pad(like iPad Pro3 or Surface) that can be a substitution for laptops and computers. You can use it to work. Then it can be folded into a form of phone, which can be fit into your pocket. The smallest version of it is a form of watch that can “read the users’ mind”.  However, my other group members thought the concept is too complexed and cannot be easily expressed during the limited performance. So we simplified the idea into a watch that can monitor the user’s condition and make some adjustions through that data.

After our performance, we got some feedbacks about our emphasis is on the kitchen that can cook anything at any time. We found we surely didn’t tell the audience that our watch is, in fact, collecting data all the time and make decisions all the time so the meals are cooked in advance. We need to show this to the audience.

Work Reference

1. Crawford, “What Exactly is Interactivity,” The Art of Interactive Design,  pp. 1-5.
2. Filip Visnjic, The Light Barrier, Third Editio-Drawing volumes in the air with light(https://www.creativeapplications.net/vvvv/the-light-barrier-third-edition-drawings-volumes-in-the-air-with-light/)
3. Antwaun Sargent, Massive Murals Are Popping Up Around Detroit,(https://www.vice.com/en_us/article/qvv3qp/massive-murals-detroit-library-street-collective)