UI and UA: Partners in Usability - PowerPoint PPT Presentation

1 / 46
About This Presentation
Title:

UI and UA: Partners in Usability

Description:

Help users perform their work more effectively ... Display embedded Help in the application window that changes with the user context ... Make help more procedural ... – PowerPoint PPT presentation

Number of Views:44
Avg rating:3.0/5.0
Slides: 47
Provided by: whitneyqu
Category:

less

Transcript and Presenter's Notes

Title: UI and UA: Partners in Usability


1
UI and UA Partners in Usability
  • ? Whitney Quesenbery, Cognetics
  • ? Rob Houser, User First Services

2
The Problem Facing Us Today
  • User assistance is moving closer to the user
    interface
  • People who create user assistance are adopting
    the goals, process, guidelines, and techniques of
    user interface design
  • User assistance, while similar, is not user
    interface (and vice versa)

3
Agenda
  • Similar, but Different
  • Case Study
  • Productive Interactions

4
Similar, but Different
  • Comparing User Assistance and User Interface
  • Goals
  • Process
  • Tools
  • Guidelines
  • Techniques

5
Goals
Usability The extent to which a product can be
used by specified users to achieve specified
goals with effectiveness, efficiency and
satisfaction in a specified context of use. - ISO
9241
  • UI and UA share design goals
  • Help users perform their work more effectively
  • Make it as easy as possible for users to use a
    product
  • Assist users in learning while doing real work
  • Minimize the amount external support required to
    use a product

6
Goals
Businesses expend great resources pursuing
optimal computer performance however, they often
ignore the fact that people cost more than
computers.
  • They also share business goals with the rest of
    the company
  • Sell a product
  • Create a good first (and on-going) impression of
    a product
  • Work better, faster, cheaper
  • Reduce overall costs of product development and
    maintenance

7
Process
User-Centered Design The challenge of system
design is to fit into the fabric of everyday
life. Beyer and Holtzblatt
  • Both UI and UA follow a user-centered design
    process
  • Analysis
  • Design
  • Refine
  • Build
  • Support
  • Throughout the process we rely on usability
    evaluations for iterative refinement

8
Tools
Designing an effective interface doesnt happen
by chance...Good design happens only when designs
understand what users are trying to
accomplish. Hackos and Redish
  • Tools from a user-centered design process
  • User and task analysis
  • Observations
  • Site visits
  • Contextual inquiry
  • Usability evaluation

9
Guidelines
Heuristics - Recognized usability and design
principles, which can be used for an expert
evaluation of a design. Cognetics Corporation
http//www.cognetics.com/services/heuristic_guide
lines.html
  • Usability Heuristics
  • Matches user tasks and mental model
  • Speaks in users language
  • Consistency
  • Support for standards
  • Visibility
  • Visual design and layout attractive and minimal
  • Supports user actions
  • Prevents errors
  • Provides shortcuts
  • Supports learning

10
Techniques
  • User Assistance
  • Job aids
  • Print Manuals
  • Online Help
  • Context-sensitive help
  • Embedded Help
  • Demos/tutorials
  • WBT/CBT
  • Web sites (for support)
  • Knowledge bases
  • User Interface
  • Navigational model
  • Visual design
  • Prototypes
  • Task organization
  • Screen, page or form layouts
  • Controls and other components
  • Language and terminology

11
Design Techniques
  • Some techniques are not controversial
  • Labels in GUI
  • Error messages
  • Mouse-over text
  • Any extrinsic help
  • Print manuals
  • Some raise issues of ownership and control
  • Instructions appearing within the interface
  • Wizards
  • Coaching or assistants
  • Embedded help

What are the issues, and how can we address them
effectively?
12
Case Study Ofoto Upload Assistant
  • Simple image capture and editing tool
  • Get images off disc, scanner or camera
  • Crop, reduce red-eye, or brighten images
  • Upload images to Ofoto web site for printing
  • http//www.ofoto.com

13
Welcome Screen
  • Displayed on first entry to the program
  • Sets context
  • Explains capabilities

14
Basic Screen Layout
  • Sample images are displayed when program opens
    for first time

15
If No Images Are Found
  • There is no feedback when no images are found -
    the interface just goes black

16
Help File
  • Main UA is a WinHelp file
  • 12 topics
  • 30 index terms
  • TOC is based on high-level workflow

17
Help File Topic
  • Topics are long (no layering)
  • No demos or graphics are provided
  • Index is limited
  • Provides some tips about when to use editing
    features

18
Links to Help
  • Context-sensitive links to help exist, but only
    on one screen

19
UA in the Interface
  • Each button has an icon, a label and mouse-over
    text
  • Mouse-over text provides immediate information,
    without simply repeating the name of the command

20
Messages
  • Error messages attempt to provide some coaching
    when users try to do something they shouldnt

21
Support Site
  • Product links to support site on the web site
  • Repeat of same help information
  • Other areas of web site provide a little more info

22
Whats Good About the UA
  • Delivered online to ensure availability
  • Offers some tips
  • Includes some context-sensitive help
  • Gives extra information in the mouse-over text
  • Provides some limited coaching
  • Links to web site for support and more information

23
Whats Not So Good About the UA
  • Help covers up the application
  • Users cannot find information easily
  • Users need more training (examples with graphics
    or demos of actions)
  • Users need more guidance and feedback
  • Support web site doesnt provide support

24
Whats Good About the UI
  • Clear labeling of functions and information
  • Good visibility for things like current
    directory, number selected, highlighting of
    selected photo
  • Attractive visual design
  • Good icons with accompanying labels
  • Consistent with platform guidelines

25
Whats Not So Good About the UI
  • The real user goal is not clearly represented
  • Do users have the mental model of the whole task
    and how this software fits into it?
  • No clear separation is provided between different
    tasks
  • The task sequence is not explicit.
  • Some controls are difficult to locate or
    understand
  • Get Photos is hidden on the menu. It should be
    a button next to the source label
  • Image selection is confusing select to view
    (click) vs. select to upload (checkbox)

26
Where is the Overlap?
  • Both reviews identified similar problems
  • Improve the match to users mental model
  • Making user goals more explicit
  • Sequencing the tasks
  • Support learning better
  • Integrate the UI and UA
  • Guide users through basic tasks
  • Include more training for advanced tasks
  • Improve visibility of information
  • Make controls more connected
  • Make assistance easier to find

Whats the best way to improve the product?
27
How Do You Proceed?
  • Brainstorm possible solutions to each problem
  • Consider which are most effective for users
  • How comprehensive is each solution?
  • What are the down-sides to the solution?
  • Are there solutions which seem to go together, or
    which are mutually exclusive?
  • What is the impact of each suggestion
  • Does it require new functionality?
  • Is it an improvement to existing designs?

28
Possible Solutions Improving the Mental Model
  • Separate unrelated tasks. Make individual windows
    for Get Photos, Edit Photos, Print Photos
  • Create a control/progress bar with the overall
    task, and use popup dialogs for each step.
  • Number the steps and put them across the top of
    the window
  • Organize the menu in a more task-oriented way
  • Reflect overall sequence in Help and suggest next
    logical step in the path

29
Possible Solutions Support Learning
  • Display embedded Help in the application window
    that changes with the user context
  • Add wizards to the welcome screen for novice
    users, especially for Get Photo task
  • Make help more procedural
  • Provide more corrective feedback when users do
    something that may have an undesirable result
  • Provide more graphical examples and
    demonstrations in the help and/or web site

30
Possible Solutions Improve Visibility of
Information
  • Put editing tools next to the image area rather
    than at the top of the window
  • Provide Whats This? Help for all fields
  • Place labels (like current photo source) near
    actions (like Get Photos)

31
What Happens Next?
  • Areas of Potential Conflict
  • Strategies for Collaboration

32
Areas of Potential Conflict
  • Who asked you?
  • Nice idea, but we dont have the room on the
    screen for all that text.
  • This interface is so intuitive, it doesnt need
    any help.
  • Its a nice-to-do, but we cant hold up the
    schedule for it.
  • Wizards are UI, not UA. Back off!

33
Strategies for Collaboration
  • Share information and resources
  • Be specific and concrete
  • Talk at the right level
  • Focus on the business problem
  • Use your most flexible interpersonal skills
  • Show, dont tell
  • Take it slow
  • Clarify (and accept) roles

