Archive for September, 2011

More interactivity with ramen
Press “e” for eggs.
“o” for onions.
Click on the mouse over the bowl to add noodles.

Will add more stuff.

Let’s play with electricity


This week doesn’t require any mad programming skills and just basic electrical know how.


With the help of helping hands, this allows me to both hold the points together to get a reading on the multimeter and take a picture at the same time. Of course this one beeps.

So does this one. Notice that I wired the board in such a way that both sides have power and ground.


Which of the images above has a complete circuit?

But fun question, does electricity pass through our bodies? Yes, but we still provide enough resistance that the 5V from the Arduino will not shock us nor complete the circuit.


And just like that with a resistor and all, we have another lit LED.


Interesting that the LED uses approximately 1.72 V out of 5V.


The amount of electricity passing through the resistor is approximately 3.31 V. Add that up it’s almost 5V. At least we know where all the power is going.



Let’s add a switch and see if it affects the power flow.


Well apparently all it does is just cut off the power completely.


Notice that the gree light is not as bright as the red one. Different color LEDs have different power requirements.



Notice the difference between the power usage of the green and the red LED and the amount that passes through the resistor.


Now when we add another LED, they don’t light up as brightly as before.


The resistor is now only getting 0.14 V.


But if we re-arrange the LED’s that they’re all being powered by a single line instead of a series of leads. It’s a whole lot brighter.


The resistor is using up 3.38V. while the LED’s are at 1.65 V.


What’s wrong here?

Under pressure

Named after that song from Queen, now I have to program the arduino to recognize an analog input. Meaning, it’s not just as simply flipping a switch. This requires and entirely different mindset.


Using a knobthingy commonly known as a “potentiometer”, it allows the light to switch on once you turn it past a certain point. Notice that the potentiometer does not use a resistor and is an exception to the rule.

Now I wanted to control the intensity of the LED using a light sensor. So I ended up with this. It still needs a bit of tweaking on the range the sensor recognizes but it more or less captures the desired result.

I’m still working on two LEDs and two pressure sensors.


Wind machine

There used to be a cable channel back home that was called the “Aquarium channel” which was basically a camera pointed at a very large aquarium and played classical music the whole day. Sometimes, there would be dead fish floating and other times it was being cleaned or something. Eventually they took it out and replaced it with something more profitable.

I thought it was a great break in the channel programming where people could just stare at the aquarium and just relax but saddened that as with any television entity, you couldn’t really interact with it.

I propose a visual array of bamboo trees with the sound of wind just rustling through and moving each tree individually.


Thank you softypapa for the great video.

Instead of using a camera to capture motion to sway the trees, I was thinking of using various microphones strategically positioned around the display to sense where the wind is coming from and move the image accordingly.

Or I can put an array of flex sensors inserted into actual bamboos located in a remote location to and via IP addressing to send the signals back to the display to move the bamboo trees visualization.


Animated Ramen

This particular homework was problematic at the coding level at first. Working with Alex, my assigned partner we figured out on how we’d like to animate our projects and went to work.

I went through 3 different revisions of the code posted last week since now I had to add “void setup” and “void draw”. One will setup the set elements into the sequence and the other will animate.

The bowl was problematic at first as it kept saying I was mixing “active” and “static” elements. I then moved the bowl code to be included in the “void setup” command and it worked! Now the problem was how to animate.

At first I could get the “mousePressed” command to work properly. I gave up on that code at first and moved on to another code to use. I ended up without control in the case of my ramen. Everywhere I moved my mouse it just spread the “ramen” code all over the screen.

So in frustration I gave it a rest. Then in one lazy Sunday morning I figured it out! It turns out that I lacked a closed curly bracket

And here’s the final product. Click on the mouse to add the ramen and for the final touch, press the spacebar for the eggs, spring onions and chopsticks. Enjoy!


Dragon Age II: Mark Of The Assassin

Legacy was a great DLC which provided both character development for any scenario selected and was a far cry from previous Dragon Age DLCs which were downright disappointing.

Now they’ve announced Dragon Age II: Mark of the Assasin featuring Felicia Day.

