The progress bar on mobile screens ensures that participants can easily track their position within a survey or quiz—no matter the number of steps involved. By reducing uncertainty and offering immediate feedback, the progress bar helps maintain user engagement and improves overall completion rates.
Key Benefits
Greater Clarity: Helps users understand how much of the form is left, minimizing drop-off.
Higher Completion Rates: Progress visibility improves motivation, especially on longer or multi-step forms.
Professional Aesthetic: Customizable options ensure the progress bar complements your overall design and branding.
How to Enable and Customize the Mobile Progress Bar
Open Any Survey or Quiz
Start by accessing the specific survey or quiz you’d like to enhance from the relevant builder.
Navigate to Styles > Footer
Once inside the form editor, go to the Styles tab in the top navigation. From there, select the Footer section. This is where layout and visual elements related to the form’s footer—such as navigation buttons and visual indicators—are managed.
From here, be sure to switch to the mobile view.
Toggle “Enable Progress Bar”
Locate the toggle labeled Enable Progress Bar. Simply switch it on to activate the progress bar for mobile users. This toggle allows you to enable or disable the feature per form, giving you flexibility to use it only where it’s most beneficial.
Customize the Progress Bar Appearance
After enabling the bar, a set of customization options will appear, allowing you to match the progress bar with your brand identity or form aesthetics. You can fine-tune the following elements:
Step Label Text Style: Modify the color of the step indicator text (if shown) to ensure readability and consistency with your brand’s typography.
Fill Color: Choose the color that represents completed steps. This helps users instantly recognize how far they’ve progressed.
Inactive Color: Select a shade for steps yet to be completed. Using a neutral or low-saturation tone helps maintain focus on the active section.
Preview the Mobile Experience in Real Time
Use the preview feature to see how the progress bar will appear and function on mobile devices. You can copy and paste the preview link in a browser on your mobile device or view the live changes in the builder.
This live preview updates instantly as you make changes to colors or text styles, allowing you to achieve your desired look.
Whether you're collecting feedback, running assessments, or creating lead capture flows, this functionality ensures a seamless and intuitive experience for mobile users.