Wizard/progressive stepper: Should states only be controlled by back button?

Question

Suppose a stepper has 6 steps. Can the user directly jump to the 4th step or should he follow the same flow with a click on "save and next". Same flow for the reverse order as well.

For example:

Should step 2 or 3 be clickable by the user? Suppose the user is in step 3 and wants to make some changes in step 1. Should the user click the back button twice in order to reach step 1 or can user jump directly to any step by clicking on the number shown below?

What should be the ideal flow for a wizard?

Answer 1

As with many other design/usability questions, the answer depends on the context.

All things being equal, I'd argue that allowing the user to jump back/forward is a useful feature. It allows for what Nielsen/Norman, in their list of usability heuristics, would call User Control and Freedom: https://www.nngroup.com/articles/ten-usability-heuristics/

But I would urge you to test your designs before making a decision. This feature may be costly to implement, and the benefits may be limited.

For example, I once created a prototype for a multi-page insurance form. On each page, I had buttons that allowed the user to go back/forward at every step, as well as a clickable progress indicator, that allowed users to jump to any step.

In my usability tests, users ignored the back buttons, and the clickable progress bar. They wanted to fill out the form in the way it was presented, one page at a time. They tended not to want to go back, or to skip ahead.

But your own design / tests may uncover something different.

Answer 2

I'd say that if you prevent the user from going back to any step then that would be preventing user freedom. However, your business rules might suggest that a user must follow a flow.

It sounds to me it doesn't matter so I would give the user freedom to choose if they need to go back to that other section. If changing data in the previous affects the future steps, then make the user go through the flow.

EDIT:

If the user has not proceeded to the future steps I would not allow. If the user is at step three and the user wants to get to step one, allow the user to click to that step. The reason why I'm hesitant to allow the freedom to move between steps in the beginning before reaching the steps is because we need to go through each step first. Never make the user work harder to get to where they need to get to (Clicking the back button twice).

Giving the ability to go back supports undo and redo even if users don't always use those hidden features. If you have a review page it could become very beneficial in the event a user selected incorrectly what they wanted.

And on an off topic. Instead of naming the buttons 'Next' or 'Back', give your buttons more meaning such as 'Ad Details' and 'Ad Sizes' or 'Details' and 'Size'. It's preferred to stay away from ambiguous button labels such as 'Next' or 'Back'.

As everyone has mentioned testing goes a long way my friend :D

Answer 3

There are two types of steppers:

1. Editable steppers - allows users to return later to edit a step. These are ideal for workflows that involve editing steps within a session. In this case, use a non-linear stepper which allows to user to navigate through all steps.

2. Non-editable steppers should be used when users cannot edit a step later (dependencies) OR step editing poses a distraction risk to form completion. And in this case, use a linear stepper which forbids the user to navigate through steps.

Answer 4

When you make these things as steps(wizard), you are using "tunneling" approach. So the user should fill the steps from one to six and shouldn't jump to six from one. The idea behind the tunneling is giving the exact location of the progress to the user. These circles are not like tabs, so they should work as progress indicators. The user can go back and forth only one step.

You can provide these expandables rather than the wizard if you want to give the user a power to edit sections in order.