Skip to main content

Pagination for secondary care appointments

Posted on

The problem

Users accessing secondary care appointment lists in the NHS App can see hundreds of cards in one view. Recent analytics showed:

  • 13,120 users had more than 10 appointments in the past year
  • some saw 170 to 200 appointment cards on a single screen

This leads to visual clutter, cognitive overload, and slow page loads. We needed a scalable solution to make content manageable and performant.

Screenshots of the pages that require PVC

Past work

The NHS App already uses various pagination patterns elsewhere, but none matched the needs of secondary care appointment lists:

  • existing pagination lacked context on page count or user position
  • GOV.UK pagination was too space-consuming and didn’t scale to many pages
  • other NHS App pagination was inconsistent and not optimised for long lists
Screenshots of the other examples of pagination used on the NHS App
A screenshot of the GOV.UK design system pagination component
A screenshot of the design ideation for adapting the gov.uk component

Desk research

We reviewed three main patterns common in digital services:

  1. Load more
  2. Infinite scroll
  3. Pagination

Load more and infinite scroll are popular in e-commerce and casual browsing. But they:

  • don’t offer clear user anchors
  • can overwhelm users with unbounded content

Pagination provides structure, position awareness, and focus, but needs good design to balance usability and space.

Design options explored

We prototyped three approaches:

Pagination v1 – page numbers only

  • standard numbered pagination
  • moderated testing: 1 user found it easy (“easy enough to flick between pages”)
  • unmoderated: 6/10 succeeded, 3/10 struggled; some overlooked pagination entirely; scroll fatigue persisted
A screenshot of the pagination version 1

Pagination v2 – appointment count

  • added total count of appointments
  • moderated: users appreciated seeing exact totals
  • unmoderated: 7/10 succeeded; users felt more confident, less directionless; minor issues with past appointments and sorting clarity
A screenshot of the pagination version 2

Load more

  • single “Load more” button to append cards
  • moderated: 2 users liked the seamless feel (“load more can be nicer…”); some missed the button
  • unmoderated: 67% missed the button initially; mixed task success; fatigue on long lists
A screenshot of the load more pattern

Findings and decision

No single pattern dominated — each had trade-offs.

In a team workshop, we considered:

  • page load performance
  • technical complexity
  • accessibility
  • user satisfaction
A screenshot of the whiteboard the team used to review the 3 options

Conclusion

Pagination v1 (with page numbers) was chosen.

It offers users:

  • clear page position and progress
  • total appointment overview
  • predictable structure with 5 to 10 cards per page

Final design

  • pagination controls with numbered pages and top-of-page counts (“1–X of Y”)
  • fixed number of appointments per page (5 or 10)
  • positioned at the bottom of the appointment list
Screenshots of the final design

Future plans

We plan to:

  • extend PVC to other secondary care pages (documents, questionnaires, past appointments)
  • monitor performance and gather ongoing user feedback
  • look to align the pagination pattern with other areas of the NHS App, such as test results, to ensure consistency across journeys
  • collaborate with the design system team to shape a shared pagination component