Not just an error message...
During the work for the launch of Student Loans Company's new finance service, our third party contractor asked me for help with an error message. They wanted an error message for when users put in the wrong customer reference number (CRN) in a question. The error was also supposed to tell a user the correct format of the CRN at the same time.
Before
Analysis
When I looked at the prototype our contractor made, it was obvious there were some serious GDS and accessibility issues. In its current format, it would also be impossible to create the error message they wanted, without causing user confusion.
​
Issues:
GDS style guide:
This uses language that could be simplified: Using "give us" instead of "provide". Using negative contractions, which is against GDS standards.
​
Clarity
There's no hint text to tell a user what a customer reference number looks like. The error message the contractor wanted would only tell them it was 11 digits long after they'd already made the error. We cannot hide user guidance behind an error.
​​
Repetition
The radio buttons both replay the question back, despite being immediately below the question. This increases the cognitive load on users. It's only useful in situations where the options are quite detached from the original question, and a user needs a reminder of their selection. (And in those cases, you can probably rewrite the question to be better to stop that!)
​​
No save state for user input
The user puts in their own data for the customer reference number (CRN) field. In those cases, they need a 'save and continue' option, so they do not lose their data.
​
Conditional reveal
The most serious issue with this prototype was using a conditional reveal to ask 2 questions in one. We were asking if a user had their CRN, and then immediately asking them what it was.
The solution
There were 2 ways to deal with the conditional reveal issue.
We could either:
1. Split this question into 2 pages, with a single question on each page. The first page asks a user if they have their CRN​. If they select 'no', they're taken to the usual 'no' user journey. If they select 'yes', they're taken to a second page that asks them to give us the reference number.
2. We keep with one page, but it just asks for the CRN, with a fallback option to say they cannot give it to us. In those cases, they're taken to the usual 'no' journey.
​
The single page option might have technical challenges in the backend development. So I created both options.
Option 1
We split this into 2 questions on 2 different screens. This meets Government Digital Service (GDS) standards of 'starting with one question per page'. This helps the user understand what we're asking them to do, and helps with accessibility. As it reduces burdening users with any cognitive overload.
​
Question 1: Ask the user if they can give us their customer reference number (CRN). If they answer 'no', they can be directed off to the journey for users who do not have their CRN.
​
If they answer 'yes', they can be taken to the second question, where we ask them to put in their CRN.
After
After
Option 2
There is still a way to combine this onto one page, if the developers are able to implement it this way.
The single question on the page now just asks a user what their CRN is. There is a text box for them to enter their number, and there is validation on the field.
Underneath this is the fallback option. So, a user either enters their CRN, or they tell us that they do not have it.
If a user does not have their CRN, they can just check this box, and are sent through to the 'no CRN' user journey.
In this option, I've also added the 'save and continue' option. This is because a user is inputting data into that field, and we need to make sure they do not lose it.
Knock-on effects
The original request was for an error message to users who do not put in their customer reference number (CRN) correctly. As I progressed with the design, it was obvious that these options now needed more error messages to cover the new situations.
​
1. The advice on the CRN format has been moved to the question. It's not hidden behind the error message now. This means that when it's reflected in the error message, it's easier for a user to understand how to fix it. It's also significantly less frustrating, as they knew the format before they entered it.
​
2. In the one page option, there needs to be an additional error message. There needs to be an error message where the CRN's in the wrong format, but also one for where they do not enter a number or select that they do not have one.
Option 1 error messages
Question 1 needs to highlight where they've not chosen an answer. So: "Select if you can give us your customer reference number"
Question 2 needs to highlight where the CRN is not correct. So: "Enter your customer reference number in the correct format".
​
The help text now tells the user a CRN should have 11 digits, and gives an example of how they look. This helps the user identify their number on any correspondence we've sent them, and means the error message makes more sense.
Option 2 error messages
I gave the 2 page option their own error message on each page to cover them. But, the one page option came with its own challenges. There was now a situation where a user could make 2 mistakes on a single field.
​
They might not:
- enter their customer reference number
- choose the fallback option to say they do not have their CRN
​
If a user did these at the same time, it could be very confusing if 2 errors trigger on this field, or overlap each other.
​
So, in this case, I created a different error message for the 2 different situations. The user cannot trigger both errors at the same time, as either the fields will be blank, or the CRN will be wrong.
​
Error 1: Where the user has not chosen an option: "Enter your customer reference number or select the checkbox to tell us you do not have it".
​
Error 2: Where a user fails the CRN validation: "Enter your customer reference number in the correct format". In this case, the CRN field also gets highlighted in red to meet GDS standards. There is explicitly an issue with this field, so we highlight it in red to help the user see it easier.
Other things to think about
All GDS error messages are built with an 'error summary' at the top of the page. Error summaries highlight all the errors on a page, with direct links to the fields that need to be fixed.
​
While acronym for customer reference number has been spelled out in full on the page, the error summary will be seen separately. As a result, there's a risk a user sees 'CRN' without any background information. So, I've spelled out 'customer reference number' in full for the error message.