Heuristics A Brief Overview and Applications Eiyana Favers Jessamyn McBrian IDIA 612 Summer 2011.

Heuristics A Brief Overview and Applications

Eiyana FaversJessamyn McBrianIDIA 612Summer 2011

Heuristics - Definition• According to the Psychology Dictionary at About.com,

heuristic is defined as: – A mental shortcut that allows people to solve problems and make

judgments quickly and efficiently. – Shortens decision-making time and allows people to function without

constantly stopping to think about the next course of action.

• And according to the Free Dictionary, the Computer Science definition of the term is:

heu·ris·tic (hy-rstk)adj.– 3. Computer Science Relating to or using a problem-solving technique

in which the most appropriate solution of several found by alternative methods is selected at successive stages of a program for use in the next step of the program.

Budd, Andy. Heuristics for Modern Web Application Development.

Heuristics – Definition (continued)1. Way to evaluate a user interface [criteria]

– look at the interface and pass judgment about what is good and bad about that interface according to one’s own opinion

2. Evaluates usability– Aspects of system design that influence a user’s participation in

information-handling tasks

• Smith & Mosier (1986)

Smith, Sydney and Jane N. Mosier. “Guidelines for Designing User Interface Software.” Mass.: The MITRE Corporation, 1986. <http://www.userlab.com/Downloads/Smith_Mosier_guideline_.pdf>

Nielsen, Jakob and Rolf Molich. “Heuristic Evaluation of User Interfaces.”CHI 1990. http://www.cs.panam.edu

Types of Heuristics1. Standards-based:

1. Example: Accessibility Guidelines (usability.org)• Valid by definition• Based on official rules for Web design

2. Theory-based: 1. Example: Cognitive Engineering Principles by Gerhardt-Powals

• Adapted from general, well known, and accepted theories• Multidisciplinary

3. Research-based: 1. Example: Nielsen

• Tested (usability)• Results translated into set of heuristics

4. Practitioners’1. Example: Many people in this class

• Not supported by standards• Based on professional Web designers’ experienceDe Jong, Menno and Thea Van Der Geest. “Characterizing Web Heuristics.” Technical Communication (2000) 311-326.

Heuristics Sets: ExamplesUsed By: oclc.org (based on Nielsen’s 10)

1. Visibility of system statusThe system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

2. Match between system and the real worldThe system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

3. User control and freedomUsers often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

4. Consistency and standardsUsers should not have to wonder whether different words, situations, or actions mean the same thing. Follow uniform and/or platform conventions.

5. Error prevention Even better than good error messages is a careful design that prevents a problem from occurring in the first place.

6. Recognition rather than recallMake objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

7. Flexibility and efficiency of useAccelerators—unseen by the novice user—may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Heuristics Sets: ExamplesUsed By: oclc.org (based on Nielsen’s 10)

8. Aesthetic and minimalist designDialogues should not contain information that is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

9. Help users recognize, diagnose, and recover from errorsError messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

10. Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.

11. AffordancesDoes the user understand what the text/graphic will do before they activate it?

12. Use chunkingWrite material so that documents are short and contain exactly one topic. Do not force the user to access multiple documents to complete a single thought.

13. Provide progressive levels of detailOrganize information hierarchically, with more general information appearing before more specific detail. Encourage the user to delve as deeply as needed, but to stop whenever sufficient information has been received.

14. Don't lie to the userEliminate erroneous or misleading links. Do not refer to missing information.Online Computer Library Center (OCLC) is a nonprofit, membership, computer library service and research organization

dedicated to the public purposes of furthering access to the world’s information and reducing information costs. More than 72,000 libraries in 170 countries and territories around the world have used OCLC services to locate, acquire, catalog, lend and preserve library materials.

Heuristics Sets: ExamplesJill Gerhardt-Powals

1. Automate unwanted workload.2. Eliminate mental calculations, estimations, comparisons, and any unnecessary thinking, to free cognitive resources for

high-level tasks.Reduce uncertainty.Display data in a manner that is clear and obvious to reduce decision time and error.

3. Fuse data.Bring together lower level data into a higher level summation to reduce cognitive load.

4. Present new information with meaningful aids to interpretation.New information should be presented within familiar frameworks (e.g., schemas, metaphors, everyday terms) so that information is easier to absorb.

5. Use names that are conceptually related to function.Display names and labels should be context-dependent, which will improve recall and recognition.

