Concept and Design

Me and my partner started with an idea that we want to call upon peace and lead people to rethink the relationship between countries in the current world given the exponentially developing technology in the recent 50 years or so and the recent international incidents related to military such as the Cuba missile Crisis and more recently, the North Korea nuclear crisis. We don’t see a winner in such incidents, and that’s when we agreed upon that we want to make a game that either has two winners or none. We think that combining the traditional dice-rolling board game and digital interactions would be a great idea because computer programs can add more surprises and assistance to the inter-personal communication nature of board games. Specifically, we can throw out different endings during the game, impressing the players by catching them unprepared; we can add more fun with Arduino interaction; and we can use LEDs to indicate each “step” in traditional bard games and let the computer take over the movement of characters to avoid this unrelated process to the experience and message we want to deliver. Letting our users think from a macro-perspective by making each of them player the role of an entire civilization, we wanted to create a kind of “event” that would happen at some “steps” that would lead the users to attack the other but at the same time have a choice of not harming the other. When the previous steps can make our players form a pattern of attacking each other, the last step will be in the same form yet give two different endings depending on whether a user sticks to the same pattern or change their mind.

Fabrication and Production

Realizing the idea took much effort from me and Katherine because this is such a huge project. During the starting stage of our production, we had an incredibly long list of to-dos: fabrication designs, connecting LEDs, serial communication, and the excessively complicated program that we wanted to realize. But an improvement from midterm was that this time we seemed to have more confidence in each other and split the work clearly. In the meantime, we asked each other and people around us of advice every time we achieved something on our own portion of work, making the entire teamwork experience dynamic and communicative. Katherine was in charge of the physical board and I was in charge of programming. She gave me some great advice of adding an instruction page or giving a game tutorial to the users to make sure that there isn’t any confusion among our players. And I asked whether we could make the board larger and have the computer integrated onto the board to make the experience more immersive and user-friendly. Another improvement is that even though we went directly to the final version during midterm, we both chose to make a prototype before user test to see whether our ideas are effectively delivered. I made a rough version of the program and Katherine made a board half the size of the one we had in mind. When these were shown in the user test, we saw a lot of problems as well as motivation in people’s reactions, and these reactions finally lead to a lot of our final improvements. We saw that when people have to move their characters by hand, it takes up too much of their time and distracts them from the information we show on computer. Also, people got confused by the program easily because not only whose turn is not specified on the screen, the time we left for people to read them is very limited. But in the meantime, many fellows and students appreciated our idea, which drove us to always make a better version of the project. For me personally, the largest challenge I got was figuring out how we could let buttons on Arduino to tell processing when to react, and also let processing tell Arduino back how many points a player rolled to blink the LEDs. Because we only learned one-way communication in class, we were so afraid that this might not be achieved because if it doesn’t the entire idea of the board would be tedious. Therefore, we spoke to several fellows to ask for help and a senior student at the studio gave us a lot of assistance and inspiration. To be honest, a lot of knowledge we made use of in our project wasn’t mention in class, like Katherine’s converting a picture into lines in illustration, and P3D environment in my program. But at the end of the day, we both went out and seek help with a clear purpose in mind. The feeling of finding a way to realize what we’ve always wanted for our project since its proposal was so wonderful and we thank everyone who helped us during its production.

Reflections

While we are both proud of what we’ve achieved at the end of the semester, we have also thought about things we could have done better. For example, a lot of people complained that it’s weirdly quiet because we never incorporated music. I also thought that I should have add more animation when we ask our users to press the button really quick to give them feedback when their pressing is successfully recorded by the system. And we definitely could make the endings more visual and graphic to make the message feel more powerful. On the other hand, there are also cheers that I want to give both of us about the design. My favorite part of this project has to be how self-explanatory we’ve made it to be. The choice of one button for all interaction was particularly brilliant because it makes the game more fast-pace and easy to play with when the users do not need to switch from sensor to sensor. Even small children at the end-of-semester show can quickly get the rules even though it’s been a massive undertaking to explain to the whole class in words during the ideation stage. We’ve also nailed the system of LEDs to let them be a powerful source of telling players where they are in the “development of civilization”.

Conclusion

We said we wanted our users to understand the consequence of unlimited arms race and we want them to rethink international relationship. I think we have delivered the message quite well based on how people react when they saw the ending of the world is doomed. However, we could definitely make it better by giving our users a clearer hint of another choice other than attacking each other to see how they would choose under the same circumstances. But I guess the current approach creates better suspense and brings the feeling of waking up from the traditional mindset for our players. Throughout the semester, I’ve been defining interaction as

