Archive for October, 2009


I wanted to do more with the accidental butterfly that I made, so I conceived of a harmonious environment built around butterflies that would be disrupted if a user got on a balance board.  (I didn’t realize until after reading the mathematics and translate/rotate sections in the book how similar this idea was to the Lesson Six Project.  There are also two groups in my Pcomp class who just announced that they’re making balance boards, so I might change my physical interface).

Dan suggested that I just work on making one butterfly move in response to the mouse for the Week 7 class.  It wasn’t too hard to make the butterfly move in response to the mouse within the butterfly object class, but the vector curves didn’t move in tandem with the vx, vy coordinates.  I like the effect of the wings lagging behind though (one has to click on the image to initiate the butterfly moving with the mouse).  CLICK HERE to see this sketch.

I really wanted to try making the butterfly move in more complex ways though and in a three dimensional world, so I experimented with OPENGL, rotations and the perspective function, which I found in the 3D tutorials online.  I added a sun, which is a rotating sphere, and a ground which is a simple rectangle.  When you click on the mouse, the perspective is activated – move the mouse around to see the butterfly – still flapping its wings – in relation to the sun and ground.  I can’t figure out why the color of the wings doesn’t render well in 3D and I’m not crazy about the perspective on the butterfly, so this sketch certainly needs more work and I need to get some help with these 3D functions.  CLICK HERE to see the 3d version.

This “Serial Duplex” lab makes use of multiple sensors.  In my case, I used a potentiometer and a photocell for the analog inputs and a standard switch for the digital one.

Pcomp week 7 lab wiring

After following the instructions and getting the white circle to move horizontally and vertically based on the sensor values, I changed my Processing code to create an ellipse in openGL that rotates on the Z axis.  I mapped the values from the photocell (“g = map(sensors[0], 50,520,1,255);”) to both the Green value of the ellipse color and the Z value of the “translate” code (for example: “translate(width/2, height/2, g);”).  I mapped the values of the potentiometer (“b = map(sensors[1], 0,1023,1,255);”) to both the Blue value of the ellipse color and the Z value of the actual ellipse (“ellipse(0, 0, 100, b);”).  I didn’t really want to use the switch, so I just set it to the Red value of the ellipse color.  The “theta” value for the Z rotation increased by 0.02.  Here’s the video demo, shot by Matt Richard:

Pcomp Week 7 Lab: Multiple Serial Output from N Z on Vimeo.

I had lunch with Susan Finley today at the City Bakery, whom I worked with at The Producer’s Project and who was one of the two people who wrote recommendations for me to get into ITP.  When she went to the bathroom, I turned around and noticed this framed sensor (looks like a temperature or lighting control system) on the wall.  Fascinating.  It brought back memories of the sensor walk and reminded me to keep my eyes open for spotting such unusual sensors.

Framed Sensor

Our assignment, in a nutshell, was to observe a piece of public interactive technology, used by many different people, and take notes of how they use it, what seems to work and what doesn’t.
NZ_NJT01_3219aw
NZ_NJT02_3218aw

I chose the NJ Transit ticket vending machines, because I have to deal with these regularly and I always take the experience for granted.  Norman’s “Design of Everyday Things” (a reading for class) heightened my awareness of both aesthetics and functionality of objects designed primarily for utility.

Orange and blue are opposite on the color wheel, and thus complimentary, so the orange around the touch-screen is certainly eye-catching and serves its purpose (not a fan of orange though).  I’m not crazy about the fine print travel details at eye level – I’ve never seen anyone referring to it but I’m all for disclosure so it should be displayed somewhere, maybe vertically down the side, if the unit were wider, like bullet points?.  The red LED screen message at the top is an eye-sore and “the way to go” as a slogan is just so typical, so lame.  This screen area is presumably to indicate whether a machine is out of service or to note delays but it’s too high up to be practical – it should be right above the screen instead and only light up if it has something useful to convey.  The placements of the bill-taker, credit card swiper and ticket-receiving areas are awkward and don’t line up with anything – more thought should have gone into the aesthetics of this.

I took photos of each screen as I went through the process of buying a round-trip ticket.  See the captions below each photo for comments.

