hierarchy - If and how to break a long wizard into main steps and substeps?

I am given the task to design a lengthy web form that asks a user to enter a lot of information on a technical installation he planned/built. Given the nature of the required data (there are different chunks, nearly all fields are required, and there are some dependencies that suggest a certain order) I organized into a wizard. However, after dividing the process into clear main steps (the easy part) I was still left with enough input fields to justify further grouping.

In this "second level" of data input, however, chunks are not necessarily ordered or dependent and I expect there to be more going back and forth (although most users will just go ahead from group to group). In consequence, I considered

a) a tabbed structure which allows "free" jumps, while still hinting at a from-top-to-bottom approach as the standard procedure and

b) a secondary wizard-thingy with another set of "substeps", which is more rigid

EDIT: c) another possibility would be to create a secondary level right inside the wizard to illustrate the substeps. It would work just as b), but communicate this with different visuals.

This is a similar question to this one, and basically my suggestion is a combination of the two approaches in the accepted answer, however, they are there presented as alternatives, not in combination. It is also one approach to answer this question about long wizards, but one that wasn't discussed there.

My questions are:

• Does anybody have experience with this kind of two-tiered approach? Are there possible pitfalls I have to be aware of, or is there something completely inadvisable about this? (some reading suggests not to mix tabs and wizards, but this refers mostly to "don't use tabs when the functionality is wizard")


• Instead of tabs I also considered an accordion style for the secondary level (much like this jQuery example or this answer here). However, other comments I read around here state that accordions are "lame" or "old school" or "only for mobile" without much detail beyond that. So what would be actual drawbacks in this given situation?


• I currently lean towards the rather rigid two-level wizard. As I said, most fields are required and important and I have not yet a found a need to jump ahead. In this case I wonder how to design the forward/backward navigation. The current Next button is supposed to jump to the next substep, while the last step contains the "to the next main step" button. However, I'm not quite satisfied with this yet as it may confuse users. Any ideas, experiences?

Answer

If I had to choose I would vote for the third of the presented options. It has more intuitive progress indicator that feels the most natural (in the set of proposals you presented).

If I had to suggest an approach to a long wizard problem I would propose to reverse the relation: do not force them to fill all the required information, just allow to add an installation info entry and mark it as not complete ("your installation info is 10% complete"). This allows a user to enter the information in piece-by-piece style while she is pulled towards completion of the information, rather than forcing to fill all the info at once. It also simplifies a design of the installation "profile" page.