Form progress indicator

Form progress

Form progress indicators (formerly known as screen flows) are designed for a single user completing a multi-step process.

Using a multi-step process can simplify a complex form. Follow these guidelines when doing so:

  • Long forms can benefit from being split into steps. If your form is greater than x2 of the most common screen height, then consider steps. (On desktop, this is ~1600px or 25 lines. On mobile, this is ~800px or 12 lines.)
  • If splitting into multiple steps, use 3-7 steps. Avoid two-step indicators, or screen flows with too many separate steps.
  • Put step breaks at logical points. Do not force a form into steps, instead break the flow at natural points.
  • Consider adding a “review” screen as a final step if collecting a large amount of data that would be difficult to edit later. Review screens should show read-only data in the same format as the final review data.

On mobile devices, both tabbed and tree indicators render the same way.

Last updated: Oct 2020