Friday, February 29, 2008

Neil Gaiman's The Nature of Free

Stack of books 2

Neil Gaiman recently blogged about what he calls, "The nature of free." In the post, he argues that free or low-cost books is how readers find new authors and make them popular. He writes:

During one of the interviews recently, a reporter said something like, "Of course, a real publisher wouldn't give away paper books," and I pointed out that 3,000 copies of The Hitchhiker's Guide to The Galaxy were given away by Douglas Adams' publisher, with a 'write in and get your free book' ad in Rolling Stone. They wanted copies of HHGTTG on campuses in the US, and they wanted people to read it and tell other people. Word of mouth is still the best tool for selling books.

More here.

Sunday, February 24, 2008

Information Management, Cognitive Science, and PowerPoint presentations

Stephen M. Kosslyn's Clear and to the Point

Annalee Newitz liveblogged the presentation of Stephen M. Kosslyn, author of Clear and to the Point: 8 Psychological Principles for Compelling PowerPoint Presentations, at the American Association for the Advancement of Science annual meeting in Boston. Kosslyn presented on his findings from Cognitive Science research into the optimal way to present visual information, especially in PowerPoint slides. The four principle are below:

The Goldilocks Rule refers to presenting the "just right" amount of data. Never include more information than your audience needs in a visual image. As an example, Kosslyn showed two graphs of real estate prices over time. One included ten different numbers, one for each year. The other included two numbers: a peak price, and the current price. For the purposes of a presentation about today's prices relative to peak price, those numbers were the only ones necessary.

The Rudolph Rule refers to simple ways you can make information stand out and guide your audience to important details -- the way Rudolph the reindeer's red nose stood out from the other reindeers' and led them. If you're presenting a piece of relevant data in a list, why not make the data of interest a different color from the list? Or circle it in red? "The human brain is a difference detector," Kosslyn noted. The eye is immediately drawn to any object that looks different in an image, whether that's due to color, size, or separation from a group. He showed us a pizza with one piece pulled out slightly, noting that our eyes would immediately go to the piece that was pulled out (which was true). Even small differences guide your audience to what's important.

The Rule of Four is a simple but powerful tool that grows out of the fact that the brain can generally hold only four pieces of visual information simultaneously. So don't ever present your audience with more than four things at once. This is a really important piece of information for people who tend to pack their PowerPoint slides with dense reams of data. Never give more than four pieces of information at once. It's not that people can't think beyond four ideas -- it's that when we take in the visual information on a slide we start to get overwhelmed when we reach four items.

The Birds of a Feather Rule is another good rule for how to organize information when you want to show things in groups. "We think of things in groups when they look similar or in proximity to each other," Kosslyn pointed out. Translation into PowerPoint? If you want to indicate to your audience that five things belong in a group, make them similar by giving them the same color or shape. Or group them very close together. This sounds basic, but it often means taking your data apart and reorganizing it. Kosslyn's co-panelist, Stanford psychologist Barbara Tversky, explained that one of the fundamental principles of data visualization is, ironically, misrepresentation in order to get at the truth.

Even these goofy names for each rule of PowerPoint follow a principle from cognitive science: it's always easier to remember an unfamiliar idea if it's named after something familiar.

Link to her post

Sunday, February 3, 2008

Interactive Design: A Case Study Part 3 of 3

MTA MetroCard

This post is part of a series exploring interactive design in an everyday object, the MetroCard Vending Machine. Please click below to read further:

Part 1
Part 2

It is important to note that a machine like the MVM is futile if the system surrounding it, such as turnstiles and the MetroCards themselves, is not user-centered. The automated fare collection equipment for buses were seriously delayed in the mid-nineties because of the need to redesign, retest, and retool them. The equipment need to be redesigned after usability testing was conducted a South Bronx bus line between October and January 1993.

The original design allowed the rider to swipe the card, similar to subway turnstiles, but the new model requires the rider to insert the MetroCard into a slot where it will be electronically read and expelled. Through usability testing, design flaws and reliability problems led to “fairly substantial design changes,” according to Charles J. Broshaus, Jr., senior vice preside for operations support at the San Diego-based Cubic Corporation, which made the fare boxes and turnstiles. The designers originally wanted the cards to be read like subway turnstiles, but the unique circumstances of bus travel made this design problematic. The limited space on a bus, the use of one fare collection box (as opposed to many subway turnstiles) and the finesse one needs to swipe correctly probably led to the redesign.

In June 1993, the MTA began a seven-week experiment to test MetroCards and the computerized turnstiles. Seven Manhattan stations were chosen and 3,000 participants of varying locations and riding frequencies were selected through applications.

MetroCards were created after input from focus groups and usability trials. An important requirement of the cards is that they never leave the hand of the owner, which is safe and useful, especially during rush hour.

