Pages Task list pages
Experimental

This pattern is currently experimental because more research is needed to validate it.

Task list pages help users understand:

  • the tasks involved in completing a transaction
  • the order they should complete tasks in
  • when they have completed tasks
A screenshot showing an example of the task list page, includes a heading, and three grouped sections that each contain tasks, some of these tasks are marked as completed.

When to use this pattern

Only use a task list page for longer transactions involving multiple tasks that users may need to complete over a number of sessions.

Try to simplify the transaction before you use a task list page. If you’re able to reduce the number of tasks or steps involved, you may not need one.

How it works

You should show a task list page:

  • at the start of the transaction
  • at the start of each returning session

When using a task list page in your service you need to:

  • group related actions into tasks
  • show the status of each task

If there are lots of tasks to complete, you might also need to group them into sub-sections.

Show the status of the task

Whenever you show a task list page, make it clear to users which tasks they’ve completed by labelling them ‘Completed’.

A screenshot showing a completed tag next to a list of tasks

Group related activities and questions into tasks, for example, ‘Provide financial evidence’ and ‘Give medical information’. This will help users understand and plan what they need to do.

Where possible, task names should:

  • describe what the task or activity will involve
  • start with verbs, for example, ‘check’, ‘declare’, ‘report’

Group tasks into sections

If your transaction involves lots of tasks, make it manageable by splitting it up into sections that represent stages in the process.

For example, you could group all tasks which help users find out if your service is right for them in a section called ‘Check before you start’.

Where possible, allow users to complete tasks in any order. This will help them plan their time and complete sections as and when they can.

Research on this pattern

Read a blog post about testing and iterating the task list page pattern.

Next steps

More research is needed to find the best way to represent:

  • which task to complete next
  • tasks that cannot be completed yet
  • partially completed tasks

Research is also needed to understand whether it’s more helpful to take users back to the task list page after each task, or to the next task in the sequence.

Get in touch

If you’ve got a question, idea or suggestion share it in #govuk-design-system on cross-government Slack (open in app) or email the Design System team on govuk-design-system-support@digital.cabinet-office.gov.uk

Discuss ‘Task list pages’ on GitHub