6. Group data in consistently, meaningful ways.Within a screen, data should be logically grouped; across screens, it should be consistently grouped. This will decrease information search time.

7. Limit data driven tasks.Use color and graphics, for example, to reduce the time spent assimilating raw data.

8. Include in the displays only that information needed by the operator at a given time.Exclude extraneous information that is not relevant to current tasks so that the user can focus attention on critical data.

9. Provide multiple coding of data.The system should provide data in varying formats and/or levels of detail in order to promote cognitive flexibility and satisfy user preferences.

10. Practice judicious redundancy.Devised to resolve the possible conflict between Principles 6 and 8, that is, in order to be consistent, it is sometimes necessary to include more information than may be needed at a given time.Gerhardt-Powals, Jill. “Cognitive Engineering Principles for Enhancing Human-Computer Performance.” International

Journal of Human-Computer Interaction 8:2 (1996): 189-211.

Heuristics Sets: ExamplesAndy Budd

1. Design for User Expectations2. Clarity3. Minimize Unnecessary Complexity and Cognitive Load4. Efficiency and Task Completion5. Provide Users With Context6. Consistency and Standards7. Prevent Errors8. Help Users Notice, Understand and Recover From

Errors9. Promote a Pleasurable and Positive User Experience

Budd, Andy. Heuristics for Modern Web Application Development.

Heuristics Evaluate User InterfacesFlawed Interfaces Can:

• Adversely affect a user’s ability to successfully complete a task

• Prevent a user from being able to successfully complete a task

• Adversely effect the time it takes to complete a task• Decrease or eliminate memorability/learnability• Create anxiety• Prevent return visits

Heuristics Evaluate User InterfacesSuccessful User Interfaces Can:

• Create user satisfaction• Enable task completion for novice to expert users as well as

those with disabilities• Decrease or eliminate anxiety• Increase memorability/learnability

Selected Heuristics• Minimize Unnecessary Complexity and Cognitive Load (Budd)

• Efficiency and Task Completion (Budd)

• Promote a Pleasurable and Positive User Experience (Budd)

• Consistency and standardsUsers should not have to wonder whether different words, situations, or actions mean the same thing. Follow uniform and/or platform conventions. (oclc.org/Nielsen; Schneiderman; Gerhardt-Powals)

• AffordancesDoes the user understand what the text/graphic will do before they activate it? (Gerhardt-Powals; Schneiderman; Krug)

• Error prevention Even better than good error messages is a careful design that prevents a problem from occurring in the first place. registration (Nielsen; Schneiderman)

1. Minimize Unnecessary Complexity and Cognitive Load

• Make the system as simple as possible for users to accomplish their tasks, but no simpler. Do not overload the user with too many unnecessary choices, and make sure those choices are prioritized.

• Remove unnecessary functionality, process steps and visual clutter

• Use progressive disclosure to hide advanced features• Break down complicated processes into multiple steps• Prioritize using size, shape, color, alignment and proximity

Budd, Andy. Heuristics for Modern Web Application Development.

Minimizing Complexity - Example

The “open window” / “closed window” feature in the main portion of this page, while creative design, is a perfect example of unnecessary functionality. It is difficult for users to navigate through the main section without opening this box, and then once open, difficult to know how to close.

This text reads, “View All Programs”

This is the result of hovering over the section

from shot #1.

Efficiency and Task Completion• Design for user productivity, not the system’s. Optimize the system

for the most common tasks. Provide experienced users with advanced features that speed up task completion. Use the most common defaults and honour user preferences and previous selections. However, allow them to be easily overridden when necessary.

• Provide quick links to common features/functions• Provide advances features like the ability to delete multiple

messages• Pre-check common options, like opt-out of marketing emails• Allow defaults to be changes, cancelled or overridden• Remove unnecessary steps.

Budd, Andy. Heuristics for Modern Web Application Development.

Efficiency and Task Completion - Example

Yahoo! Mail does a great job of providing the user the option to delete and prioritize incoming messages. The user also has fast access to common features and functions, and the user is not subjected to defaults.

Promote a Pleasurable and Positive User Experience

• The user’s interaction with the system should be positive and where possible enhance their quality of life. The user should be treated with respect and their preferences and wishes honored. The design should be aesthetically pleasing and promote a pleasurable and rewarding experience.

• Create a pleasurable and attractive design• Provide easily attainable goals• Provide rewards for usages and progression

Budd, Andy. Heuristics for Modern Web Application Development.

Positive User Experience - Example

