In one application I work on, I recently added some text to the context-sensitive help topic for a screen that allows financial secretaries to make a payment. The text described what to do with a particular control that had been added to the screen.

Because of the many variables involved in making a payment in various countries around the world, this screen has become functionally dense, leading to a help topic that I finally decided had become cumbersome. The bulk of it was a procedure for filling out the information, but in between steps was a lot of “if you need to do X, enter Y” and such things. Some of those extra explanations were only a couple of extra sentences, but added together, it was a lot of content being spewed at the user.

This is a Web application, so we don’t have field-level help. The growth of this help topic led me to imagine that if a user clicked Help for information about one particular field and had to slog through the text in that topic, they wouldn’t get very far before giving up. That much information punching you in the face would be enough discouragement without even beginning to scan it.

I needed a different approach.

After some deliberation, the thought came to me to try two levels of dropdown hotspots. This screen is divided in sections, so I rearranged the information so that I had a hotspot corresponding to each section. Each hotspot would expose another set of hotspots and any other information about that section in general. This would allow the user to navigate directly to what they want rather than having to scan and scroll through a bunch of text.

I talked to an interaction designer and also demonstrated this idea to the user education team. I received some good feedback, and they were generally in favor of this idea.

The next problem was that in this help system, I have provided a screenshot at the top of each context-sensitive topic. The original reasons for doing this have changed, and the main purpose now is usually to show examples of what the user may see or do on the screen. But even visually condensed text can be pushed out of sight by the screenshot, so I hadn’t won much. So I decided to try putting the screenshot inside a hotspot and allow the user to choose to see it if he or she wants an example rather than having to see it every time. Generally, they already know what screen they’re on anyway.

Next, I explained the concept to the product manager (I run major changes past him because he wrote the help for the application we’re replacing). He said, “That sounds great, and I think people your age will have no problem with it. But I’m concerned about some of the older folks who would have to use it.”

Now, our users consist of two main age demographics: People about 20 and people in their 50s or older. The project team has tried to be aware of the potential gap in familiarity with computers and Web applications.

What the product manager suggested next was music to my ears: “It would be nice to get it in front of some of them and have them try it.” After I demonstrated this new topic structure to him, he was even more in favor of trying it with some of our users. He is setting up a couple of on-site visits for me in our area so I can see how our users navigate in this kind of topic structure.

In any case, using this method makes the information look much less intimidating when the topic opens. I’m trading scrolling for mouse clicks, but I think clicking is the better of the two. The problem I have to contend with is how to provide a control to expand all hotspots, or at least for a print control to print all hotspot contents. I’m using RoboHelp 7.02 to maintain this help system, and I haven’t been able to locate something that would quickly integrate with RH7′s hotspot scripts to expand everything at once. And I’m not a JavaScript whiz. (If you have such a script or know where I can get one, please let me know! What I found on grainge.org didn’t quite address this need.)

So we’ll see how the usability testing goes and whether I can find a way to expand all hotspots. (Come to think of it, I think all a “collapse all” control would have to be is a link to “#,” just refreshing the page.) But having the topic open with screenshot and control details within dropdown hotspots makes the topic look a lot less daunting when it opens. I plan to implement this across the longer context-sensitive topics.


Related entries (auto-generated):

Findings from an Online Help Usability Test

A Shift in My Context-Sensitive Help Approach

Forget the Scry: Find out Why Users Access Help

Anticipatory Search in Context-Sensitive Help

Help Authoring Woes: Index As You Go