Chapter 5
Chapter 5
Show Progress Towards the Goal
ARE WE THERE YET???
🎂 We've saved the best for last. Let's streamline billing and checkouts!
The Problem
The longer a form is, the more likely a user is to bail. The best solution is to require as little information from the user as possible. However, sometimes quite a few pieces of information are truly required.
The Solution
The simple solution in this case is to break the input fields up across multiple screens. Keep the fields on each screen related.
As is so often the case in design and engineering disciplines, a solution can introduce its own problem. The user is no longer overwhelmed up front, instead they begin to feel strung along.
The solution to this new problem is simple.
Show progress toward the goal.
This can be as easy as a progress bar and a bit of text.
Another potential solution is to keep all but the current section collapsed.
You might have noticed that the above looks quite similar to the layout of Amazon's checkout process. There's a reason they made it that way. That form results in them getting paid more.
Take Action Now
Review input forms in your application.
If numerous fields appear on a single screen, consider breaking them up into logical groups.
Show a single group at a time.
Show the user where they are in the process.
Congratulations
You've broken larger input tasks up into bite sized pieces while still keeping the the big picture visible!