Principles of Interaction Design
Five Key Principles from my lynda.com Fundamentals of Interaction Design:
These principles form a system that involves learning and transfer of skill.
Adapted from First Principles of Interaction Design (HTML) by Bruce Tognazzini:
Be smart. Give people what they need, when they need it. Do not make people work for what should be present. Bring information and functionality to the person when they need it.
Give people a sense of ownership, control, and direction. Do not make them feel subjected to the whims and decisions of processes beyond their control.
3. Color Blindness
Always use multiple cues (e.g., color, shape, size, location) to convey information. Do not rely on people being able to accurately discern and understand information distinguished by a single cue (e.g., red-green color blindness.)
Strive for consistency in appearance and behavior. Make objects that function similarly look similar. Make objects that function differently look different. Make objects appear consistent with their behavior (e.g., buttons look "pressable.")
Defaults should be intelligent, logical, meaningful, and easy to override.
6. Efficiency of the User
Focus on the efficiency of the person not the computer. Makes tasks easy for people by making the computer do the work. Keep people focused and productive while the computer is working (e.g., complete tasks in the background while people continue to work.)
7. Explorable Interfaces
Give people a sense of place, help them identify the paths or flows through a site or application, make it easy to go back or undo, and always provide a way out, but make it easier to stay in.
8. Fitt's Law / Meyer's Law
it is easier to interact with objects that are larger and nearer, so make important things either larger and closer to the person's current location or utilize the edges of an interface as natural boundaries.
9. Human Interface Objects
Human interface objects can be perceived (e.g., seen or heard), have a standard form of interaction, have a standard outcomes and behaviors, and are consistent and understandable. Common icons in graphical interfaces communicate their actions, behave consistently, and are familiar and recognizable (e.g., folders and trashcans), but not all digital objects need to correspond to actual physical objects (e.g., browser refresh icon or a drawing programs color picker.)
10. Latency Reduction
Do not make people wait. Perform as many actions as possible in the background. Provide feedback to all of a person's actions. When people must wait, provide status and progress feedback.
Ideally, there should be no learning curve. Realistically, performance improves with experience and practice. Make the interface easy and enjoyable to learn quickly, but do not make it feel like it is teaching and the person is learning. Take advantage of our innate curiosity and interest in exploration and play.
12. Use of Metaphors
Metaphors help people quickly grasp the details of a product and interaction, they tell a story, and they help people understand something new in the context of what they already know. Metaphors appeal to people's senses and evoke a sense of the familiar.
13. Protect People's Work
Ensure that people never lose their work. Do not force people to duplicate or repeat their efforts.
Make all text easy to read. Fonts should have sufficient contrast and size and should not be placed over complex patterns or textures. Make headers, subheaders, body text, and labels visually distinct.
15. Track State
Remember and acknowledge if people have been to the site or used the application before. Allow people to stop, start, and continue their sessions easily. Remember where people are and what they are doing. Remember where people were and what they have done.
16. Visible Navigation
Avoid invisible navigation and interactions. Provide cues to the availability of interactions. Do not make people search for opportunities to interact. People should only play "Scavenger Hunt" if they are playing the game, not when using your site or application. Keep navigation clear, meaningful, and available.