“the process in which two parties involved repeatedly send information through media such as words, sound, image, physical movements, etc, while receiving the other’s information simultaneously. The more types of information are involved, the more interactive this relationship is.”

According to the criteria I set for myself, I think our project has successfully met my previous expectation because we’ve incorporated light, image, animation, and touching experience into our interactive project.

One interesting fact about our project is that, not a pair, no matter in user test or in class, has achieved the peaceful (good) ending the first time they try out our game. We’ve seen them astonished by the sudden black screen, yelling in regret, and showing an expression of dawning comprehension on seeing the bad ending. That’s when we know they’ve gotten what we want them to take away from our project. There was one boy who played with his mother and saw the bad ending during the show. He asked her what just happened, and she told him exactly what we want our audience to know. Although our effort seems trivial compared with the scale of international politics, this is the impact we want to make.

Code

https://github.com/brilliantTya/Interaction-Lab-Final.git

For this week’s exercise, I created a program that changes the color of an image based on the value sent back from Arduino. The program works like this:

The color changes smoothly because I changed the colorMode into HGB and mapped value sent back by a potentiometer, which is between 0 and 1023, into between 0 and 360.

I think this program can be used in the future to make a digital color filling book, where you choose a section and then decide what color you want to fill in this section. This may help people reduce pressure when playing with it and creat their own art work.

Here is the code on processing attached:

import processing.serial.*;
PImage photo;


Serial myPort;
int valueFromArduino;


void setup() {
  size(500, 413);
  photo = loadImage("bob.jpg");
  photo.loadPixels();
  printArray(Serial.list());
  myPort = new Serial(this, Serial.list()[0], 9600);
}


void draw() {
  tint(valueFromArduino, 100, 100);
  image(photo, 0, 0);
  
}

Exercise 1: Make a Processing Etch A Sketch

Here is a schematic of a circuit made up of two potentiometers, each controlling the x-value and y-value on the screen.

With the ellipse changing position, the program operates this way:

When you think about how Etch a Sketch works, essentially it is only detecting values on the two handles and drawing a straight line between the values returned in two continuous detects. In the video given, the reason why the lines are so smooth and real is because the toy makes detections way faster than Processing, and handles on the toy is also larger than Arduino processing, making controlling them easier. 

I think while this is a very simple and flat interactive relationship, their is quite a huge potential in what people can achieve through it. It can also help its children or even adult users to develop creative thinking by brainstorming what one single line can make up. However, I don’t think this is the best way to create art for a commoner on a daily basis because it requires some sort of artistic threshold to make a vivid picture with such limited material. Other digital drawboards with way more features would help daily art creation better.

Exercise 2: Make a musical instrument with Arduino

Building the circuit and coding is easier compared with designing how this program should be like. Since you can choose either or both of your keyboard and mouse to control the sound, which one you wants to use controlling length and tone of the notes is a central question that I needed to design to make using this program easier. Finally, I decided that while moving the mouse creating a sound might be fun, it is not quite practical. Therefore, I chose to build this classic keyboard where each key on the second of your keyboard leads to the sound of a different note. And I made the length of one sound linger a bit longer after the user stopped pressing the key to create an experience like playing a piano.

The Epic of Us

The idea of this project is to make a digital board game that takes the area of around 1.5 square meters. On the cardboard, we will raster a road that winds through, and along the road, there will be 2D scenery drew with laser cutter. Every several inches along the road there will be an LED implying one step, and by interacting with the computer program hooked onto the cardboard, two players will be virtually going down the road and experience a series of events.

The game goes like this:

Two players each represents a country, and they will be told that the goal of this game is to destroy the other player’s country with weapons they obtain during the game to be the winner. On the computer program, there will be an animation of a dice and the two player’s HP values. A button is connected to the program for the user to interact.

When it comes to the first player’s turn, she first presses the button and the dice will randomly display one side among the six, and the player will march forward the number of steps displayed on the dice. The LED will blink on the place where she arrives. There will be an event preset for every step such as “people in your country just invented stone swords” or “there is an earthquake happened in your country, go back 2 steps”. Whenever a player arrives at a step after she tosses the dice, a message box will tell the user about the event.