So it’s not the made for the web tv show that Bioware announced earlier in the year which was supposed to come out during the summer but this is good as well.

From what we can deduce from the trailer, it looks like Hawke and a new character “Tallis” journey to Orlais to steal a jewel called “The Heart of the Many”.

The gameplay look like it’s a solo Hawke adventure which means no companions but that could change couldn’t it? The story seems like it would be best with Isabela in the mix since it involves sneaking around and stealing stuff. But that’s just me.

Good thing thing to know that we don’t have to wait that long for this DLC. The game will be available for download on the PC, PS3 and Xbox360 on October 11 for $10 or 800 Microsoft points.

What are the sensors in my neighborhood?

This weekend while taking the subway I noticed a number of physical sensors that I didn’t notice before.


This particular button is not common in New York well at least I haven’t seen much of it in Manhattan. But pressing this button will tell the traffic signal light that there is a pedestrian who wants to cross and the light will change shortly afterward. But then again, it could be a placebo effect, giving the user the illusion that the light will change soon but in reality, it’ll change when the program tells it to change.


Here’s a light that doesn’t have a sensor but in my opinion needs one. I see three different sensors that could work here. One is light sensor, which would tell the streetlight to turn off once it detects a particular amount of light (supposedly sunlight) to detrmine it’s on and off. Another is solar panels so it’s not too bad that the light is on all the time since the light is powered by solar energy. Then the third sensor would be the exisiting sensor which is based on time. Much like water sprinkers, these are set on a timer where the on and off is determined by a timer on the switch.


The Metrocard machine is a plethora of sensors. There are the input buttons on the touchscreen. There’s the numeric keypad for credit card and debit card holders to enter their information. The coin and bill sensors that determine US legal tender is being inserted into the machine. The braile pads that help the blind in getting their passes. And then of course the Metrocard slot where the machine either accepts or dispenses the card and reads how much is left on the card.


Of course what’s a Metrocard without the sensor that you use it on. Other cities such as Singapore, Tokyo, Hong Kong and London use RFID cards instead of the magnetic strip that the NYC transit system uses. I first used the Metrocard in 2002. I was used to the tokens all this time that it took a while to figure out which direction the magnetic swipe had to be for it to work.


I’m not sure if it can be seen here but I suspect the subway is outiftted with all sorts of sensors. Most of it detecting the position of the trains. This particular sensor at the station, I guess that sensor tells all the other trains along the line that there is a train present at this station and informs the other stations down the line with the announcement ” There is a Manhattan bound train one station station away.”

I saw this at church today. This emergency light has an electrical sensor. In the event of a power outage, these lights turn on.


These exterior lights can be switched to detect motion in the event someone walks in front of the range of the sensor. This is great at night so you don’t have the light on all the time.


At the MOMA there is this device. Though not part of the installation but still has the “do not touch” warning next to it, I could guess that thsese are motion sensors that detects the presence of someone in front of the display. This is only present on displays that use a monitor and will then play the video once there’s a person in front of the display.



The displays are each identified with QR codes which directly links the viewer to a website with more information about the artwork. Of course in order to read this, your smartphone should have a QR reader.

Barcodes on everything is no different. These help stores and companies track inventory as well as make purchases accurate and efficient at the checkout counter.

If I see anything more before Wednesday, I’ll update this post.

Website design analysis

For the first homework for CommLab, I’ve selected a local Philippine news website for analysis.

“” is the news website of the television station TV5. After being recently acquired two years ago, they have yet to establish as webpresence as a news organization. Most Filipinos get their online news from three major websites which makes everything they’re doing is like starting out from scratch and build their audience from there.


This is the front page of the website. The headline encompasses the center but highlights features such the 9/11 article and the attacks in Afghanistan.


Using a single grid to line everything up nice and tidy, the user doesn’t need to worry which one to look at first as it is presented in a very linear fashion.


It shows in both the negative and positive space that every pixel on the site is used thus giving it the image of being very clean and professional as a news site should be.



