Showing feedback is an essential part of user experience design. When a user takes an action, it should be clear to the user that the action has been recognised by the system and that, as a result, something is happening.
If an action is instant, feedback may mean showing the results of the task or an indicator to say the task is complete.
If an action takes some time – from a few seconds to minutes or longer – showing progress is essential. Progress indicates to the user that something is happening.
Webflow, a website builder, shows four steps when you publish a website:
- Preparing to publish
- Optimizing HTML, CSS, and JS files
- Packaging everything up
- Deploying to CDN
Here is what it looks like in the Webflow interface :
As each step is completed, a green checkmark appears to indicate the step has been completed. Thus, the user not only knows that something is happening, as would be the case with a percentage indicator or a loading wheel, but that progress has occurred on a step.
It can take anywhere from a few seconds to a minute for a site to publish. Showing incremental progress through the defined steps gives me, the user, confidence that things are happening.
As I learn more about design, I realise progress bars are incredibly nuanced. For instance, computers can’t tell if a task will or will not complete, nor exactly how long something will take; they can only estimate completion time, and fail if something goes wrong. This impacts the affordances we can lend a user, and explains why so many progress bars can make progress to 90% of the way and stall even though something is happening.
