CHAPTER 12:
User Documentation and Online Help
Designing the User Interface:
Strategies for Effective Human-Computer Interaction
Fifth Edition
Ben Shneiderman & Catherine Plaisant in collaboration with
Maxine S. Cohen and Steven M. Jacobs
Addison Wesley is an imprint of
© 2010 Pearson Addison-Wesley. All rights reserved.

• Even though increasing attention is being paid to designing interfaces, complex systems can still benefit from both paper and online help
© 2010 Pearson Addison-Wesley. All rights reserved.
1-2
12-2

Introduction
• Paper materials:
– Installation manual
–
Quick reference card or guides
–
Tutorials
–
Detailed reference manual
• Online materials
–
Online manual
– Online help
–
Context-sensitive help
– Online tutorial
–
Animated demonstration
– Assistants and Wizards
– FAQs
–
Online communities, newsgroups, listservers, e-mail, chat, and instant messaging
12-3
1-3
© 2010 Pearson Addison-Wesley. All rights reserved.

© 2010 Pearson Addison-Wesley. All rights reserved.
1-4
12-4

Paper versus online manuals
• Advantages to online manuals
– No desk space needed
– Always available and updated rapidly
– Navigation features (tables, indices, searching, linking)
– Interactive services (bookmarking, rich content, listservs)
– Cheaper
• Disadvantages to online manuals
– Display may not be as readable
– Display page may contain less information
– Extra mental effort required for navigating
– Split display between work and help reduces work space
– Small devices do not have enough display space
© 2010 Pearson Addison-Wesley. All rights reserved.
12-5
1-5

Reading paper versus displays
• Studies found 15% - 30% slower task times for comprehension of text on computer displays compared to paper
• Potential Disadvantages in Reading from Displays:
– Poor fonts on low resolution displays
– Low contrast between text and background
– Glare
– Screen flicker
– Curved display
– Small displays require more frequent page turning
– Displays are fixed
• Display placement may be too high or too far for comfortable reading
• Reduced hand and body motions with displays may be fatiguing
•
Rigid posture for displays may also be fatiguing
© 2010 Pearson Addison-Wesley. All rights reserved.
1-6
12-6

Reading from paper versus from displays
• Guidelines for online manuals
– Quick response times, fast display rates
– Black text on white background
– Use san-serif fonts, not serif fonts
– Automatically sense orientation and viewing
– Put most important information content in beginning paragraphs and at left side of page
12-7

Reading from paper versus from displays
Heatmaps from the eyetracking study. (Nielson, 2006).
© 2010 Pearson Addison-Wesley. All rights reserved.
1-8
12-8

Shaping the content of manuals
• Used to be, help manuals written by junior member of development team
– often poorly written
– not suited to the background of the users
– not tested adequately
• Benefits of well-designed manuals include
– shorter learning times
– better user performance
– increased user satisfaction
– few calls for support
© 2010 Pearson Addison-Wesley. All rights reserved.
1-9
12-9

The user manual for Adobe Reader® 9.0
© 2010 Pearson Addison-Wesley. All rights reserved.
1-11
12-11

How highlighting, fonts, etc. help users
Quick Start guide from RefWorks.com, an online research management, writing, and collaboration tool.
© 2010 Pearson Addison-Wesley. All rights reserved.
1-12
12-12

Shaping the content of manuals
• Learners prefer trying out actions rather than reading!
• Minimal manuals
– anchor the tool in the task domain
– encourage active involvement with hands-on experiences
– provide guided exploration of system features
– support error recognition and recovery
– support reading to do, study, and locate
© 2010 Pearson Addison-Wesley. All rights reserved.
1-13
12-13

Organization and writing style
• State instructional objectives precisely
• Present concepts in a logical sequence with increasing order of difficulty
• Ensure each concept is used in subsequent sections
• Avoid forward references
• Construct sections with approximately equal amounts of material
• Provide examples
• Choose words and phrases carefully
• Use style guides for consistency
• Match writing style to users' reading ability
© 2010 Pearson Addison-Wesley. All rights reserved.
1-14
12-14

Guidelines for online manuals and help
• Do not use help to compensate for poor interface design.
• Make help system easy to access and easy to return from.
• Make help messages accurate and complete.
• Make them universally accessible.
© 2010 Pearson Addison-Wesley. All rights reserved.
1-15
12-15

