0

I'm currently designing a step-by-step wizard, where the interface tells the user which section of the wizard he/she is visiting, using Progress Trackers, like the image below.

The user can navigate through each Step, back and forward and also jump between Steps that are already complete (ex: on Step 3, jump to Step 1)

enter image description here

Now the challenge is that those steps have sub-steps inside, for example, for the user to complete the Step 3, he/she needs to fill four sub-steps that are related with that Step 3, like this:

enter image description here

My question is...

Having Progress Tracker with 2 levels, which the user can navigate through, is a flow that is familiar for the user? If so, is there any usability issue that I should be aware of?

Thanks

4

I don't think it is a familiar flow, but it can work.

There are a few points.

  • Make sure your hierarchy between main steps and sub steps is very clear. Users must not think there are more steps than there really are.
  • Also make sure there's a clear difference between a completed and an in progress step (like your image already has).

The above mentioned points could look something like this.

enter image description here

Another solution might be to make the substeps part of the main steps using a progress bar. See image below.

enter image description here

1

Users don't really care about discrete progress

Rather than showing sub-steps that tell the user exactly which one they're on, I'd recommend implementing a progress bar on each section of the wizard. I'm envisioning the Step 1 box with a progress bar immediately below it or within it (maybe as a background?).

This sacrifices letting users know the exact number of actions they need to take, but in some cases, I would argue that this is better as it seems like fewer steps are necessary.

  • Ok, I just added to the question that the user can jump between steps (check 2nd paragraph). I believe this will important to share since the Steps, although indicate progress, also serve as "shortcut" to jump between steps – Joao Carvalho Apr 20 '17 at 13:23
0

It is not something that I have seen before, but I think it could work. As a suggestion, consider if you can have left and top navigation, especially when they are too many sub-steps. I think this is model that more people are used to it.

Something like the following images:

enter image description here

Or

Demonstration

  • 1
    This is very confusing. There is no association to what is on the left and what's on the top. – Majo0od Apr 20 '17 at 14:53
  • @Majo0od Thanks for your comment. What about if I place the steps on top and the substeps on the left? Is it more clear now? all ideas for improvement are more than welcome – Dimitra Miha Apr 20 '17 at 15:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.