Conducting ethnographic research, transit officials wanted to gather information on how riders entered the subway. The results of the test would be used to better prepare instructions on how to use the MetroCard when it would be officially introduced. An official remarked, “This is going to be the biggest change in the culture of the subways since World War II, when the system was unified. We think the technology is working just fine. But it may take riders some getting used to.” This employee realized the importance of designing a system that would be successful with user-centered design methods, usability testing, observation, and analysis.

Since the MetroCard conversion from tokens was one of the largest undertakings in the MTA’s history, transit officials wanted to make sure that the design of the system was user-centered. “It’s true that the faster you roll out a system, the quicker you'll get adoption. But given the starkness of the change, we felt that we should be prudent and make sure that it runs well,” stated an official. This is especially true because the New York State Comptroller’s Office issued a report in 1992 questioning the MetroCard’s durability and the turnstile’s accuracy.

During preliminary usability testing and when the cards were first introduced to the public, the technique of swiping the card through the electronic slots of the turnstile proved troubling. As a daily subway rider myself, I can attest to the trickiness of mastering the swipe. It cannot be too fast or too slow or the turnstile will give you a message to swipe it again. A rider compared it to “swinging your hand at a slow tennis ball coming your way.”

When MetroCards officially replaced tokens in January 1994, the transition was smooth due to proper planning by the MTA and months of usability testing which prepared the MTA to introduce the cards in a way that New York City’s 3 million daily riders would understand.

Saturday, February 2, 2008

Interactive Design: A Case Study Part 2 of 3

New York's MetroCard Vending Machine (MVM) detail
MetroCard Vending Machine Close-up

This post is part of a series exploring interactive design in an everyday object, the MetroCard Vending Machine. Please click below to read further:

Part 1
Part 3

The MVM interface uses large, high-contrast graphics and a clearly articulated sequence to make a cohesive experience for a diverse metropolitan public. The MVM conforms to many usability heuristics. Its interface presents a minimalist design that eliminates irrelevant information on the screen. For example, the main action appears on the middle of the screen while buttons on the bottom of the screen allow users to go back or proceed with the transaction, as well as a way to cancel. It is also flexible for beginner and advanced users, offering shortcuts for frequent actions. Throughout the transaction, there are consistent messages to the user.

It was important to make the interaction of the MVM work successfully with both the hardware and the interface design. The input and output interaction styles communicate useful and consistent messages to the user. For example, special promotions or messages can be can be uploaded to all the machines in the system. In addition, fault conditions, such as exhaustion of supplies or change will be reported on the animated display, as well as communicated to the departments responsible for their upkeep.

The user interface is a touch-sensitive display. Customers interact with the machine by pressing “buttons” displayed on the screen. Masamichi Udagawa and Sigi Moeslinger, the founders of Antenna Design, state, “The user doesn’t distinguish between hardware and software… People may not consciously realize that something’s successful, but what makes it successful is that you don’t notice it.” With this in mind, the concept behind input and output interaction styles is to have them disappear into the experience, so that the user is not aware he or she is using a machine. The action seems effortless.

The original design of the MVM in the early 1990s was unsatisfactory. When it was evaluated by eight focus groups of diverse participants, no one wanted to interact with it. “All the groups said the box was intimidating,” said Udagawa. “The layout of the front was incomprehensible, scary looking, and nobody wanted to touch it. Even after telling people to hit a certain button, they wouldn't proceed.” The original prototype looked like a refrigerator, and focus groups were confused with the MVM’s input and output modules. To improve this situation, colored ceramics were added to the machine to highlight each area’s function, which interact with the colors on the screen. (For instance, a green screen symbolizes cash, which means go to the green area of the machine to insert money). The effect was to make the MVMs “Coney Islandish,” portraying a sense of fun and brightness in the dark subway.

Additionally, when Udagawa was redesigning the project, he had to think about people’s mental models. He compared the experiences of a traditional vending machine to that of a store. Users preferred a store experience because they were able to find what they wanted first then pay for it. It made them uncomfortable to insert their money first.

When the machines were first introduced in 1999, users were first intimidated by the machines, saying that they looked too "complicated" and "hectic." As reported in the New York Times, an elderly woman who was unfamiliar with computers used the machine successfully and was sure she needed help from a transit worker only one more time before she would feel completely comfortable with it.

Friday, February 1, 2008

Interactive Design: A Case Study Part 1 of 3

New York's MetroCard Vending Machine (MVM)
MetroCard Vending Machine

This post is part of a series exploring interactive design in an everyday object, the MetroCard Vending Machine. Please click below to read further:

Part 2
Part 3

