Long, complex online forms can make navigation difficult for users.
For example, online order forms like the one in the following image require a lot of data. Users must enter contact information, the items to buy, and the payment method.
A multi-step form represents a single assignment completed by a single user. It is a guided, linear workflow using related UI screens.
Note: The default Create process in the Create stage is a multi-step form. This multi-step form displays as a modal by default.
You can configure a multi-step form to help users complete complicated tasks. For example, instead of having a single, confusing online order form, configure a multi-step form. The multi-step form presents information from the online order form in multiple focused and concise screens. In the following example, the user navigates to different screens by using the navigation menu.
Multi-step form navigation
Multi-step forms provide three templates with different navigation styles: horizontal, vertical, and standard navigation. With horizontal and vertical navigation, users navigate screens using the navigation menu (oriented horizontally or vertically). With standard navigation, users navigate through the screens using Continue and Back buttons.
From the navigation menu, users can navigate to available screens in any order. Users can enter, save, and change information on screen in any order as long as the screen is not submitted. The Finish option is available on the last screen of the multi-step form.
The online order form example above uses horizontal navigation. In the center of the following image, slide the vertical line to view vertical navigation and standard navigation differences.
Check your knowledge with the following interaction: