Links on Interaction Design

The Space of Design

Models of the process of design are relatively common. Each describes a sequence of steps required to design something—or at least the steps that designers report or recommend taking. Models of the process of design are common because designers often need to explain what they do (or want to do) so that clients, colleagues, and students can understand.

Less common are models of the domain of design—models describing the scope or nature of practice, research, or teaching. Such models may be useful for locating individual processes, projects, or approaches and comparing them to others. Such models also help clients, colleagues, and students understand alternatives and agree on where they are (or want to be) within a space of possibilities.

Typically models of a domain are of three types:

  1. Timelines
    • Lists of events from the domain’s history
    • Links between events suggesting influences
  2. Taxonomies
    • Lists of sub-domains
    • Trees branching into categories and sub-categories and so on
  3. Spaces
    • Venn diagrams indicating overlapping categories
    • Matrices defining the dimensions of a space of possibilities or area of potential

The Space of Design

IDEO Labs

IDEO Labs is a place where we IDEO show bits of what they are working on, talk about prototyping, and share their excitement over the tools that help them create.

IDEO Labs

A Quiz Designed to Give You Fitts

So you think you are an interaction designer? Not if you cannot answer all the following questions quickly and with authority.

If you’re not an interaction designer, but you know one—or you are thinking of hiring one—slip them just the questions, and see how well they do. Bruce Tognazzini used variations of this quiz for years during the interview process to good effect.

These questions and answers assume that you have total control over all screen real estate, the OS, etc. Just pretend you are chief designer for Microsoft or Apple…

A Quiz Designed to Give You Fitts

A huge list of Style Guides and UI Guidelines

If you are a graphic designer or an interaction designer and have ever been tasked with creating a style guide or UI guidelines document (both are different and I’ve had the pleasure to work on both of them creating templates and the actual documents for brands and products), this list should help you out as a consolidated list of references. This list is going to be constantly updated (and will ultimately be a monster list, it’s quite modest for now) of publicly accessible style guides and UI guideline documents on the web. If you find any links not working or would like to suggest one that is not on the list, feel free to comment and let me know.

  1. 3M
  2. ABB Brand Identity
  3. ACDSee Brand Style Guide
  4. Air Products Identity Standards
  5. Ameritech Graphical User Interface Standards and Design Guidelines (This one is from the Internet Archive)
  6. AMAIA Residence Brand Manual (PDF, 816 kb)
  7. Android User Interface Guidelines
  8. Apple Human Interface Guidelines
  9. Apple iOS Human Interface Guidelines
  10. Barbican Brand Guidelines for Print / Web / and Plasmas
  11. BBC Future Media Standards & Guidelines
  12. BBC Global Experience Language (GEL)
  13. Belfast Zoo Brand guidelines
  14. Blackberry and RIM wireless handheld UI Developers Guide (PDF, 1.3 mb)
  15. BlackBerry Branding Guidelines (PDF, 300 kb)
  16. Brick brand guidelines
  17. Cargill Identity Style Guide
  18. Cambridge University Brand Manual
  19. Cunard Brand Guidelines
  20. ELMER 2– User Interface Guidelines for Government Web Forms (PDF, 1.2 mb)
  21. Easy Group Brand Manual (PDF, 2 mb)
  22. Eclipse User Interface Guidelines
  23. Federal Identity Program (Canada)
  24. GOOD Technology Brand Identity Guide
  25. Gnome Human Interface Guidelines
  26. Heineken Brand Manual
  27. iPhone Human Interface Guidelines
  28. Java Look and Feel Design Guidelines
  29. KDE User Interface Guidelines
  30. Kew’s Brand Guidelines (PDF, 5 mb)
  31. Microsoft Inductive User Interface Guidelines
  32. Microsoft Surface User Experience Guidelines
  33. MITRE- Guidelines for designing user interface software
  34. NASA’s webstyle guide
  35. Novozymes’ brand guide
  36. The New School Visual Identity Manual (PDF, 6.5 mb)
  37. The New School Web Style Guide
  38. Nokia Design and User Experience Library
  39. Oracle Technology Network Guidelines
  40. Palm User Interface & Human Interface Guidelines
  41. RSA brand standards
  42. SAP Interaction Design Guide for Internet Application Components
  43. SAP Design Guild
  44. SAP User Interface guidelines
  45. Silicon Graphics Indigo Magic User Interface Guidelines
  46. Skype Brand Identity Guidelines
  47. Spelman College Visual Identity Guidelines (PDF, 1.3 mb)
  48. Reuters Brand Center
  49. Taligent Human Interface Guidelines
  50. WebEx brand style guide
  51. Web Style Guide 2nd edition
  52. Windows User Experience
  53. Windows User Experience Guidelines
  54. Windows User Experience Interaction Guidelines
  55. Windows XP Visual Guidelines (There’s a download section to the right to download WindowsXP DesignGuidelines)
  56. Yale Web Style Guide
  57. Yale’s Visual Identity

Visualizing Fitts’ Law

Published in 1954, Fitts’s Law is an effective method of modeling the relationship of a very specific, yet common situation in interface design. That situation involves a human-powered appendage at rest (whether it’s physical like your finger or virtual like a mouse cursor) and a target area that’s located somewhere else.

Visualizing Fitts’s Law

Ultimate guide to table UI patterns

For people who need tables in everyday work they are hated element that makes them scream. And it shouldn’t be this way. Here are some of the patterns that can help in creating less evil tables.

Ultimate guide to table UI patterns

Three more table UI patterns

A Wireframe kit for Google Drawings

Google Drawings is the latest addition to Google Docs. You can use it for wireframing with this stencil kit.

A Wireframe kit for Google Drawings

Social Software: The Other ‘Design for Social Impact’

Human-centered approaches to industrial and interaction design have long focused on studying human behavior to create informed and appropriate designs. A social interaction designer must consider not only people, environment, and existing tools, but also the unseen elements of the system such as social relationships, power dynamics, and cultural rules.

Social Software: The Other ‘Design for Social Impact’

In Defense of Lorem Ipsum

If you’re running a project where you mock up designs, get them approved, code them up, build a CMS, hook it all together, and then everyone looks around and says “Who’s got the content? Wait, this content doesn’t match the designs and it won’t fit in the CMS!” then you have a problem. A big problem.

Lorem Ipsum is not the cause of your problem. It’s a symptom. The real problem is an overall process that treats design and content as separate tracks without appropriate communication, collaboration, and checkpoints along the way.

In Defense of Lorem Ipsum

A Collection of Printable Sketch Templates and Sketch Books for Wireframing

This post provides a list of more than 20 resources that can be used in sketching phase of application development categorized as follows:

  • Printable sketch templates for websites
  • Printable sketch templates for mobile applications
  • Sketch Books
  • Make you own sketch templates

A Collection of Printable Sketch Templates and Sketch Books for Wireframing