There is space on the screen, below the button, to describe what "special promotions" are or they could be listed without a button.

There is space on the screen, below the button, to describe what "special promotions" are or they could be listed without a button.

There is space on the screen to identify "off-peak" hours - not obvious.  Also 10-trip, weekly and monthly should be grouped and colored differently. "Other Rail Destinations and Tickets" is confusing and why is it in the same color as "Espanol"?

There is space on the screen to identify "off-peak" hours - not obvious. Also 10-trip, weekly and monthly should be grouped and colored differently. "Other Rail Destinations and Tickets" is confusing and why is it in the same color as "Espanol"?

I like the inclusion of the disabled icons but in reality the trains are a pain to board if you are disabled.  My station isn't on here so this screen annoys me, although I understand the convenience of listing the most popular destinations.  They are not in alphabetical order though, so that is confusing!

I like the inclusion of the disabled icons but in reality the trains are a pain to board if you are disabled. My station isn't on here so this screen annoys me, although I understand the convenience of listing the most popular destinations. They are not in alphabetical order though, so that is confusing!

There is plenty of space on the buttons to list the letters that are grouped - why make people think?  I'd prefer an alphabetical listing of all stations that scrolls, like on an iPhone.  Or an NJT rail map could be utilized, which would be more visually interesting and also geographically educational.

There is plenty of space on the buttons to list the letters that are grouped - why make people think? I'd prefer an alphabetical listing of all stations that scrolls, like on an iPhone. Or an NJT rail map could be utilized, which would be more visually interesting and also geographically educational.

It's sad to see how few trains are handicapped-accessible.  The left to right eye movement of the alphabetical listing is annoying - again, I'd prefer a vertical scroll with all stations.

It's sad to see how few trains are handicapped-accessible. The left to right eye movement of the alphabetical listing is annoying - again, I'd prefer a vertical scroll with all stations.

The origin and destination stations should be much more visually obvious - perhaps in bold and bright blue or dark orange to match their color scheme.   The $ amount should also be in bold.

The origin and destination stations should be much more visually obvious - perhaps in bold and bright blue or dark orange to match their color scheme. The $ amount should also be in bold.

Rather than an image of a hand, why aren't they showing the correct orientation of the credit card?  That's the number one thing that people screw up when trying to pay by card.

Rather than an image of a hand, why aren't they showing the correct orientation of the credit card? That's the number one thing that people screw up when trying to pay by card.

YAWN!  It would be nice if this screen could include a nice fortune-cookie-like message for the day or some random animated character doing something silly.

YAWN! It would be nice if this screen could include a nice fortune-cookie-like message for the day or some random animated character doing something silly.

Again, a more interesting visual would be nice - perhaps an elf-like animated character in a ticket-printing factory.

Again, a more interesting visual would be nice - perhaps an elf-like animated character in a ticket-printing factory.

A down-pointing arrow would be helpful - I've noticed tourists looking around for a second before finding the tray.  Also, why does the photo on screen not show a ticket or receipt waiting for a person?  I think the ticket window should be rigged with blinking LEDs (only partly kidding).

A down-pointing arrow would be helpful - I've noticed tourists looking around for a second before finding the tray. Also, why does the photo on screen not show a ticket or receipt waiting for a person? I think the ticket window should be rigged with blinking LEDs (only partly kidding).

A super quick “thank-you!” screen message, or a smiley face (goes with the color scheme so why not?) would be nice to see at the very end, before running off to catch a train.  Adding some fun images and/or sounds during any waiting period should be easy enough.  The mundane experience of buying a ticket could use a shot of creativity and inspiration.  NJT should make all efforts to keep commuters in a good mood, to help offset the daily grind of commuting with all the waiting, scrambling to get a seat, navigating people traffic, etc.  I could use a laugh or even a mild smirk at the beginning and end of my day.

For this lab (see instructions here), I used my toy from previous assignments, since it still had the force sensitive sensor in it.  I followed the instructions and saw the sensor values reflected in the purple graph.  I then tweaked the Processing code to create a vertically-oriented “third-eye” to go conceptually with the placement of the sensor in the toy.  I created an ellipse within the “serialEvent” function that was filled with random R, G, B colors within a yellow-orange-green range (to match the toy) and then set the width of the ellipse to the “inByte” value from the sensor, and the height to “height-inByte.”  Watch the results in this video:

