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.
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: