When to use this pattern
This interaction allows a user to add single or multiple items, check they are correct - and provide an option to add more. This pattern can be used to add people to an application, - add items to a list or upload files.
+ and provide an option to add more. +This pattern can be used to:
+-
+
- add people to an application +
- add items to a list +
- add multiple files +
Follow this pattern:
- to help confirm an action @@ -54,12 +60,31 @@ const Page: FC
How it works
-When adding multiple items of the same thing, the pattern should:
+Add multiple items
+To help users add multiple items of the same thing, the pattern should:
- remember previous choices
- give clear guidance on the flexibility of choices
Add multiple files
+Allow users to add files one at a time, check the files on a subsequent screen, and add more if required in an add multiple files loop.
+If document categorisation is required, allow the user to select the document type before uploading the file.
+Where possible, split tasks up into shorter flows, with 'Check answers' screens at the end of each mini task, rather than after a long task.
+ +Research
+In four rounds of research with external users, we found:
+-
+
- displaying the uploaded documents on a subsequent screen reduces the cognitive load for the user and enabled users to upload multiple documents without encountering issues +
- users became familiar with the loop of categorising and adding more documents and were reassured when they could see them being added to the list each time +
- asking the user to input additional information relating to the document they are uploading prior to the upload document step worked better +
- splitting tasks up avoided issues and confusion because it gave the user more flexibility at each step +
More research is needed with users with access needs.
+Accessibility
If your service uses this pattern, let us know of any insights you have on accessibility considerations.
@@ -69,6 +94,7 @@ const Page: FC- Firearms licensing
- Refugee integration loan +
- Manage asylum claim
More research is needed. If your service uses this pattern, get in touch to share your user research findings.
@@ -77,8 +103,10 @@ const Page: FCThis pattern needs improving. We need evidence about:
- how to write for this pattern -
- variations for adding multiple smaller pieces of information
- alterations for internal caseworking systems +
- adding detailed information about multiple things in a long task flow or as part of a longer form +
- access to needs testing +
- how users with access needs respond
To contribute, add your thoughts and research findings to our GitHub discussion, or follow our contribute guidance.