Task list

[govuk-design-system]

Use this issue to discuss this pattern in the GOV.UK Design System.

[abbott567]

Thought I'd just weigh in with a tweak we have had to implement for this pattern.

We are currently using it in a case working system and we had an issue where if one agent went in and chose some options that meant the task was not complete, to other agents it looked like no work had been done at all.

So, we needed a way to differentiate between a section that had not been looked at and a section that could not be completed. So we have added a grey 'not complete' badge to say 'yes, i've looked at it, but it's missing some information' vs 'nobody has looked at this section at all'.

[peteblakemore]

Interesting to see you've also removed the numbers from the side of each task, @abbott567 . On the service I'm working on we will also use a task list, but the tasks needn't be completed in order, so this approach would work well for us.

[kubabartwicki]

We just finished a mission in which we worked on a part of Digital Marketplace where users can search for cloud hosting, software and support. We redesigned an existing task list and put it at the start of the service: https://www.digitalmarketplace.service.gov.uk/buyers/direct-award/g-cloud/start

---

Things we knew before

• Users aren't aware of how the service works which results in non compliant behaviour
• Some use the service twice a week, some will only ever use it once
• Tasks in the service include complex interactions, such as searching and filtering
• Tasks need to be completed in order

Things we learned

Put a static version of task list at the start of the service

We had a hypothesis that task list would be a great way to explain how to use our service. To test, we replaced our old start page which had a search bar on it, with a task list.

This performed really well: it made the process transparent and cleared up a few confusions. We previously tried doing this with a start page pattern, but users found it annoying and a barrier to search.

Our static task list has no badges and is treated as static content rather than something users can interact with.

Put guidance alongside tasks

We modelled our task list around the idea that each step has a single task associated with it and some guidance. This is different to the task list in GOV.UK Elements, which assumes that each step consists of a bunch of tasks.

Doing it this way ensures that users can access guidance at all times but they don’t to tell us they read it each time they use it.

Use badges

“Completed” and “Can’t start yet” worked really well. They helped users realise what to do next and a few times made them realise that the page they are looking at is interactive and changes as they walk throughout the process.

It’s not always obvious what the steps are

The hardest part of this work was getting the steps right – we tested 5 different iterations of the task list before we ended up with the 5 steps we have now.

The most interesting one here is step 3, which refers to a lengthy offline process which a lot of our users currently get wrong. Returning users found it annoying to have to confirm "I've done this" each time, so we had to tweak the way the step is explained and acted upon.

We went with “Confirm you have read and understood how to assess services”. This means that the step is about reading our guidance about a process, rather than completing the process, which can take weeks and has very blurry edges as to where it ends and begins.

[PeteWilliams]

Thought I'd log a couple issues we've seen In the Civil Money Claims project. The first of which has had quite serious consequences for the user involved, and led to a complaint.

'Completed' marker misleading
A defendant in the live service was responding to a claim saying that they owed some money. They completed the required task in order to defend their claim, then were returned to the task list where that task was marked ‘completed’. The user thought this meant they’d filed their response, so they didn’t continue to the ‘Check and submit your response’ task. As a result they were issued with a CCJ for not responding.
This user was partially sighted and using a screen reader, but we think that may be a red herring, as apparently this has come up in testing with sighted users too.

Users not completing all sections
Over 20% of users in our live service got the error telling them to complete all tasks before continuing.
We've seen a few causes of this in testing:

• Some users skip anything in 'Before you start'
• If a task is phrased as a question, and the user's answer is 'no', some will think they don't need to fill it in
• When the task list is dynamic - ie new tasks appear when you select certain things in other journeys - users often don’t see the new task and just skip it, especially if it was at the end of a section
• Some users simply do not realise that they have to complete all the tasks before they can continue

Any thoughts on how to resolve these issues would be much appreciated. My current thinking is to try adding 'You must complete all tasks before continuing' to the top, which may help both issues if people actually read it.

[kr8n3r]

Has anyone tried/tested by moving the tag to the left, below the task description?

[charge-valtech]

Working on the "Apply for a Blue Badge" service.

