week 9: Video project (Musikavanhu) -Moon

We want to create a video that allows the viewer to control the occurrence of certain events. However, they will be allowed to decide whether or not they will influence the video or not. The idea is to give the user a sense of control over the outcome of the video by using physical real world means to change the video. For instance, if the user would like, they could make the character’s phone disappear in the video by clicking their phone.

Comm lab Comic project Bongani and Sachi


Our project consists of two conversations between a bird, whose first language is English, and a panda, whose first language is Chinese. The home page opens to the background image of the cafe and an image of the two characters which were saved as .png files. Both images are actually linked to separate pages with individual conversations.
The conversation pages have the same background image and characters in addition to speech bubbles containing dialogues.

The dialogue is saved in the form of .png files that are grouped in the same class and positioned over each other using css styling. Using a window.onclick, the entire page acts as a button to further the dialogue which is simply a change in the opacity of the layered images similar to our walking exercise.

function changeText() {

if (counter > 7) {
counter = 0;

else if (counter == 1) {
document.getElementById(‘bird1’).style.opacity = 0;
document.getElementById(‘bird2’).style.opacity = 0;
document.getElementById(‘bird3’).style.opacity = 0;
document.getElementById(‘panda1’).style.opacity = 1;
document.getElementById(‘panda2’).style.opacity = 0;
document.getElementById(‘panda3’).style.opacity = 0;
layering them this way allowed us to ocilate between each character to preduce a dialogue affect,
however this meant that with every statement made, there would have to be another “else if” which could be deemed quite arduos in retrospect.

One struggle with this project was collaborating on coding since there is no “google drive” for code. If one person was working on a code we would have to wait for the other to finish and then send the code to each other, we couldn’t really help each other unless we were sitting together in person using one computer. This placed limits on how much work could be done on each page, because only one person could work on it at a time.

Furthermore, we had initially aspired to insert a hover effect over the dialogue using “onmouseover” however, we ran out of time and understanding.

Week 2: Photoshop Collage – Sachi Shetty

The base picture is of my roommate and I working on the same assignment on Friday. The next layer is a picture of a mangosteen and avocado. I deleted their backgrounds, resized, and aligned the picture of each fruit to serve as a face. Next, I added a blurring filter on the base image, outlined the base image with colors present elsewhere in the image, and added dialogue bubbles to make the base image less realistic. Lastly, in the top layer, I created a large white ellipse and painted the image left outside of the circle white.

Mangosteen Fruit, Pack Size: 10 Kg And 20 KgImage result for AvocadoImage result for word bubbleSpeech Bubble Free.

Mangosteen                  Avocado               Word Bubble          Thought Bubble

Ix Lab Recitation 8: Digital Fabrication (Antonius)

Name of the recitation: Digital Fabrication

Professor: Professor Antonius

Partner for partial step: Cecilia Cai



-Use methods of digital fabrication to realize and construct models.

-Use software or website like Illustrator and Tinkercad to prepare designed files.

-Actualize and digitally fabricate what we designed.

-Document the work and add a reflection.




Cecilia and I decide to build a 3D model because neither of us have any experience in 3D design and let alone 3D fabrication. Both of us have used Photoshop or Processing to conduct some 2D designs before but when it comes to 3D design, we are completely “green hands”. Though Tinkercad is considered to be a basic beginner-level 3D design tool, we still find it challenging to build an exact model as what we expected. Because for 2D design, you only have to focus on four directions: left, right, up, down and the size of the object will not change according to its different positions, but in 3D world, there are more directions to be considered and the shape of the object will “change” when you see it from different angles.

For example, as you can see in these two images, the position of “Chic Rabbit” seems to be perfect from the angle of the first image but gets terribly wrong from the perspective of the second one. Thus, the lesson we learnt is that for 3D model building, we have to check all the angles in order to make a good design like what we imagined in mind.


(Sorry that there is a little typing mistake in the image)

The inspiration for our design comes from two components in the category of “Characters” in Tinkercad–“Chick foot” and “Bunny ear”. Cecilia first wanted to make a bunny but I thought it would be more interesting and special if we could make a unique (weird) rabbit which has chick foot. “Chick” sounds similar to  “Chic” so we decided to name our rabbit “Chic Rabbit”, which sounds like a name for a cool fashion brand. For the first rabbit, we tried to make it look cool and cute just like a popular figure of the fashion brand Moschino:

(cr: link)

So here is how our first “Chic Rabbit” looks from several different angles:


In oder to make our “fashion brand” more all-round and appeal to more age groups, we then create another figure which is named “Baby Chick Rabbit”:


We decide to make them colorful as what is shown in the images, however, we are not gonna to make them colored while 3D printing them. Instead, we decide to only use white material to fabricate these two models and then use pigment to color them with paint brush. 



Thanks for Professor Rudi’s advice, we realize that it may be impossible to print the whole rabbit at one time with the 3D printer because the structure of the rabbit is a little bit complex and it may be not stable when it is being printed. 3D printer works as overlying the material from the bottom to the top, and since the bottom part of our model is two chick legs, which are smaller than the middle part of the rabbit’s body, partial upper part won’t have enough support underneath, and the printer won’t be able to print out the shape successfully. So he suggests that we should break the rabbit into several parts and assemble them together afterwards. For example, first print out their chicken feet separately and then print out their bodies. The texts on their body may also need to be individually printed. Thus, it may be a long process of waiting.

For the fabrication, we decide to first print the baby chic rabbit because it is relatively less complex and may be easier to succeed. We first dissemble it into three parts–“a hand”, an ice-cream and the main body.

The process is long but magical!


This is what we get from the machine and there are many supporting parts that have to be eliminated later.


After Cecilia put them together and tried to remove all the unnecessary parts, the final look of our chick rabbit looks like this:


I think in general, it is quite a success and it turns out that the method of “first dissembling and then assembling” is a really helpful manner. It seems that the chick feet also need to have been printed separately because now those two feet are blocked by the supporting part.


  • Just as what I mentioned before in the section “DESIGNS”, we decided to use Tinkercad to make our 3D models because first of all, both of us have no experience in 3D fabrication before and are eager to make some new attempts in new areas. Second, since we want to make some cute and cool characters, I think 3D is more suitable as they can make our characters more real-to-life and vivid. Last but not least, both of us are greatly interested in Tinkercad itself because as a open-source website, it provides creators with many basic geometric shapes such as the chick feet and bunny ears which provides us with great inspiration. My love and respect for this kind of open-source platform is also a driving force for my choice.


  • My Stupid Pet Trick–“Peppa Pig’s Papa Prank”, which is a stuffed toy of Peppa pig’s papa whose arms will move at a speed depending on the distance between the user and its nose. I didn’t use a lot of crafting methods in my project because the stuffed toy was bought from toy shop and the only thing I “did” to him was (a little violent) to replace his original “arms” with two cardboard “artificial limbs” which were lighter so that the servo could motivate them more easily and accurately. Though the final result turned out to be quite successful, I do think that it could be better if the pig’s arms are not “artificial but its original fluffy ones. However, from my failed attempts, I found out that if I want to use my servos effectively motivate its original arms which are quite heavy, I have to make a specially designed connection part to fix the servo tightly to its arms. The connection part I need has to be custom-made because there are no such things that I can find to serve this job and this is also one of the biggest reasons explaining why I gave up this plan in the end. However, if I had learnt crafting method I used in this recitation before, I would not have to give up my original plan because by using 3D printing, I can easily fabricate the exact shape I want to make. I think one of the biggest strengths of 3D printing as well as laser cutting is that they can actualize those designs which otherwise can only exist in our imagination. With the help of this kind of crafting method, we can make some really complex models depending on our anticipation and need. It is like that we can make custom-made good by ourselves and we can realize our design without worrying about where to find the components we want. This technology can no doubt open up more possibilities for people’s creativity and physical fabrication. When it comes to my midterm project, though I mainly focused on Processing part, I also designed an “interaction box” inside which I attached a potentiometer and an arduino along with a breadboard. The box was not perfect for my project because it was only the best one in the cardboard room and the size of it is only relatively suitable. The breadboard cannot be fit into the box and has to be attached outside which is not beautiful neither. So same with the Stupid Pet Trick project, the crafting method I used in this recitation can create a more personalized, more suitable box for my project and can make it also look better. For my final project “A Mini Chemistry Lab”, I may use the 3D printing to make some experiment equipment so that my sensors can easily be fit into those equipments. And also more in a more beautiful manner.


  • The reading “The Digital Fabrication Revolution” mainly discusses the revolution of widespread application of controlled machines in commercial field and analyzes the impact of some fabrication methods controlled by computers such as 3D printing which is the crafting method I used for my recitation project. An important argument mentioned by Gershenfeld is that computer-controlled fabrication is “personalization, producing products for a market of one person” (Gershenfeld 47) which suggests that computer fabrication is usually specially designed for a particular usage and is therefore unique and flexible. This method is consistent with my idea about 3D printing as I also see it as a way to personalize our creations and actualize our designs. Computer-controlled fabrication makes it possible for not only companies to produce costom-built products but also for creators to enhance their own creative projects.


  • In 2149, I guess that there will be mainly three changes for digital fabrication: speed, size and multiple materials or colors. First, the process of 3D printing will become much faster than now, several hours may become several seconds. Second, IMA student may get the chance to make some bigger 3D printing projects such as bags or chairs. Third, now it is hard for a 3D printing machine to make something that involves multiple materials or various kinds of colors due to the technique limit. But this problem may be solved in the future so that students can make more complex design and do not have to color their projects after printing like what Cecilia and I plan to do. But I think that the basic method of printing may not be changed–to print one floor after one floor to finally assemble as a project. Also, the materials that we can use today will also be available in 2149.


Lab 2

Exercise 1

Part A

Step 1

  • Take out a push button, a 10kΩ resistor, a 220Ω resistor, and a LED light
  • Hook them up
  • Open Arduino> File> Examples> Digital> Button
  • Add lines to lit the LED when button is pressed
  • Press the button

Step 2

  • Use the same circuit as step 1
  • Add 4 more lines to blink the LED

Step 3

  • Use the same circuit as step 1 & 2
  • Modify some lines to fade the LED light when the button is pressed

Step 4

Component list:

  • Red LED
  • Yellow LED
  • Green LED
  • 220Ω resistor
  • Push button
  • Cables

I build a traffic light, which … works like a traffic light. Just check out the video clip.

I got some problems for this part initially. When I pressed the button, the green light blinked and nothing else happened. Then I realized I have to add more delay, because after I pressed the button, the state of  loop (green light to yellow, yellow to red, and red to green) would change hundreds of times before I release the button. So that I increase the delay to 500ms and solved the problem. (Why 500? Because you are clicking the button not holding it!)

Part B

Step 1

  • Take out a potentiometer
  • Rebuild the circuit in partA-step1
  • Substitute the push button with potentiometer and link the middle leg to A0
  • Upload the code
  • Spin the potentiometer to change the brightness of the LED light

Step 2

Component list:

  • 3 potentiometers
  • Red LED
  • Green LED
  • Yellow LED (to substitute a blue LED which I planned to use but couldn’t find in the box)
  • 2 220Ω resistors

I build a disco ball … sort of … Though it’s neither a ball nor plays disco music, it can blink your eyes blind! Three potentiometers are used as controllers, which take charge of color cycle speed, brightness and blink speed. Just check out the videos.


At first I couldn’t make the blue light in RGB LED working. Then I realized I was connecting all the components to one single ground. So that I linked the ground of the RGB LED to a separate ground and solved the problem. (Maybe there’s a current limit for one ground port?)

Exercise 2

During the assembly of the circuits, we used many electronic components as inputs and outputs. Which components do you recognize in the city?

  • The push button are very common in real life, for example mechanical keyboards are basically a matrix of push buttons. And LEDs are get increasingly popular nowadays. It’s used as light source in the lamps, screens, projectors and etc.

If you have 100000 LEDs of any brightness and color at your disposal, what would you make and where would you put it?

  • I’ll make a huge disco ball and hang it on the moon. Then I’ll program them to flash randomly at maximum brightness that everyone on earth can see it.

Which reflections about the nature of interaction can you make about the Figure I.1 in the Physical Computer reading?

  • In Figure 1.1  human are depicted as merely an eye, a fingers and two ears. Though the technology has advanced a lot, the way computers see us remains the same in most cases. However, that is not the way human being interact with the rest of the world. We can give out commands with voice or body movements and sense by touching and smelling. So that it’s very necessary for us to develop a new way to interact with the computers.

Week 2: Photoshop assignment (Leon and Nimrah)

Photoshop Assignment:

Wow. This took me the longest time to figure out. I mainly used the clipping tool where you select the object you want and placed it on a different background via masks on PS, and it was very frustrating because I had to constantly select and deselect. But overall, in the end I was very happy with my final product and I think all the frustration was worth it because I never thought I would be able to create something like it.

Week 3 DOM &COM exercise (Vasudevan)

In this exercise, When you click the “puppies”, you will receive a comfirmmation whether you want to see some pictures. After clicking “yes”, the pictures of kittern will be changed to the puppies pictures. Besides, the font size , color and the content are also be changed. Next, when you click on the Bunnies, there will pop up an alert to tell you that “see some cute bunnies”. And also here the content will be changed again to “Don’t forget to click on the ‘Hedgehogs'”. So when you click on the Hedgehogs, there will be a pop-up window inside which is a video of hedgehogs.

The biggest problem is when I was making the confirm function, I hoped that once I click on the “yes” the images will show up and the font will be changed at the same time.

But I find it doesn’t work. In that case, I change my mind. I put some other documents like this.

In this way it finally works. From this process, I learn how the confirm function works specifically. In addition, I know about tons of different tags.

This is my link

Final Project: Emperor’s New Clothes

My final project was based on the classic fairy tale from Hans Christian Andersen. Here’s the link to the original story: http://www.andersen.sdu.dk/vaerk/hersholt/TheEmperorsNewClothes_e.html

The modification I did to the story was changing the sequence of the two major events that happened at the end of the story, the crowds praising the clothes, and the child pointing out that the emperor was actually wearing nothing at all. The message behind the story now is about it’s better if you talk less.

The initial inspiration on this modification was the issue of speech freedom in China. Not just China but I’m pretty sure that all governments over the world are constraining people freedom of speech. It only differs in its degree. Like in the original story from Andersen, the king wanted this clothes because he wanted to tell the people that are not suitable for their position/ people that are stupid. It’s for the good sake of his own country. In my modification, the minister chooses not to tell the truth because he wants to stable the govern. It appears to him that it’s better to have a not-so-smart king than the events (revolution, chaos, and etc.) that’s gonna arise if the public realized that. The king and the minister’s deeds all come from a good original intention (the courtier is just selfish and don’t care about the future of the country).

However, when it comes to the public, most of them don’t dare to speak up. Those who dare to speak up, just like the little child, are “taken away” for the “good sake” of the country. You don’t have to solve a problem if there’s no problem.

Yet, it still comes back to the problem, to what degree can a government control over people’s freedom of speech? No more social media or search engine form the capitalist society. No one is allowed to oppose the rightful government. Everyone is only allowed to praise the ruler. Indeed, the government will live happily ever after.


Here’s the original storyboard I made for the animation, However, it turns out to be that I’m not going to make it clear about the two storylines that I proposed. I go ahead and deleted the “real world” line and kept only the paper puppet part.


I hand drew all the characters on Photoshop and used copyright free images for the background and the group of crowds.

Then I printed them on 300g A3 paper with the school printer and hand cut them. I used blue tacks to stick the paper doll on a bamboo stick so that I can film and animate them. All footages were taken by the Panasonic w850/w870 camera from the library. It has a really close minimum focus range and works really well if the video is the only thing that you require.