Implementation of Step Progress Bar with loop

by Asqan   Last Updated January 17, 2018 06:16 AM

I have a indicator that tells user in which step they are:

enter image description here

Suppose, we are registering televisions we have at home. For the most of the cases, they have just one. However, for some people -let say 1/3 of the cases- it should be somehow allowed to add more. This is the main idea of having a loop for my step progress bar. At some point, they should be allowed to add more entities by following the same steps (e.g. max 5 times) and go further to complete the whole story.

If our loop starts from step 1 to step 3 (e.g. television details, adres of customer and a small survey) and if the steps 4 and 5 are common steps (like paying, confirmation etc):

enter image description here

Is there a common way/standard to implement such a situation? Or a loop within a step progress completely wrong choice (then what can be the alternative)? I also couldn't see any example for step progress bar with a loop on web.

Answers 1

What you are describing is two nested wizards, one for the whole process and one for entering TVs. I would recommend against this beacuse it will confuse the users.

Keep one wizard for the whole process and have one step for adding TVs. The Add TVs step will have all the necessary fields for entering a TV and a button "I have more TVs" (Progressive disclosure design pattern). IF the user clikcs on the "I have more TVs", display a grid with the existing TV and a button to add more TVs.

January 17, 2018 06:35 AM

Related Questions

Hierarchy VS Usability in Mobile Design

Updated May 22, 2017 23:16 PM

Hierarchy VS Usability in Mobile Design

Updated May 30, 2017 17:16 PM

Studies on item selection behaviour?

Updated February 06, 2019 10:16 AM

Modal dialog with solid or transparent background?

Updated August 18, 2016 08:06 AM