The color selection is kept to three main colors which is the color of their logo using RED, WHITE and BLACK. The only deviations from these colors occur in the images that link to microsites from the main site. Fonts are pretty much kept to sans serif fonts and limiting it to 3 an again, deviations only occur in links and images that lead to microsites.


As we scroll down, the page splits into a three column setup which then the user has the option to decide which to read first. Due to the tightness of layout, it still remains clean but a bit confusing on where to go next unless you already know what you’re looking for. The splits in page are interesting to note as they occur at a page break if your monitor is set at 1024 x 768 which doesn’t make it jarring for the user.



Scrolling even further the site adjusts to the 3 column layout to ben evenly spaced. I feel like this page was intended for a tablet due to the large space devoted to the commentary pages and more microsites.


Still it maintains the tightness of the layout as well as the solid space that it’s occupying.

Screen Shot 2011-09-13 at 2.33.38 PM


So how does the “Interaksyon” website fare? Direct to the point, concise and not a waste of space. It both functionally serves the the quick access to news part, which is important to the user. One does not need to find the headline nested beneath at least two more clicks. It shows practically everything on the front page but if the headlines aren’t for you, you can just easily click on the menus on top or just scoll down. Very easy to navigate.



Talk to Me @ MOMA

The “Talk to Me” exhibit at the Museum of Modern Art in New York is appropriate for the timing of the show and the scope that it shows. The show in my opinion basically conveys, everything is interactive.


Even though everything is interactive, there are varying degrees of interactivity. Some installations required you to actually touch the display in order to see the “magic” that occurs, others were visual displays of the results of the device created.


But as static some displays were, the exhibition itself had a degree of interaction from the mere scanning of a QR code in order to get more information about the work.


But now what if these codes were ported elserwhere.


I would describe interactivity as both parties to the action are aware that there is a response being waited upon each action compared to the idea where a static work such as a book.

Even though we interact with the book by reading it and reacting to the words on the page, it’s not interactive. It’s participation. The book does not expect a response from the reader nor does it care (Crawford 2003).

The museum experience is usually participatory as we willingly enter and absorb the works that stand before us. Like Monet’s “Water Lilies”, the benches that sit before it on the 5th floor of the MOMA invite the visitor to sit in front of the installation and look at the painting.

This is in stark contrast to the “Talk to Me’ exhibit.

I believe interactivity is where the work is complete once the intended user completes the cycle to which the art is represented. I see it very evident in the augmented reality works. They may range from the QR code in the field (pictured above) or the fact that USB ports stuck on the wall invite users to stick their computers next to it to download an image into your computer.




Roopa (@rouxpz)getting a virus from the wall.


The Hungy Hungry Eat Head needed users to hold augmented reality cards for the program to put animated heads over their bodies displayed on a giant screen for everyone to see.


Augmented (hyper) Reality : Augmented City 3D

Though these works in augmented reality were not interactive at the show, at the time of their creation to the public is highly interactive. Though I believe the Augumented City 3D is conceptual in its “Minority Report” likeness but everywhere. It shows on how the tech can take us in that direction.

But not everything on display was as interactive as others as there are varying levels of interactivity with the work.

The Bat Billboard I believe is one example where it is not human interactive but instead bat interactive. We humans just watch the response on the billboard to describe the actions of the bats.

I found the BBC Dimensions exhibit particularly interesting where it uses existing data such as the length of the moon walk by the crew of Apollo 11 in real scale or like how long the mars rover travelled. It gives us who are not involved in theses events but curious to know about the information a sense of the scale of these events were traced out to our neighborhood which brings it closer to us.

Of all the works I do enjoy the fact that LIttle Big Planet made it to the exhibit in comparison to all of the “interactive” videogames out there. I believe this is the closest to mass market interactivity we can get that is not essential as compared to ATM interfaces, metro and oyster card dispensers. The level of user intervention in the game takes it beyond the participatory nature of media and instead turns it into something else.

Maybe in the next exhibit we’ll have to redefine “interactivity” once again. But for now, the future looks promising.



Crawford, Chris. “The Art of Interactive Design” (2003) No Starch Press. San Francisco.