Last week, someone paid me to review their form flow.
One thing they wanted advice about was interruption pages.
Coincidentally, the following day the GOV.UK Design System added the interruption page pattern.
Interruption pages are designed to pause the user within a journey - usually to warn them about a possible mistake or give them important information before they continue.
Here’s an example from the GOV.UK Design System:
It has:
- An h1 heading to ask a simple question
- A paragraph to explain why the question is being asked
- Two actions: one to say it’s correct, the other to change it
All within a blue panel.
I love the GOV.UK Design System. I use it and defend it all the time.
But on rare occasions I think it could be better.
The interruption page is an example of that.
Here’s four reasons why (plus what to do instead):
Reason #1: The interruption page includes multiple actions to pick from
Giving users two ways to proceed means the onus is on the user to slow down to pick the right one.
You might say that’s a good thing, because the idea of the pattern is to make users pause.
But firstly there’s a better way to do it (I’ll get to this shortly) and secondly:
Reason #2: Users may accidentally click the primary action
This can happen if the user:
- has memory issues
- is in a rush
- is stressed
- loses focus
Users only tend to slow down when they must or want to.
And the interruption page pattern makes this worse because:
Reason #3: Interruption pages do not look like part of the flow
Interruption pages put the content inside a panel.
This makes it look like a banner or advert. Something to dismiss, rather than essential for completing the task.
As a result, users are more likely to mindlessly proceed.
Reason #4: The button label is unconventional and doesn’t stand alone
The button says “Yes, this is correct”.
But this is unconventional and doesn’t make sense without reading the rest of the page.
Buttons should describe the action being taken.
But most importantly:
Interruption pages are unnecessary
A form is just a series of questions.
This is just another question.
Screens should always be designed to pause the user so that they make a clear, conscious decision.
You don’t need a visually different screen without form controls to do that.
You need a good question:
- It uses standard radio buttons which require a conscious decision
- There’s a single path through the form - if the user skips the question, they get an error
- It looks like a normal page, not something to be dismissed
I understand the appeal - I’ve been drawn to the interruption page pattern myself.
But whenever I’ve been close to using it, I stop myself and use a standard boring pattern. Then I test it in research to see if there are issues.
So far, I haven’t found any.
To be fair, the guidance says not to use one unless:
“there’s evidence of a clear need to pause the user journey”
But I haven’t seen any evidence that the boring patterns in the GOV.UK Design System won’t work for this.
I’ll be adding this as a new rule to the Form Design Mastery handbook, bringing up the total to 81.
If you’d like access to the other 80 rules (with many more to come), then you can get the handbook as part of Form Design Mastery: