Progress bar
Display user progress through a form flow.
Last updated
Display user progress through a form flow.
Last updated
Progress indicators such as completion bars and step counts are helpful in giving responders a sense of how far along in the flow they are. Especially for longer flows, showing progress indicators can help conversion, as user expectations are set correctly from the outset, and feedback is given as every step is completed.
To enable progress bars, see Progress indicators within the style set editor.
The sizes, colors, and other aspects of these layout types can be further customized within the style editor.
You can use the Vertical position in the Progress Indicator menu within the style editor to change the placement of the progress bars.
You can also use the Layout editor to change the positioning of any of the components, including the progress indicators.
By default, progress indicators show users the position of the user's current step within the total number of steps within the flow.
In the case that you have a large number of steps, it might be useful to indicate progress by groups, by selecting Groups under Count steps or groups?
If your flow has steps which are only enabled based on a condition, the number of steps available to the responder can change based on the answers that they provide.
To avoid having a progress indicator that jumps around, the progress indicators always include every step in the denominator - the percentage completion is just current step index / total number of steps
This is why sometimes the progress bar may jump: the responder is skipping over steps that were conditionally disabled.
Note that consecutive steps that all use the same variables as their condition but check for different values of that condition are collapsed together when calculating progress, as a responder would only ever be able to access one of those steps.