Skip to main content

Work in progress

This page is a design preview. It may not contain the latest guidance and may not behave as expected.

Current guidance can always be found at design-system.dwp.gov.uk.

Cookies on the DWP Design System website

We use some essential cookies to make this service work.

We’d also like to use analytics cookies so we can understand how you use the service and make improvements.

View cookies
Components

Timeline

A record of past events for case management systems

Use the timeline component to show a linear record of what has happened.

The timeline component has only been researched on agent-facing services.

Open in new tab

When to use this component

Use the timeline component when you need to display a record of events (or other information) in time order: for example, a history of actions taken on a particular case.

The timeline should show a brief overview of what has happened at each point and should not be used to give in-depth information.

When to consider something else

The timeline is designed as a way of presenting static information, not as a working environment. Do not use it as a container for important tasks or work, as navigation for your service, or as a progress indicator.

Do not use the description to contain full details of an event or large amounts of text: this should be shown in a separate place and linked to if necessary.

Design goals and metrics

The goal was to develop a standard component that could be used in multiple DWP services, saving time and making the user experience more consistent.

Success metrics for this component could include:

  • task completion rate
  • task completion time

Services using this pattern

The previous version of this component has been used in agent-facing screens on a number of DWP services, including:

  • Bereavement Support Payment
  • Access to Work
  • Prepare for Universal Credit
  • Support for Mortgage Interest
  • New Style Jobseekers Support Allowance

We have worked with those teams to understand their needs for the updated component but need more research insights from live services.

Discuss on GitHub

There is a public discussion for this topic on GitHub where you can share anything you think might be useful. Discuss Timeline on GitHub.

Get support

Need help implementing this in a prototype or production build? Get support from the Design System team.

Give feedback

We depend on insights from real projects to update and improve the design system. If you use something we made, tell us how it went.

Could we improve this page?

Send questions, comments or suggestions to the DWP Design System team.

Last updated: