Optimizing The User Experience Through Integrated Information Design


Published on

Presented at DocTrain East 2007 Conference by Sowmini Sampath & Richard Ellis, MathWorks -- What roles do technical writers play when designing and implementing the user assistance for complex applications? In this session we discuss the development of an integrated system of user assistance for an application used by computational systems biologists. We found that the process required the technical writer to assume roles that ranged from Information Architect to Interaction Designer to Usability Specialist.

What You Will Learn in this Session
In this session, we share:

* An information architecture that delivers information in the context of the user’s task, even as users escalate their quest for information beyond context sensitive help
* An interaction model in which help responds to user action by providing a clear set of steps to follow from one state to another
* A process that technical writers can use to design integrated help solutions for their applications.

Published in: Business, Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Hello, I’m Richard Ellis. My colleague Sowmini Sampath and I are members of the technical writing staff at a local software company called The MathWorks.
  • Optimizing The User Experience Through Integrated Information Design

    1. 1. Optimizing the User Experience Through Integrated Information Design Sowmini Sampath and Richard Ellis
    2. 2. What We’ll Be Talking About <ul><li>In this talk, we’ll describe our approach to developing help solutions that: </li></ul><ul><li>Integrate context sensitive help (CSH) into product user interfaces </li></ul><ul><li>Integrate CSH with our existing knowledge base </li></ul><ul><li>Derive content from interaction analysis </li></ul>
    3. 3. The MathWorks Products <ul><li>The MathWorks produces software for engineers and researchers in a variety of industries: </li></ul><ul><li>Automotive </li></ul><ul><li>Electronics </li></ul><ul><li>Industrial equipment </li></ul><ul><li>Telecommunications </li></ul>
    4. 4. How People Use Our Products? <ul><li>Users create computer models </li></ul><ul><li>Run simulations </li></ul><ul><li>Perform data analysis and visualization </li></ul><ul><li>Create new tools and applications using our software. </li></ul>
    5. 7. Task Complexity <ul><li>User tasks often require configuring a number of complex dialogs. </li></ul><ul><li>Each element represents a decision that the user must make. </li></ul>
    6. 8. Designing Help for Graphical User Interfaces (GUIs) <ul><li>Increasing use of GUIs by products required better help design </li></ul><ul><li>Design goals: </li></ul><ul><li>Integrate user assistance into product interfaces. </li></ul><ul><li>Provide targeted information for each decision </li></ul><ul><li>Make CSH an entry point into the existing user documentation. </li></ul>
    7. 9. Initial Investigations <ul><li>Needed to partner with engineers to integrate the help into the interface. </li></ul><ul><li>Many people thought context sensitive help was of little value. </li></ul><ul><li>Why had people rarely found it useful? </li></ul>
    8. 10. What Was Not Working <ul><li>Tooltips were often used to provide scant information </li></ul><ul><li>Help button dove into usage topics and often required you to wade through a pool information to find the answer. </li></ul>
    9. 11. Why it Was Not Working <ul><li>Tooltips lack: </li></ul><ul><li>Enough information </li></ul><ul><li>Linking </li></ul><ul><li>Formatting </li></ul><ul><li>Not persistent </li></ul><ul><li>Help browser: </li></ul><ul><li>Overwhelming amount of information </li></ul><ul><li>Deep hierarchy of information </li></ul><ul><li>Is cumbersome – starting another application </li></ul><ul><li>Need to provide the right amount and type of information. </li></ul>
    10. 12. Analysis of User Help Requirements <ul><li>We developed use cases, observed usability test, and brainstormed to develop a model of user information needs. </li></ul><ul><li>A “critical mass” of information necessary. </li></ul><ul><li>A progression from specific details to general concepts – information escalation. </li></ul><ul><li>Avoid quantum leaps in your information escalation path. </li></ul>
    11. 13. User Interactions We Support with Help <ul><li>New users tend to explore before doing actual work. </li></ul><ul><li>Users need to map their task onto the products features </li></ul><ul><li>Experienced users often wanted to be reminded of details. </li></ul><ul><li>All users wanted unobtrusive, on-demand information. </li></ul>
    12. 14. The On Ramp – Provided by Help Button Purpose High-level workflow Information gateway
    13. 15. Field-Level Help <ul><li>Right-click context menu displays a popup window with help on individual item. </li></ul>Purpose Relevant details Link to related information
    14. 16. Embedding Help in the User Interface <ul><li>Application starts with instructions displayed </li></ul>Start by doing this Built in on ramp
    15. 17. Procedures Update as Work Progresses <ul><li>The help always matches the tool’s current state. </li></ul>Close help pane GUI has reconfigured Help automatically updates
    16. 18. Tying It All Together <ul><li>A well planned information escalation path – information must stay in context. </li></ul><ul><ul><li>We know what users are doing because they have requested help from a particular location in a GUI. </li></ul></ul><ul><ul><li>Through task analysis the writer has determined what supporting information needs to be in the user’s manual. </li></ul></ul><ul><ul><li>Our metaphor – the link opens the user’s manual at just the right page. </li></ul></ul>
    17. 19. The CSH model integrates all help CSH becomes an entry point into our knowledge base User tasks Product workflow
    18. 20. Introduction <ul><li>Brief description of the SimBiology® application </li></ul><ul><li>Challenges posed to the writing team by the software </li></ul><ul><li>Implementation of the solution </li></ul><ul><li>Summary </li></ul>
    19. 21. SimBiology® <ul><li>SimBiology is a product from the MathWorks that lets biologists visualize and analyze biochemical reactions. </li></ul><ul><li>The SimBiology application extends MATLAB® for use by scientists in academia, and in the biotech and pharmaceutical industry. </li></ul>
    20. 22. Interface Description
    21. 23. How to Begin? <ul><li>We started by analyzing the user’s workflow: </li></ul><ul><ul><li>Took a user’s task and mapped it out in the SimBiology GUI </li></ul></ul><ul><ul><li>Created task scenarios and did usability testing </li></ul></ul><ul><ul><li>Noted user interactions with the GUI to help drive the design process </li></ul></ul><ul><ul><li>Observed that there were many sub tasks within the overall workflow </li></ul></ul>
    22. 24. Selecting a Solution <ul><li>Selected embedded procedures as the solution to documenting subtasks </li></ul>
    23. 27. Observation <ul><li>Novice user asks “Where do I begin? </li></ul><ul><li>Having these multiple tasks confront the user posed a different challenge: </li></ul><ul><ul><li>Users may not know what they need before and what they must do after in the overall workflow. </li></ul></ul>
    24. 28. Solution <ul><li>Provide an on-ramp to the GUI </li></ul><ul><li>Provide an overall view of the general workflow, and show how to map tasks to product features </li></ul>
    25. 30. Research Workflow
    26. 31. SimBiology User Workflow
    27. 32. Process of Creating the Diagram <ul><li>Helped us conceptualize the workflow </li></ul><ul><li>Learned about user task scenarios </li></ul><ul><li>Help us understand what information the target audience needs </li></ul>
    28. 33. Observation <ul><li>Experienced users require more in-depth information but want this in the context of their task. </li></ul>
    29. 34. Solution <ul><li>A path to more in depth information that is closely related to users’ tasks – information must stay in context or users do not read it. </li></ul>
    30. 36. Summary of SimBiology Help <ul><li>SimBiology documentation includes: </li></ul><ul><ul><li>Embedded-help pane </li></ul></ul><ul><ul><ul><li>Procedures to accomplish typical tasks in the GUI </li></ul></ul></ul><ul><ul><ul><li>Cross-references to supporting information </li></ul></ul></ul><ul><ul><li>Usage Topics </li></ul></ul><ul><ul><ul><li>An overall view of the general workflow, and how to map tasks to product features </li></ul></ul></ul><ul><ul><ul><li>In-depth information – conceptual topics, tutorials, reference materials with lots of examples </li></ul></ul></ul>
    31. 37. CSH becomes an entry point into our information system <ul><li>Conceptual topics </li></ul><ul><li>Tutorials </li></ul><ul><li>Reference </li></ul>