Interaction Design & Heuristics of Usability
VISIBILITY OF SYSTEM STATUS
Example: Gmail Inbox
Description: The message from Gmail gives the user feedback as to what is happening. In this case Gmail is alerting the user that a conversation has been moved to the trash. The alert also gives them the option to undo if it was a mistake.
MATCH BETWEEN SYSTEM AND THE REAL WORLD
Description: Porsche uses phrases and icons that are clear in their meaning. They also use images of their vehicles, which helps the user to quickly recognize the model they may be looking for.
USER CONTROL AND FREEDOM
Description: Lynda.com’s Course History allows the user to review the courses they have taken and pick up where they left off if they could not finish a specific lesson.
CONSISTENCY AND STANDARDS
Description: Users are familiar with associating certain icons with actions. In this example Adobe uses a lock icon to cue the user to log in to their account. By using icons the users are familiar with it helps them complete their desired task.
Description: Behance makes the user confirm that they want to delete a project before completely deleting the entire project. This helps the users in the event that they made a mistake and gives them the option to correct the mistake.
RECOGNITION RATHER THAN RECALL
Description: Nordstrom.com presents the user with items that are frequently bought together helping the user to find other items that may go with an item they are all ready purchasing with out having to try and figure out the style they are trying to achieve.
FLEXIBILITY AND EFFICIENCY OF USE
Description: Lynda.com allows the user to make playlists so they can collect a series of videos or courses that they may want to learn.
AESTHETIC AND MINIMALIST DESIGN
Description: With a quick glance the user can recognize the search input field and understand what they need to do in order to search. The design approach is clean and simple with an ample amount of white space.
HELP USERS RECOGNIZE, DIAGNOSE, AND RECOVER FROM ERRORS
Example: Bank of America Log In / Error Message
Description: Bank of America helps the user by alerting them that there is an issue with the username or password. Then it tries to direct them to a solution by presenting an option to recover user name or password.
HELP AND DOCUMENTATION
Example: Google Material Design Documentation
Description: Google has provided a comprehensive document that shows how to use material design and apply the principles.