After that, if the event is about the player going forward or back several steps, the according LED will blink again but no event will happen the second time she moves in a round. But if the event is about a weapon invented, the program will let the user decide how much HP she wants the other user to drop. The process of determining the amount of points goes like this: a bar will appear on the screen, and the fill of the bar is constantly moving back and forth between 0% to 100%. The user presses the button to stop the moving and the place where the fill stops represents how much percent of the weapon’s power she wants to use against her opponent.

(For example, if the weapons “stone sword” has the power of 200, and the user stops the bar at 40%, then her opponent’s HP value will drop by 40%*200, which is 80 points.)

This way, the user can choose whether to be friendly with her opponent or destroy her opponent’s country.

There is an indication in this game that along the road, pictures printed beside it is different. At the be beginning of it, there are natural and primary things there such as mountains and trees representing a backward society. But as the users continues to play and reaches the later steps, the pictures printed along the road would become houses, castles, and finally high-rises to indicate the technological development of the society. Of course, as the game goes into later stages and the technology develops, the weapons they get will become increasingly powerful. At the beginning of the game, a player can only cut the other player’s HP by 10 or 20 points. But as they approach the end of the road, the weapon they get will be so powerful that if they hit near 100% in the bar, they can cut as much as thousands of the other user’s health points. If any player’s HP goes to 0, the game ends. Else if one user reaches the end of the road, the game also ends.

However, if one player’s country reduces the other’s HP to zero, the program would not notify that she wins. Instead, it will say that the weapon this country uses is so powerful that both countries fell into ruins during the war, and no one wins. We designed the game to actually warn the players that it is no good for the countries in our real life to compete against each other, and this endless arms race on the international stage is only going to waste money in vain and bring sorrow and fear to the people, just like what happened during the cold war. It is obvious that if crisis such as the Iran’s nuclear issue and Cuba missile crisis keep happening then no one will be the winning on earth. Just like our game, in the end the competition will only put the entire human race in a vulnerable place of diminishing together.

But in our game, there is another ending. If the players choose not to attack the other country by stopping the movement of the bar at very small percentage and both countries survive with a lot of HP remaining (exactly how much is still under discussion) when one of the player reaches the final step, the program is going to notify that both players have won this game. This is a metaphor that collaboration between countries will bring prosperity to all nations around the world. Although our game does not offer a concrete solution to the negotiation between countries in the real world, we do want to increase awareness among common people. It will tell a cautious tale in a fun but educative way to adults and kids alike.

While I feel that the concept is pretty finalized, the details of the game design is still a large challenge for us. Since there are stories and events going on during the game, we want to make the game balanced and playable. Also, programming is going to be hard because everything about the content should be embedded in the processing codes. How to link the many LEDs to Arduino boards is also a huge problem. (I am currently thinking about using a tiny car that has a trail tracking sensor on it to go along the road as a substitute for LEDs.)

Next week, we want to figure out how we want to represent the users taking steps or going forward: whether we want to use LEDs or using other methods. We also want to go to the ARC to talk about how we are going to realize our programming with processing. During the week of 12/1-7, we want to focus on programming and designing the look of the board. During the last week before due, we will put everything together and run user tests.

Throughout this semester, I defined interaction as “the process in which two parties involved repeatedly send information through media such as words, sound, image, physical movements, etc., while receiving the other’s information simultaneously.” And I set a criterion for interactive relationships that “the more types of information are involved, the more interactive this relationship is.” I think our project fits my definition of interaction because when playing this game, the computer will be telling users information, and the users will tell the computer back about their decisions. This is a continuous process which involves a lot of ways to transmit information such as the blink of LEDs, virtual and real patterns and pictures, and words from message boxes. We want our users to really engage in this game, so we designed both the computer program where they can get all the information and the board on a table so that people can still be face-to-face when they play the game and enjoy the time with their friends.

While we have a lot of pre-written events and endings to show to the players, we want them to get the metaphor of this game by themselves. That’s why we designed the indications such as the development of arms technology. Just as Tom Igoe wrote in his blog, “if you’re thinking of an interactive artwork, don’t think of it like a finished painting or sculpture.  Think of it more as a performance. Your audience completes the work through what they do when they see what you’ve made.” Only by driving the users to think themselves can they have a deeper understanding of the issue. Since our project is more of a one-time thing (because once you understand the indication, the game wouldn’t be fun anymore), I think its future development may be in a mall or a public place where passers-by and come near and try it. The idea is quite similar to the project “dancing traffic light” I mentioned in my participatory research. When people come across them in a public place, interacting with them helps to solve a social problem.

Reference

Materials:

1 * 42STH33-0404AC stepper motor
1 * L293D ic chip
1 * power jack
1 * 12 VDC power supply
1 * Arduino kit and its contents