We started testing with this in our prototype from last week. Overall, it's tested really well - it helps users realise how far along the application they are, and prepares them for what is coming up. We take users to the task list for the first time after they complete the "Check eligibility" section. 5 out of 5 users understood this on first land, they see the "Completed" tag and understand what the next section is that they need to complete.

One issue we did see though, was once a few tasks had been completed in the list, it becomes more difficult to see the sections that are incomplete. The page becomes more difficult to scan.

We are toying with the idea of a subtle "Not started" tag which is a light blue or something.

All users spotted and understood that they needed to hit "Submit and pay" at the end of the list for the application to be submitted.

[anna-kayPA]

We use the tasklist in the probate service.

User needs

• Know where I am and what is coming up
• Take breaks if required

Differences between ours and the beta tasklist

including why and how we've tackled it

Users can't complete items in any order. They can't for example pay before they've filled in the application.

• we use a start button per section rather than a text link. Users understand green buttons as it provides clear guidance of what to do next. If they return to the service mid task, the button says "continue"
• we use the lozenge "can't start yet" (replicated from the digital marketplace design by @kubabartwicki) so users know that they can't skip ahead - they can't skip ahead because we use information from earlier questions to decide what to ask in later sections.

Our service is in public beta and we have had a tasklist in our service for over a year.

Users will have been screened and created an account before they land on the tasklist.

Ongoing challenges

For some users, there is a step in the process where they need to wait for someone else's response before being able to proceed to the next task. When this happens, we do not show the green button. Instead we include content below that section header informing the user that they can't proceed yet. We believe this causes users confusion until they read the content. We are working on a way to help users easily understand that they need to pause for now.

[kubabartwicki]

@PeteWilliams

That's a really interesting issue – I wonder if it's to do with users recognition of the steps as things they need to do? That's what we struggled with the most on Digital Marketplace (#72 (comment))... eg maybe if "Submit" was more about "Submit response" and "Respond to claim" about "Prepare response" it could be more effective and clearer to users what the badges mean and refer to? 🤔

[helenadt]

@PeteWilliams it seems like there may have been a number of things at work there. I have not used this pattern so can only add some thoughts.

I wonder if it is worth trying to reintroducing the green button for the final task? I.e. for 'Check and submit a response'. Might make it clearer how you finish. Has anyone tried this?

It also feels like there might be something about the first set of tasks being 'Before you start'. By being at the task list am I not already started?

[sunilkathare]

We are using the task list pattern to design an online version of the C110A application, which is 22 pages long, where local authorities can apply for a care, supervision or emergency protection order.

Local authority solicitor or legal assistant can use this application to start the process to place a child at risk of harm under the care of the local authority.

Why we are using this pattern?

• Users can see the whole form, not just the parts they’ve answered

During user research we found users liked to see all the sections in the application in the form. One question per page pattern, shows just the first few questions. You must answer these before moving to the next section. It can be reassuring to know all the questions. So, you know what to do. It helps to know what information you need to gather if you know that questions.

• Users can answer questions in any order

If you can’t yet answer question 3 – maybe you are still gathering information – you can still answer question 8. One question per page pattern online forms progress linearly – you must answer one question before seeing the next. With the task list pattern you can answer question in any order.

• Save and restart applications

With the task list pattern you can add information as and when you get it. For example, in international cases, you have to wait till you get important information. As it is not linear, you don’t have to enter all information in one go.

• Save time

Users don’t need to go through all the questions in the application form and can skip entire sections like the international section. Users don’t need to waste time saying no to questions that they don’t need to answer and fill only sections they need to. Fewer pages to load and fewer buttons to click means that they end up saving time!

[quis]

We’re trying this variation of the task list pattern on GOV.UK Notify:

There’s some more detail in this pull request: alphagov/notifications-admin#2250

I’ll update this comment once it’s been live for at least a month and we can measure how effective it’s been.

[charge-valtech]

We noticed screen reader users getting a bit frustrated by having to tab through every section each time they came back to the task list.

I've prototyped this solution to see if it helps things. A hidden link similar to the "Skip to main content" that takes the focus to the first incomplete link on the page.

Screen recording of it in action