The audit found 2 main issues with the usability of the file upload component used in the service.

Missing notifications

When users carry out an action, they expect to be told if that action was successful. That is not the case when users upload a document, they are not notified when the upload is successful. It is only when they move to the next page, that they can see it has successfully uploaded.

A cognitive tester found it confusing to see that even though she had uploaded a file, the page still said no file uploaded.

Screenshot of previous file upload function, it shows the file selected but not successfully uploaded.

Screenshot of previous file upload function, it shows the file selected but not successfully uploaded

Error prevention

To minimise errors all required information must be given to a user in text, before submitting a document. The file upload function on this website does not inform the user of the file type required.

It is only after submitting a file type that is not allowed, that the user receives a notification.

Screenshot of the error message when an unsupported file type is uploaded, after an upload attempt.

Screenshot of the error message when an unsupported file type is uploaded, after an upload attempt

Action required

Provide notification that the file upload was successful.

Clearly state accepted file types before submitting or uploading a document.

Proposed solution

List supported file types before the user uploads the file.

Screenshot of the new upload function, now including a list of supported file types before an upload attempt.

Screenshot of the new upload function, now including a list of supported file types before an upload attempt

After the user chooses a file, they will be presented with the option to 'Upload the file' or 'Continue without saving'.

If the user clicks on 'Upload file' and the upload is successful, they will be presented with a successful notification banner. They will also be given the file name, size and an option to delete it.

Screenshot of the new file upload function, with a green banner showing the file has been successfully uploaded as well as the file name and size.

Screenshot of the new file upload function, with a green banner showing the file has been successfully uploaded as well as the file name and size