2 * Laser-cut short arms
2 * Laser-cut long arms
1* Laser-cut motor holder
2 * 3D printed motor coupling
5 * Paper Fasteners
1 * Pen that fits the laser-cut mechanisms
Paper

Step 1: Build the circuit

For step 1, I assembled everything according to the diagram in a minute because we’ve had so much experience in wiring up H-bridges. However, I have to admit that I never thoroughly figured out why the cables need to be connected this way. And although I have a blurred memory that we have talked about why the H-bridge controls the rotation direction in class, I am still not sure why it worked this way. So, I read through web pages and documents on the electronic parts, and I learned that a stepper motor functions following the change of electromagnetic signals.

As shown in the picture above, electricity magnetizes set 1A and 2A, flowing through the red and black wires, and set 4A and 3A, flowing through the green and blue wires,  in turn to attract or repulse the rotor and make it rotate. When electricity flows in the other direction, the rotation direction of the stepper will also change.

The turns between the sets are controlled by the H-bridge, giving high and low signals to pins 1-4A. And while we give 5V power to pins 1-4EN to activate pins 1-4A, electricity into V(CC1) is used to power the H-bridge itself, and that into V(CC2) is giving power to the stepper. That’s why we give different power to pins 1, 8, 9, 16 in the picture above, and the step motor has 4 wires attached to it.

After uploading the stepper code, the rotation direction is changing constantly.

Step 2: Control rotation with a potentiometer

If I want to control the angle of rotation based on the angle I turned the knob, I need to map the value returned by the potentiometer to the step of the stepper. Here is the revised code:

#include <Stepper.h>
#define STEPS 200
Stepper stepper(STEPS, 8, 9, 10, 11);
int previous = 0;

void setup() {
  stepper.setSpeed(30);
}

void loop() {
  int val = map(analogRead(0), 0, 1023, 0, 200);
  stepper.step(val - previous);
  previous = val;
}

Step 3: Build a Drawing Machine!

While I was assembling the machine, I found that the hands and the base are all laser-cut from the lab. I was amazed by how much the simple parts are capable of when they are properly organized and designed–with a basic stepper hooked on Arduino and the common paper clips,  such an interactive device that draws out patterns is manufactured. I had great fun watching these two discs turning on my command and dragging the hands with them.

Documentation:

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 am interested in building a machine that is pleasant to look at and fun at the same time. In the Papier project, not only are the patterns on the paper artistic, the device is also working perfectly as toys. Both of these two factors would make a machine cater to the need of its potential users aesthetically and pragmatically. 

The actuators are the fundamental part of a machine if the designer intended to have the machine fulfill its job by moving. The more delicate the movement of an actuator, the better job the machine can accomplish. However, when I was reading the articles assigned for week five, it was unexpected for me to see that some small devices that involve using actuators are not electronic. A lot of toys takes energy when human touches or play with them. Also, a lot of Automata in the articles have the actuators exposing to the viewers. I always thought that putting the gears inside a device is a rule for machine designers because they are believed to be fragile and to mechanical to look at. When I think about it, I realized that they make much sense because when people watch the functioning of machines through its exposed inside organization, they can have a deeper understanding of the devices. And for children who play with these toys, it is also fun and inspiring when they see the parts moving to his movements.

Although in this recitation I built a machine that draws, I do not think that art in the future should be taken over by computers and artificial intelligence, because somehow I think that art or beauty is the deepest feeling of humanity, and should be exclusive to the naturally developed consciousness. However, I am not against using computers to assist the production of an idea because machines are tools for us and we better make the best use of them. For example, when an artist designs a sculpture, 3D printers can make the technique of carving materials not a limitation to him. Therefore, while an idea should be original, the process of realizing the idea can be assisted.

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?

The piece Fish, Plant, Rack created by Andy Gracie shows the communication between the three parties and how they help each other in surviving in a system. The fish in an aquarium sees the situation of the plant’s growth, and the robot reads its electric discharges to care for the plant. I think this design is brilliant because while it involves the aspect that computers are capable of and human beings are not, it also shows how machines can be integrated in the world of lives and help them live. When compared with what I’ve been doing in this recitation, I think the main difference is that while my device creates art in a random manner, Gracie’s device reads information from real life and brings a change to it. I really like his choice of actuators because in the photo, the robot seems to be moving smoothly in an environment filled with water. And I think the shape of the tube growing these plants has also made it harder for the actuators to move in between them.