• Attractive design, not too cluttered, but it can be a bit busy.• The rewards for usage and progression are recommendations for the next visit and offers for free items like MP3s and Kindle books. • The user can accomplish his or her goals easily on the site:

• The search feature is easy to locate, and the search can be broken up into many categories.

Consistency

• Figures in to most sets of heuristics– Schneiderman’s (2010) Eight Golden Rules for Interface Design

• Strive for Consistency– Be consistent in color use, layout, fonts, capitalization– Consistency helps meet user expectations

– Nielsen’s Ten (www.useit.com)• Consistency and Standards

– Words, situations, actions should mean the same thing– Prevents user confusion

– Gerhardt-Powals (1996)• Eliminate Mental Calculations

– Consistency reduces decision time and error

Schneiderman, Ben and Catherine Plaisant. Designing the User Interface. Boston: Pearson Higher Education, 2010.Gerhardt-Powals, Jill. “Cognitive Engineering Principles for Enhancing Human-Computer Performance.” International Journal of Human-Computer Interaction 8(2) 189-211 (1996)(2000) 311-326

Consistency - Example

On healthcoach4me.com, link destinations include both HTML pages and PDFs. While the use of PDFs is arguably another usability issue, user expectations are violated by mixed-use. In addition, the right side bar refers to these links as “tools.” “Tools” generally refer to widgets and are often depicted with image links – in addition, each of these four pages refer to the links as “titles,” “information,” “facts,” and “resources,” respectively (starting from top left, clockwise). This kind of inconsistency can create confusion. On the other hand, each of these pages are consistently laid out.

AffordancesDoes the user understand what the text/graphic will do before they activate it?

“It doesn’t matter how many times I have to click, as long as each click is a mindless, unambiguous choice.”

-Krug’s Second Law of Usability (2006)

• Can also be understood in terms of accessibility– Schneiderman’s (2010) Eight Golden Rules for Interface Design

• Cater to Universal Usability– Recognize the needs of diverse users. For example, provide alt text.

Krug, Steven. Don’t Make Me Think! A Common Sense Approach to Web Usability. California: New Riders, 2006.Online Computer Library Center <http://www.oclc.org/usability/heuristic/set.htm>Schneiderman, Ben and Catherine Plaisant. Designing the User Interface. Boston: Pearson Higher Education, 2010.

Affordances - Example

On healthcoach4me.com, alt text is not consistently provided. In fact, it is consistently ignored – this is most notable and possibly most problematic on the home page, where main site links to videos that help the user understand the site lack identifying alternative text, hence preventing the extraordinary user from understanding that clicking the link will launch a video.

Error Prevention

• Figures in to most sets of heuristics– Schneiderman’s (2010) Eight Golden Rules for Interface Design

• Prevent Errors– Design the system to prevent the user from making serious errors

» Do not allow alpha characters in numeric fields» Offer constructive feedback» If an error is made, leave the system state unchanged

– Nielsen’s Ten (www.useit.com)• Error Prevention

– Prevent problems from occurring in the first place– Provide good error messages

Schneiderman, Ben and Catherine Plaisant. Designing the User Interface. Boston: Pearson Higher Education, 2010.

Error Prevention - Example

Registration on healthcoach4me.com is a mixed bag – some good error prevention methods are employed while others are lacking entirely on the same registration page.

Questions?

BibliographyBudd, Andy. “Heuristics for Modern Web Application Development.” January 17, 2007.

<http://www.andybudd.com>De Jong, Menno and Thea Van Der Geest. “Characterizing Web Heuristics.” Technical Communication (2000)

311-326.Gerhardt-Powals, Jill. “Cognitive Engineering Principles for Enhancing Human-Computer Performance.”

International Journal of Human-Computer Interaction 8:2 (1996): 189-211.Krug, Steven. Don’t Make Me Think! A Common Sense Approach to Web Usability. California: New Riders,

2006.Nielsen, Jakob and Rolf Molich. “Heuristic Evaluation of User Interfaces.” CHI (1990).

http://www.cs.panam.edu Online Computer Library Center <http://www.oclc.org/usability/heuristic/set.htm>Schneiderman, Ben and Catherine Plaisant. Designing the User Interface. Boston: Pearson Higher Education,

2010.Smith, Sydney and Jane N. Mosier. “Guidelines for Designing User Interface Software.” Mass.: The MITRE

Corporation, 1986. <http://www.userlab.com/Downloads/Smith_Mosier_guideline_.pdf>