Wizard

Problem

The user wants to achieve a single goal but several decisions need to be made before the goal can be achieved completely, which may not be know to the user

Solution

Take the user through the entire task one step at the time. Let the user step through the tasks and show which steps exist and which have been completed.

From www.club.nokia.com/


Use when

A non-expert user needs to perform an infrequent complex task consisting of several subtasks where decisions need to be made in each subtask. The number of subtasks must be small e.g. typically between ~3 and ~10. The user wants to reach the overall goal but may not be familiar or interested in the steps that need to be performed. The task can be ordered but are not always independent of each other i.e. a certain task may need to be finished before the next task can be done. To reach the goal several steps need to be taken but the exact steps required may vary because of decisions made in previous steps.

How

When the complex task is started, the user is informed about the goal that will be achieved and the fact that several decisions are needed. The user can go to the next task by using a navigation widget (for example a button or some other form of Paging mechanism). If the user cannot start the next task before completing the current one, feedback is provided indicating the user cannot proceed before completion (for example by disabling a navigation widget). The user is also able to revise a decision by navigating back to a previous task.

The users are given feedback about the purpose of each task and the users can see at all times where they are in the sequence and which steps are part of the sequence. When the complex task is completed, feedback is provided to show the user that the tasks have been completed and optionally results have been processed.

If relevant, users that know the default options can immediately use a shortcut that allows all the steps to be done in one action. At any point in the sequence it is possible to abort the task by choosing the visible exit.

Why

The navigation buttons suggest the users that they are navigating a path with steps. Each task is presented in a consistent fashion enforcing the idea that several steps are taken. The task sequence informs the user at once which steps will need to be taken and where the user currently is. The learnability and memorability of the task are improved but it may have a negative effect of the performance time of the task. When users are forced to follow the order of tasks, users are less likely to miss important things and will hence make fewer errors.

More Examples


This example is taken from the KLM web site where you can buy tickets online.


plml logo

Comments

4 comments have been added to this pattern


Gary, 8th September 2008
Are there any examples in which the wizard is presented horizontally, instead of a vertical presentation on the right? Sometimes the content will fill the horizontal space alloted.
William Brall, 17th October 2008
Having an alternative to a wizard is a good choice. Something designed for intermediate and expert users that is more efficient to use, but requires some learning to understand fully.

Wizards make great first-run tools when structured to be like the expert system only dimmed and useless where focus isn't needed. This would allow the user to have his hand held the first time he uses the system, while showing them the ropes at the same time.

Will
Gareth, 4th March 2009
This is a great approach for a known set of steps, however what happens when the set of steps is dynamic depnding on entry within early steps? Are there any examples of this being solved?
Gautam, 18th May 2009
Gareth's question: ...what happens when the set of steps is dynamic depnding on entry within early step...?
Wizards that we use in my present project - which I unfortunately can't show - has a dynamic wizard. During the first step we show a path of the minimum no. of tasks, with focus on the first. When the user continues to the next step, the number of tasks shown in the horizontal path is adjusted to display the correct tasks that remain. This could potentially be confusing, but our user tests have not indicated any problems. We chose this solution rather than one where the maximum no. of tasks would be shown, but the user would then 'jump' over tasks that were irrelevant.


Add a comment
Do you have something to add or say about this pattern? Perhaps some more examples of how this pattern is used in the wild? Add a comment to this pattern and I'll update the pattern when necessary. Please abstain from misuse. I reserve the right to delete or modify inappropriate postings.

Your Name

Comment

Enter the verification code you see in the image below
captcha