3

I'm trying to design a single-page, or wizard-type of UI to fit the following criteria and am running into some issues with clarity.

The app:

  1. Takes a user's zip code
  2. Takes 2 pieces of information about an item
  3. Shows dynamic data related to that item and allows the user to make a selection from the dynamic data
  4. Displays a summary of the choice made

However, at step (3) and (4) the business would also like to give the user to ability to go back and add additional items - which is step (2). This muddies up step (3) because then dynamic data needs to be listed for more than one item. I'm also wondering if it's such a good idea to make the user jump back a step in the process.

The other alternative is adding steps to the wizard in-line when the user wants to add additional items, but I'm a bit cautious about doing this because then I can't really predict how many "steps" the user will take and show him/her where he/she is in the process with a progress-bar. (or can I? I don't know how I would.)

I feel like I'm missing a UI pattern here that might better apply to this scenario. Any thoughts are appreciated.

Extra thoughts: I've toyed with the idea of scrapping a traditional wizard and designing the flow on one screen:

  1. Text area with zip code
  2. Text area for entering item information and button to "Add to Summary"
  3. Adding to summary clears the text area to allow for additional items to be added
  4. Dynamically display text area beneath it being careful to differentiate between items and allow for removal of the item's dynamic info
  5. When user makes a selection from dynamic info, display summary area beneath.
Improve this question
4
  • From the user's perspective, is there only one right answer to the input or are they likely to test many answers? For example, are they likely to enter those 2 pieces of information, realize they don't like the results, and try a couple other options? A wizard would be a bad pattern if they have to jump back and forth to see the results of their frequently changing selections.
    – Nathan Rabe
    Jun 17, 2014 at 18:34
  • 1
    Agree with Nathan. It doesn't sound like a traditional wizard. For step 2 & 3 are there lots of complexity there that prevents you from putting these two things together in a single screen? If not, perhaps you should group them together since they are so interconnected.
    – nightning
    Jun 17, 2014 at 20:02
  • @NathanRabe Good question. No, they would not likely go back and change their entry, but they may remove it or add another entry. This might change the dynamic data being presented but they wouldn't likely be changing the entry to in some way alter the dynamic data in their favor or do a comparison between items.
    – tcclark
    Jun 18, 2014 at 16:40
  • @nightning Yes I think a single screen might be the better option. The only reason I'm being cautious about grouping 2 & 3 together is because the data populates after step 2 has been filled out, so I don't want to have too much going on on the page that a user might miss if it happened to change. If something in step 2 is added or removed, or if step 1 is changed, then step 3's data would update and I need to make it very clear that data updated and what item the data is related to.
    – tcclark
    Jun 18, 2014 at 16:42

1 Answer 1

Reset to default
2

This might not apply to your case but...

Depending on the complexity of the form, I'd suggest maintaining a fixed bar (top/bottom but visible) with the possibility of navigating directly to the desired step whenever needed. Please note that for this approach to be user friendly, the user shouldn't see this as 'jumping back a step' but more 'alternating between steps' - meaning that the information input in the last step shouldn't need to be reentered.

example

I understand the trick here is that the information presented in the last step is dynamic and dependent. Could this summary be an independent step - kind of a confirmation page instead of integrated as part of the form?

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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