Interaction Design April 21, 2009
Posted by kd49 in : Class 11 - Interaction Design, Classes , comments closed Second half of discussion on using the grid. The following PDF describes the application of the grid to the web design process (this was created by Khoi Vinh, the Design Director at the NY Times Online and Mark Boulton.A nice infographic from last week:
Review of website design project
Interaction Design
We are surrounded by interactive design from alarm clocks, to street signs, to ATMs and voicemail. Voicemail is a particularly egregious examples of bad interaction design. Why do we have to listen to instructions on how to leave a message every time we make a phone call? Why do we have to learn how to fasten a seat belt every time we get on airplane?
Good interaction or interface design should be intuitive and not require instruction. Think NY taxis: consistent, intuitive and logical. [ppt]
Good examples of Interaction design:
- The walk signs in Mexico
- Parking meters (good model for video and audio files that time left is a more valuable metric than time spent watching (which requires thinking)
Bad examples
Principles of Good design
- Consistency Consistency Consistency in placement, behavior, color and labeling.
- NYC Taxis
- Be intuitive for the user
- Set standards and stick to them: keep search and other buttons in the same location on every screen
- As in information graphics, avoid visual clutter
- Yahoo establishes icons on the HP and then they disappear. Why use icons?
- Word your messages and labels effectively. Tell it like it is. A link to Job listing should say JOBS, not EMPLOYMENT OPPORTUNITIES or CAREER
- Provide indicators of where you are: You are here! Let users know where they are and where they need to go.
- Size, color and placement will suggest a hierarchy. Users don’t read, they scan
- Items that are logically connected should be grouped together: things to buy, things to read, things to play with
- Follow standards for search, checkout, home button, red = stop, green = go.
- Keep it simple mapquest vs google maps
- Allow for error recovery, assume users will make mistakes. Have error message align with the errors. back is the most frequently used navigation button.
Some interesting interfaces:
- zoomi.com
- real memories
- Johnson Bank
- Click bored
- mult-touch interface design (video)
- bumptop desktop (video)
- Save the Words
- Tour of Rio
- Tufte’s analyis of the iphone
______
ASSIGNMENT
Finalize your portfolio website design