COAP:COAP-3150 - week 6

COAP 3150

COAP:COAP-3150

COAP:COAP-3150 - week 1

COAP:COAP-3150 - week 2

COAP:COAP-3150 - week 3

COAP:COAP-3150 - week 4

COAP:COAP-3150 - week 5

COAP:COAP-3150 - week 6

Design processes and models

Typography

Web design principles

Interaction styles

These 4 styles of interacting with web/computer-based interfaces are derived from the field of Human-computer interaction (HCI). They will enable you describe and justify the modes of interaction you will include in your site. See detailed descriptions, examples (screen shots) and advantages and disadvantages at HCI interaction styles - based on Shneiderman.

• Command language (or command entry) - e.g. unix commands, for repeated and expert use
• Form fill-in - e.g. search forms, for high guidance of formalized information
• Menu selection - e.g. navigation, for restricted choices
• Direct manipulation - e.g. software palettes, icon buttons, drag and drop, for reducing memory load of complex tasks, heavily based on graphic representations

Usability testing

Heuristics and quick tests

The 5 second rule

Upon landing on a homepage a user should be able to figure out in 5 seconds - The 5 second rule

• What is it about? - what is the site's objective as you understand it?
• Do I care? - does it appear to be capable of helping you reach your objective?
• Is it trustworthy? - do you feel that this site is 'authoritative' in its domain and in helping you achieve your goals?
• How do I participate? - what can you do on this site? does it allow you to interact, access information based on your needs?
• Is it newsworthy? - would you recommend this site, or talk about it to someone else with similar interests?

Ten Usability Heuristics by Jakob Nielsen

Reduced to five in Usability 101.

• Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
• Efficiency: Once users have learned the design, how quickly can they perform tasks?
• Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?
• Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
• Satisfaction: How pleasant is it to use the design?

Borrowing from Davis' Technology acceptance model, Nielsen defines useful web design as

• Utility = whether it provides the features you need.
• Usability = how easy & pleasant these features are to use.
• Useful = usability + utility.

Ergonomic criteria for evaluating interfaces and interactions

Bastien and Scapin (1997)(see also , through studies conducted, showed usability to be based on criteria that place significantly les importance on a systems information efficiency than Nielsen. Their criteria for ergonomics of interfaces focus strictly on the system's usability (manageability):

• Guidance: incite, orient user, group information (proximity, repetition), immediate feedback, legibility
• User workload: diminish cognitive effort for user, be brief, minimal actions, reduce information density
• User explicit control: allow users explicit control of their actions
• Adaptability: flexible, environment adjusts to accommodate user preferences
• Error management: help avoid or allow for the correction of errors, meaningful error messages
• Consistency: keep interface consistent for particular context, change for change of context.
• Significance of codes: coherence between signs and the object or action to which they refer
• Compatibility: content and actions are compatible with the habits and practices of target public

For more detailed explanation of criteria read [http://www.cocoaheads.fr/wp-content/uploads/files/Ergonomic_Criteria.pdf Ergonomic Criteria for the Evaluation of Human-Computer Interfaces]

Related pages

• Usability
• Interaction design
• Design and usability methods and techniques
• User interaction and user interface design - definitions and distinction

Generating authentic user tasks

See Scenario-based usability engineering

Designing the test

Three basic steps to usability testing from Nielsen's Usability 101:

• Get hold of some representative users, such as customers for an e-commerce site or employees for an intranet (in the latter case, they should work outside your department).
• Ask the users to perform representative tasks with the design.
• Observe what the users do, where they succeed, and where they have difficulties with the user interface.
• Shut up and let the users do the talking.

• Why You Only Need to Test with 5 Users - 5 users represent 80% of problems

Examples

Bad usability in (web) design

• webpagesthatsuck.com
• bad designs
• Operating system interface design between 1981-2009

Designing interaction

Webforms (self-study)

See HTML forms tutorial

Javascript (self-study)

See Category:JavaScript and Javascript tutorial - basics

Assignment 8 - Functional prototype

Described in week 6 Learning module

Links

• Usability Testing Toolkit: Resources, Articles, and Techniques

References

• NIELSEN, J., (1993) Usability engineering. Boston, Academic Press.
• SCAPIN, D.L. and BASTIEN, J.M.C. (1997). Ergonomic criteria for evaluating the ergonomic quality of interactive systems. Behavior & Information Technology, 1997, 17 (4/5), 220-231.
• SHNEIDERMAN, B. (1992). Designing the user interface : strategies for effective human-Computer-Interaction. (Chap 3, 4 and 5). 2nd ed., Addison-Whesley Publishing Company.