34
Share Information and Resources
  • Build alliances
  • Collaborate on gathering information about users
  • Gather information from all departments
    training, technical support, marketing
  • Show how working together will enable you to do
    more, in less time, and with better results
  • Involve others in analyzing data and making
    decisions to increase buy in and support

35
Be Specific and Concrete
  • Focus on the specifics this situation, these
    users, this task
  • Dont over-rely on general rules
  • Avoid religious wars
  • Learn to separate opinions or preferences from
    user-centered principles
  • When in doubt, return to the users

36
Talk at the Right Level
  • Match your comments to the context
  • High level design meeting
  • Contribute ideas about overall design of UA
  • Function-level analysis
  • Discuss assistance needs for this function
  • Suggest UA design techniques that will be
    effective
  • Look for terminology that is not users language
  • Detailed UI walk-through
  • Look for typos, minor consistency issues,
  • Restrict suggestions to ideas within scope of the
    design

37
Focus on the Business Problem
  • Think in terms of business decisions and goals,
    not just what is right
  • Pick your battles
  • Prioritize for impact on the product and users
  • Be mindful of costs
  • Learn the art of satisficing

38
Use Your Most Flexible Interpersonal Skills
  • Learn the language of the rest of the team
  • Teach them your language when it adds to
    understanding
  • Remember that people have an emotional investment
    in what theyve created
  • Frame arguments to focus on positive intent and
    outcomes
  • Assume good intentions

39
Show, Dont Tell
  • Use sketches or prototypes to show people when
    you can
  • Bring examples from user analysis or evaluation
    into the discussion
  • Allow people time to reach their own
    interpretations of the data

40
Take It Slow
  • Dont try to change everything at once
  • Plan for a staged execution
  • Dont be discouraged at setbacks, just try again
    in a new way the next time

41
Clarify (and Accept) Roles
  • Depending on the context, a user assistance
    designer can have many different roles on a
    project.
  • Who else is working on the user interface?
  • How are development teams structured?
  • Are their other usability professionals or
    advocates?
  • Are you integrated into the product team, in a
    central department, or contracted?
  • Is user-centered design part of the development
    process?

42
How You Can Have an Impact
If the UI is designed and built by developers,
with no usability process..
Be the first user advocate. Use your skills to
introduce usability/user-centered design.
If you are part of a cross-functional team...
Contribute. Brainstorm. Make design suggestions
and create quick prototypes of ideas.
If no one is working directly with users...
Offer to take on this task. Are there questions
you can help answer?
43
Having an Impact (2)
If there is a usability engineer or user-centered
design on the project...
Ask to be included in user analysis. See if you
can help create reports and other deliverables.
If you are invited to collaborate...
Be ready with ideas, and know their impact on
users and the project.
If your ideas are rejected...
Dont argue. Dont whine. Re-read Strategies for
Communi-cation and try again.
44
Thanks
  • Any questions?

45
More Reading
  • Beyer and Holtzblatt. Contextual Design Defining
    Customer-Centered Systems, Morgan Kaufmann, 1998
  • Block, Peter. Flawless Consulting A Guide to
    Getting Your Expertise Used, Jossey-Bass, 1981
  • Hackos and Redish, User and Task Analysis for
    Interface Design. Wiley, 1998
  • Jensen, Bill, Simplicity The New Competitive
    Advantage. Perseus Books, 2000
  • Klein, Gary Sources of Power How People Make
    Decisions, MIT Press, 1998
  • Krug, Steve. Dont Make Me Think, Que/circle.com,
    2000
  • Neuhauser, Bender and Stromberg. Culture.com -
    Building Corporate Culture in the Connected
    Workplace. Wiley, 2000

46
Contacting Us
Whitney Quesenbery Cognetics Corporation 51
Everett Drive, PO Box 386, Princeton Junction, NJ
08550 609.799.5005 ? whitneyq_at_cognetics.com ?
www.cognetics.com
Rob Houser User First Services 45-B South
Peachtree St., Norcross, GA 30071 770-446-8474 ?
rob_at_userfirst.net ? www.userfirst.net
Write a Comment
User Comments (0)
About PowerShow.com