New York’s MetroCard Vending Machine (MVM), created by Antenna Design, was planned with the diverse needs of millions of daily transportation users in mind. The first vending machine that is compliant with the Americans with Disabilities Act, it allows access to users who are blind, deaf, short, or wheelchair bound. Additionally, the MVM can present up to six languages from a library of seventeen; the languages are dependant on the ethnic groups in the neighborhood. For instance, Chinese is an option in Manhattan’s Chinatown and Polish is available in Greenpoint, Brooklyn.

The design of the MVM must be flexible to adjust to fare changes with minimum or no reprogramming and to have its use extended to all New York rail systems, including the Long Island and Metronorth railroads, in addition to Westchester County bus systems, which require a different type of MetroCard. Additionally, its sturdy design protects against theft or vandalism, with a stainless steel and ceramic body with is hard to scratch and easy to clean. Its modules are also color coded in primary colors, which makes it look like an arcade game.

The following is a sample transaction demonstrating how an MVM works. Each number represents a different screen with the options available in parenthesis. Bracketed items are MVM feedback.

1. Touch start to begin
2. Which language? (English, Espanol, Italiano, Deutsch)
3. Please select MetroCard type (Fast Metrocard $20, MetroCard, SingleRide)
4. [You have selected MetroCard]
Please select transaction (Add Value to your card, Get New card, Trade in cards)
5. [You have selected New MetroCard]
What amount do you want? ($4.00, $8.00, $20.00, $40.00, $80.00, more options)
6. [New MetroCard]
[You have selected $8.00]
How do you want to pay? (Cash, ATM card, Credit card)
7. [New MetroCard, $8.00]
[Green arrow points to money slot]
Please pay $8.00
8. [You now have a $8.00 MetroCard]
[Orange arrow points to MetroCard slot]
Please take MetroCard
9. Do you want a receipt? (Yes, No)
10. [Red arrow points to receipt slot]
Take your receipt
11. Thank you

The MVM was designed to offer maximum efficiency despite its separate technologies. For example, there are two dispensers because MetroCards are plastic and SingleRide cards are paper. There are also two keyboards: a physical one for ATM PINs and a virtual one for selecting the amount of money to put on the MetroCard. Ideally, there should be a single dispenser and a keyboard; however, some redundancy was unavoidable.

Although the external design of the MVM is commendable, the user interface is a hierarchical menu of mutually exclusive choices, which some users find difficult to use. Each module of the MVM’s user interface is a distinct color to make it intuitive as to which module does what, but many users still have to guess what the machine wants them to do next. Color-coded arrows point to where the next transaction happens. For instance, when the machine wants you to insert money, a green arrow points to the money slot. Since there is no easy way of lowering the number of interactions needed to get a MetroCard, the modules could have been arranged sequentially. A MVM consists of a screen, a scrolling display, an ATM PIN keyboard, and separate slots for MetroCards, credit/ATM cards, dollar bills, coins, and receipts, all of which can be overwhelming to the user.

To use the machine, the user has to touch a start button on the screen. For many users, this is a gratuitous step. However, for the uninitiated, touching the Start button is natural mapping, guiding the user away from the physical buttons and focuses their attention on the screen.

The second step is to select a language. Many New Yorkers believe English should be the default. However, since different neighborhoods have different language selections, English may not be the predominant language of the area. Alternatively, the language choice could have been integrated into the Start step by showing “Start” in different languages. This would create six Start buttons on the first screen, which could easily more problematic than a step for language selection. Although there is no easy answer, the text needed for a transaction is so limited that an experienced user could probably purchase a MetroCard in an unfamiliar language.

The user interface would most benefit from being more error proof. Each screen has a white “Go Back” and a red “Cancel” button on the bottom of the screen. However, there are times in which Cancel brings the user back to the Start screen. This is not helpful because in most cases, the user still wants to buy a card, but chose something that canceled it instead. For example, if a user wants to refill a card, which has been damaged, the screen returns to the Start screen rather than another, more helpful screen in the hierarchy.

A goal of user-centered design is to determine the right visual priority of the various functions offered by a particular interface. Obviously, not every button can be presented with the same degree of prominence and it is always hard to decide which functions should be front and center and which can be relegated to a less obvious placement. The MVMs make it easy to add fixed denominations to the card, but the “other amounts” button is easily missed by frequent users whose regular, ingrained interaction routine does not include this function. In other words, it is a function that a user would not notice unless he needed it.

From browsing several New York-centric sites and talking to people who use the MetroCard daily, the problem lies in offering faster service for everyday riders. They would probably prefer a more shallow hierarchy of options. For instance, when they want to refill a card, they could simply place the card in the slot, and the machine would assume a work flow based on reading the card and giving the user appropriate choices. The MVM was designed for all users—life-long New Yorkers, new immigrants, tourists—so the hierarchy is mutually exclusive choices is the best design choice.