Step-by-Step Instructions

Examples: Context:  A user needs to perform a complex task, with limited time, knowledge, attention, or space. Alternatively, the nature of the task is step-by-step, and it's meaningless to show all the action possibilities at once.

Problem:  How can the artifact unfold the possible actions to the user in a way that does not overwhelm or confuse them, but instead guides them to a successful task completion?


Solution:  Walk the user through the task one step at a time, giving very clear instructions at each step.  Use visual similarities in all the steps, e.g. typography and layout, to maintain a rhythm throughout the task; make each step a focal point, both visually and in the user's "attention space."  If information is needed from the user, ask for it in simple terms and with brevity; by keeping it short, you can better maintain the user's sense of flow through the whole step-by-step process.
The task may branch like a flow chart, depending upon what information the user gives it, but the user doesn't necessarily need to know about all the available paths through the task.  If it's not likely to confuse the user, show the steps as a Map of Navigable Spaces. If possible, allow the user to back out of the steps (Go Back One Step, Go Back to a Safe Place).   If the sequence of steps as seen by the user is too long -- more than ten steps, for example -- try to break it up into manageable sub-sequences, so it doesn't get too tedious for the user.  Make sure the sub-sequences relate to each other in a meaningful way, however, or the user may see it as gratuitous or annoying.

Sometimes users may want to know more about what they're doing -- Optional Detail On Demand gives you a way to present that extra information.  Also, if a user has gone through a lot of steps, they have trouble remembering what they've done and why.  At least provide a Progress Indicator if the number of steps grows beyond seven or eight, which is the average limit of short-term memory.  If a lot of user interaction is necessary, such as for branching decisions, consider providing an Interaction History

Resulting Context:  Narrative is a good choice for presenting the task steps themselves; the use of natural language to describe what needs to be done is intuitively obvious, and puts a user at ease.  Go Back One Step and Go Back to a Safe Place, along with a corresponding Forward control, can be used to move through an interactive task.

To get information from the user, you can use a Form or its simpler component patterns,  especially Choice from a Small Set and Forgiving Text Entry.  Using Good Defaults with them allows the user to move smoothly past the points where extra data entry is unnecessary, again preserving the sense of flow.  Finally, a small set of Convenient Environment Actions should give the user ways to cancel or suspend the task without having to back out of it one step at a time.

Notes:  Be aware that this pattern may irritate experienced users.  If a user knows exactly what they need to do, and want to do it quickly, constraint to this step-by-step presentation can feel like a straitjacket!  Also, if the task to be accomplished isn't inherently linear -- i.e. you don't really have to do one step first, another step second, etc. -- you might provide an alternative "random access" presentation of the possible actions, such as a Stack of Working Surfaces.

Comments to:
Last modified May 17, 1999

Copyright (c) 1999 by Jenifer Tidwell.  All rights reserved.