Multi-Step Forms & Wizards
A team splits its thirty-field application form into five steps. The screens look calmer in review. Six weeks later, fewer people finish than finished on the single page.
Long forms lose people at every step. Learn to keep them, while you travel.
Listen to the full Multi-Step Forms & Wizards course on DesignPath
Nothing was removed. The fields are the same and the copy is the same. What changed is the line at the top reading "Step 1 of 5", which states the length out loud on the first screen. Meanwhile somebody on step four goes back to correct a date, returns, and finds step four blank.
Long forms are worth attacking. Baymard Institute's checkout research puts a typical US checkout at close to twelve form fields. Roughly a fifth of the people who abandon one say the process was too long or too complicated. Steps are one answer to that. They pay off when the cuts land on real boundaries, the indicator tells the truth, and nothing is lost between the screens.
Anatomy of a Step Flow
A step flow is a long form with structure added to it. The structure is the thing to name, because a single page never needed any of it.
The Parts
Seven, and a design file usually shows the screens and the buttons.
The steps themselves. The step boundary, meaning the moment between two of them, where checking and saving happen. The progress indicator. The forward and back controls. The save point, which decides what survives if somebody leaves. The review screen, where the whole answer is shown before it is committed. And the submit, which is the only irreversible part.
Linear or Branching
Two shapes, and they behave differently enough to name.
A linear flow gives everybody the same steps in the same order. A branching flow shows steps that depend on earlier answers, so two people meet different screens and different counts. Branching is usually right, since asking somebody questions that cannot apply to them is the fastest way to lose them. It also makes the progress indicator harder, which is article 5's problem.
What Lives Between the Screens
The parts with no visual are where the damage is.
Nothing is saved unless somebody decided when. Nothing is checked unless somebody decided where. Going back costs whatever the flow was built to preserve. A session that ends takes with it everything that was not written down. Those four sentences are articles 6 and 7, and none of them appears in a screen-by-screen design.
The Thing That Does Not Change
Splitting a form removes no fields.
The same questions are asked, so the work is identical and only its packaging moved. What changes is how long the task looks, where mistakes surface, and how much somebody loses when they stop. That is the whole trade, and article 3 is about deciding whether it is worth making.
Pro tip: Draw the boundaries rather than the screens. On one line, write for each gap between steps what gets checked and what gets saved. The gaps nobody can answer are where the flow leaks.