This roundup article summarises form-related design patterns presented in this collection so far.
Form Fill Progress Indicators
Especially on smaller touch screens, forms may exceed the dialog’s height. In that case, users may lose overview if the form’s validation requirements have been fulfilled and which are still pending.
Many forms require fields to be filled in. Given the virtual keyboard and a set of mandatory and optional fields it may become difficult for users to keep an overview of what fields have already been filled in and which still need to be completed.
When using the form fill progress indicator pattern it must be clear how many steps are left to complete the form.
The example screenshot shows the form fill progress indicator used to indicate the number of empty mandatory fields; however, other validation criteria could be used.
The progress indicator should be displayed in a separate area, which is always visible and not disrupt the workflow.
This pattern should be used only if not all fields of a dialog or a form are visible when the virtual keyboard is displayed.
Error prevention, error recovery
The progress indicator helps to avoid unnecessary steps and enables them to return to tasks of higher priority. Because form entry most likely is not safety-relevant, it must not interfere with safety-critical functionality.
Feel free to provide your comments, reports of usage of this pattern, or feedback in general!Show all articles