Form progress indicator

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

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

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.

Last updated: Dec 2019