More specific guidelines for online manuals and help
• Make a close match between printed and online versions
• Include special online features
– Provide string search
– Provide indices with hyperlinks
– Expandable / collapsible tables of contents
– Allow electronic bookmarking and annotating
– Keep a history
• Table of contents can remain visible to side of text page
• Make table of contents collapsible / expandable
• Provide appendices of error messages
• Provide tutorials for novices
• Cluster keyword lists into meaningful categories
• Provide answer wizard to respond to natural language requests
1-16
© 2010 Pearson Addison-Wesley. All rights reserved.
12-16

Online manuals and help
© 2010 Pearson Addison-Wesley. All rights reserved.
1-17
12-17

Online manuals and help
Tool-tip
• Context-sensitive help
– User-controlled, interactive object help
• Small pop-up box
• Dedicated portion of the display
– Intelligent help: make assumptions about what users want
• Intelligent help systems face serious usability challenges
• e.g. Clippy
– Hybrid approaches
• Initiative is shared between the user and system
• Unobtrusive advice from system, but requires space
© 2010 Pearson Addison-Wesley. All rights reserved.
1-18
12-18

Context sensitive, detailed help
© 2010 Pearson Addison-Wesley. All rights reserved.
1-19
12-19

Online manuals and help (cont.)
Assistive Guide
© 2010 Pearson Addison-Wesley. All rights reserved.
1-20
12-20

Online manuals and help (cont.)
“breadcrumbs” near the top to show how user got to this page
© 2010 Pearson Addison-Wesley. All rights reserved. list of common icons to familiarize novice users with the symbols used
1-21
12-21

Online manuals and help
© 2010 Pearson Addison-Wesley. All rights reserved.
Controls to adjust the text size, adjust the contrast, and turn speech on or off.
Uses sans-serif large font
Several ways are provided to navigate through the information (alphabetical, grouping by category, etc.).
1-22
12-22

Online tutorials, demonstrations, and animations
• Online tutorials
– Good for novices to practice skills
– Can work alone at own pace and without embarrassment of mistakes made before human instructor or fellow students
– Start-up tips
© 2010 Pearson Addison-Wesley. All rights reserved.
1-23
12-23

Online tutorials , demonstrations, and animations
• Demonstration systems
– Distributed on CD-ROM/DVD or over Internet
– Show off system features using animation, color graphics, sound, etc.
– User-interface requirements are to
• capture and maintain user interest
• convey information
• build positive product image
– Typical controls
• automatic or manual pacing
• length of demonstration (short versus in-depth)
• stop, replay, skip
– Screen capture animation is easy to produce with tools
– Games often have a 30 second demonstration
© 2010 Pearson Addison-Wesley. All rights reserved.
1-24
12-24

Online tutorials, demonstrations, and animations
© 2010 Pearson Addison-Wesley. All rights reserved.
This is a screen capture from a priceline demo available from Autodemo
(http://www.autodemo.com).
User can choose whether to listen to the demo or view the demo. On the right, there is a pop-up box with help and further explanation.
1-25
12-25

Online tutorials, demonstrations, and animations (cont.)
Dynamap is a multi-layered interface with three levels.
Level 1, shown here, consists only of a map. Sticky notes introduce the main functions and example tasks. The “show me” buttons initiate animated demonstrations. Users can advance through the demonstration step by step or execute the commands themselves, following the directions. A sticky note also points to the buttons allowing users to move to Levels 2 and 3.
© 2010 Pearson Addison-Wesley. All rights reserved.
1-26
12-26

Online communities for user assistance
• Help networks using email
– sent to designated help desk or staff person
– sent to general list within organization
– users must publicly expose their lack of knowledge
– risk getting incorrect advice
• Communal approach means low cost
• Frequently asked questions (FAQ) lists for newcomers
© 2010 Pearson Addison-Wesley. All rights reserved.
1-27
12-27

Online communities for user assistance
© 2010 Pearson Addison-Wesley. All rights reserved.
1-28
12-28

Development process guidelines
© 2010 Pearson Addison-Wesley. All rights reserved.
1-29
12-29

Summary
• Help documentation (paper or online) can determine success of software product.
• Documentation should be developed before implementation.
• Help should be tailored to user community.
• Help should be realistic, encourage active exploration, use consistent terminology, support error recovery.
• Animated demonstrations should be used.
• Social media participation provide low-cost support.
• Multilayer UI promotes graceful evolution as user skills increase.
© 2010 Pearson Addison-Wesley. All rights reserved.
1-30
12-30