Comparing web forms: A progressive form vs. a wizard

Stephen Cauffman
PatternFly
Published in
8 min readFeb 11, 2020
3 hands pointing at a laptop screen
Photo by John Schnobrich on Unsplash

You probably run into web forms all the time. These forms usually involve step-by-step tasks, like submitting your information when buying something on Amazon or installing new software. You most likely don’t think too much about them because you encounter them so frequently. And maybe you haven’t thought about whether there was an optimal way to present a step-by-step task. But the PatternFly team has.

We recently conducted some research on the wizard form and the progressive form component. We were interested in whether or not the progressive form was something that should be prioritized for development. In this study, conducted by Red Hat’s User Experience Research team in conjunction with the PatternFly team, we compared the two forms and determined if there were any differences in user performance, user perceived task difficulty, and user preference.

Let’s walk through it.

Background

Within the last few months, the Customer Portal troubleshooting tool team and the OpenShift Dev Console advocated for an alternative to the wizard, a PatternFly form component for sequential task forms.

Here’s how it works: The wizard presents steps of the task flow one at a time, either in a modal pop-up or right in the page. You would then use either Next or Back buttons to navigate within the wizard.

The alternative is known as a progressive form.

The progressive form differs from the wizard because it presents all steps of a task flow on the same page. You’re then able to either press Next or Back, or you can scroll through the form to each step in the sequence.

These two forms sound pretty similar to each other in terms of function. So as mentioned earlier, we wanted to see if the progressive form should be prioritized for development. The best way to do that? A UX research study!

For this study, we were specifically interested in:

  • User performance.
  • User perceived task difficulty.
  • User preference between the two options.

Our process for testing for these differences looked a little something like this:

Method

For this study, we used a mixed methods approach to data collection, which involves a combination of quantitative and qualitative measures. This way, we could make sure that the data gave a complete picture of how users were interacting with and perceiving each form.

Participants

We recruited seven participants from Red Hat. They came from a wide variety of backgrounds, ranging from customer experience to business strategy consulting. No prior experience or product experience were necessary for participants to complete the tasks. And we were grateful for their time, so we gave them $10 Amazon gift cards.

Materials

The mockups for the progressive form and wizard were both completed in UXPin. The mockups were clickable and interactive so that users could fill in information as they went.

Example of a wizard webpage
Example of wizard page
Example of a wizard webpage
Example of wizard page
Example of progressive form screen
Example of progressive form screen

To administer the tasks and questions, we used a Qualtrics survey. The survey flow was set to randomize which form participants received first.

Tasks

The participants were given two tasks to complete in each mockup. The order of these mockups was randomized, but the order of tasks within each mockup was not randomized. This way, the data can show us any performance improvements as participants become more familiar with the two forms.

We borrowed tasks from OpenShift documentation (which was for a wizard to create a virtual machine). Each task required the participants to create a virtual machine with certain specifications. Here’s an example:

Task 1: Create a VM using a fresh RHEL install using the ISO file RHEL.iso and the following settings:

  • The version should be the most current version of RHEL, 16GB memory. Make sure it is configured to operate as a server with the name TPS Reports.
  • Set the network name to Network interface 1, the model to VirtIO, the Type to Local, and the MAC address to 12.99.45.00.23.98.
  • Create 5 disks at 10GB each with the source type as ISO and the interface type as VirtIO.
  • Create a user profile for blumbergh, including a password of your choice.
  • Accept the defaults for other settings. When you are done, check your settings.
  • After reviewing the setting, you realize that you forgot to set the workload profile for High performance. Go back to change that setting, and then when done, create the virtual machine.

Measures

To determine differences between the progressive form and the wizard, we measured participant performance, perception, and preference.

  • Performance: Time on task was measured for each task completed by the participant. All participants were able to complete the tasks, so completion rates were not included in analysis.
  • Perception: Participants were asked to rate the perceived ease of use for each task, the perceived efficiency of each form, perceived efficiency of each form with tasks they were familiar with (i.e., tasks they do in their day to day), and whether or not the form meets the participant’s needs. Each of the perception measures were rated on a scale of 1 to 5.
  • Preference: Participants were asked which form they preferred for sequential task flows, tasks they were more familiar with, and tasks that required 10 or more steps. Along with comparing the progressive form and wizard, data was also collected about whether participants would prefer a progress stepper that shows their progress through a sequential task flow as well as what types of information they would want in the stepper.

Results

Quantitative results

The quantitative measures that were captured for this test were time on task, perceived ease of use, perceived efficiency, perceived efficiency for familiar tasks, and whether or not the form meets the user’s needs or not.

This graph shows the average time on task for each form on tasks 1 and 2. You can see that there are slight differences in how fast participants could complete tasks between the progressive form and wizard. The progressive form had faster completion times in both tasks. On top of that, the time to complete each task decreased for both forms between task 1 and task 2. And the difference between the two forms was further reduced in task 2.

Graph showing time on task for each form across both tasks
Time on task for each form across both tasks

Here you can see the average rating for perceived ease of use for both forms after each task. The figure shows that in task 1, the progressive form was rated higher than the wizard in task 2.

This difference becomes even larger in task 2 where the wizard received the same average rating as it did in the first task. The progressive form received a higher average rating in task 2 than task 1. This indicates that users found it easier to use as they became more familiar with it.

Graph showing perceived ease of use for each form across both tasks
Perceived ease of use for each form across both tasks

For the perceived efficiency questions, the progressive form was rated as being slightly more efficient than the wizard. But these differences are marginal. The same pattern was seen when users were asked whether each form meets their needs.

Qualitative results

Quantitative data only gets us so far. It tells us that there are differences, but it won’t tell us why there are differences. That is where the next set of data comes in. Qualitative data lets us fill in the gaps and get a complete picture of what’s going on. While the quantitative results were not as definitive, the qualitative results showed strong preferences by the users for the progressive form.

When asked which form they preferred for sequential task flows, 6 out of the 7 participants selected the progressive form. Let’s hear what they had to say:

“[I] prefer to be able to see the ‘whole picture,’ and it’s easier to correct things or check completed tasks if you’re not sure you did them correctly.”

“The progressive format with all choices on one single pane of glass makes it easier and more time friendly.”

A follow-up question to this asked which form participants preferred for tasks that they are more familiar with or perform regularly. 6 out of the 7 participants selected the progressive form again. Here’s some feedback from one user:

“Clicking to the next screen takes extra time if I were trying to zip through these. It is also easier to review all choices when everything is on one screen and I don’t need to hit the Back button to review.”

These results suggest that users prefer to have all task steps present instead of navigating step by step as they do in the wizard.

The participants were asked which form they preferred for sequential task flows that involved more than 10 steps. 5 out of the 7 participants selected the progressive form, indicating that there may be a limit to how many steps can be present on the progressive form before it becomes overwhelming.

One participant who selected the wizard wrote:

“To minimize cognitive load, I would like to be presented with smaller chunks of related screens to complete a task with more than 10 steps.”

This finding is something that should be investigated in a follow-up study — there may be certain conditions where a task is too long for a progressive form, and a wizard is more appropriate.

Participants were also asked if they would prefer to have a progress stepper that shows their progress through the task flow. 5 out of 7 participants responded that they would prefer to have a stepper. If the participants responded “yes,” then they were asked what types of information they would prefer to have in the stepper. Participants generally responded that they would prefer to have a percentage complete, step labels, and step numbers. This finding should inform future design work on forms for sequential task flows.

Conclusions

We ended up with a couple key takeaways from this study:

  • The progressive form and wizard were roughly equivalent in terms of performance and perceived ratings of ease of use and efficiency.
  • When asked to choose between the progressive form or the wizard for sequential task flows, most users preferred the progressive form over the wizard.

The data also gave us some other interesting insights. One finding is that there may be a limit to the length of the task that can be presented using the progressive form, but this requires a follow-up study. A majority of users also preferred to have a progress stepper that includes percentage of task complete, step numbers, and step labels.

Our findings indicate that the progressive form is seen as being easier to use and is, in general, preferred. Any further development of the progressive form should also include a progress stepper. Based on these results, we can conclude that despite being roughly the same in terms of performance, the progressive form tends to be preferred by users and can be considered a good alternative to a wizard.

Have a UX story of your own? Send your ideas our way. More writers and fresh perspectives can only make PatternFly’s Medium publication stronger.

--

--