Pcomp Week 6 Lab: Serial Output from N Z on Vimeo.

READING:  Emotion & Design: Attractive things work better

I can understand how someone would choose an object or device based on how his/her mood matches the design (the author’s teapot example for instance), but how many people have that luxury?  I think functionality or usability trumps design as a general priority, but I do also understand that people are emotionally or instictively drawn to more pleasing designs and are thus more apt to utilize something if the aesthetics appeal to them.

In thinking about his example of the color monitor versus the black and white one, I asked myself whether our emotional reaction to color is based on a desire for real-world approximations or whether it’s that color is just more pleasing to the eye and offers more possibilities. I wonder exactly what region of the brain is activated by this thought process.

I think that his breakdown of “negative affect” versus “positive affect” was rather simplistic and I don’t feel that he gave very strong examples.  The door and plank scenarious are obvious and illustrate the fear aspect.  The Isen experiment with gift-giving was interesting but too little information was given on that for it to be very helpful.

I agree with this statement: “to be truly beautiful, wondrous, and pleasurable, the product has to fulfill a useful function, work well, and be usable and understandable” athough it ironically seems to contridict his opening statements which say “design matters.” Pleasurable design is subjective and could vary dramatically in different cultural and other such contexts. Aren’t there disputes between designers and usability experts?  How are these resolved?  I suppose the safest way to resolve conflicts or get reliable feedback is to test both the design and the utility of products or devices in diverse focus groups.

Imagine a smart baby who wants to let its parents know what it wants.  If it pulls down on the right hand of the toy, then the rattle moves, which could say “hey, I want music” or “I want to get out of my crib and move around.”  If it is hungry, wants to be held, or wants love and inspiration, it will press the “third eye” of the toy, which makes a plastic nipple glow in random colors – kind of like a crystal ball.  Here’s the video of it all in action.

Untitled from Nisma Z on Vimeo.

Clearly I modified my Stupid Pet Trick this week based on what outputs I had to work with and what code I knew how to do at this stage.  The rattle is attached to a servo motor, which I used for this week’s lab, and in Arduino, I mapped the values of the flex sensor when the hand moves towards the foot in the toy to the full range (0 to 179) on the servo motor.  The “third eye” has a force sensor, which when pressed lights up an RGB LED.  In the code, with the help of resident Matt with glasses, I assigned random values to each red, green and blue pin and then faded these in and out while the sensor is pressed.  When pressure is released from the sensor, the RGB LED turns off.

Here’s a photo of my servo/analog lab:

NZ_IPC_Wk4lab1_3176

And here’s a photo of my tone output lab.  That little speaker is just WAY TOO QUIET.

NZ_IPC_Wk4lab2_3185

READING: Design Meets Disability.

The author’s argument matches the spirit of ITP  – injecting playfulness into problem solving and focusing on simple, elegant product designs along with technology that doesn’t try to do too much. “Bring delight back into everyday products.”   He heralded the simplicity of “appliances” and pared-down devices like the iPod shuffle.  I wonder though if simple, elegant design can be effectively combined with multi-modal devices and multi-functional platforms – didn’t the iPhone achieve that?

I agree with the idea that design for the disabled should not be about “discretion” because it adds to the stigma.  (I remember the negative impact of having to wear those ugly pink plastic glasses at the age of eight – this definitely contributed to a low self-esteem.  If only I could have had cool, customized glasses that I felt happy to wear! Sadly, eyewear design didn’t enter the mainstream market until more than a decade later.)  The author also argues against universal design in favor of customization, which I agree with.

Regarding bodywear or legwear, I remember being so moved when I watched the TEDTalks video on my iPod featuring Aimee Mullins with her sculptured, prosthetic legs – this example is mentioned in the reading.  I love the idea of devices or prosthetics for the disabled being works of art that encourage people to think differently about “disability.” This paradigm shift could be especially transformational in countries like Japan, where treatment of the disabled has been particularly problematic (I remember a NY Times article awhile back that I can’t find now but here’s a link on the rights of the disabled in Japan.)