App integration pattern for 3rd party sites and services

[markasrobinson]

The need

We believe there may be a need for guidance in the NHS App design system that outlines how 3rd party sites and services that integrate with the app should look and work – an “app integration pattern”.

What's the problem?

During some work in late 2025/early 2026, we discovered that NHS website content in the app was integrated in inconsistent ways.

Some pages opened the full website in an overlay, some pages opened the full website in a web view, and some pages opened a slightly customised (with a suppressed header) version of the site in a web view.

This causes a range of issues for users, such as:

• integration patterns can change mid-way through a journey, leading to a jarring and confusing experience
• standard website navigation elements can lead to circular journeys (for example, if users click on “My account” in the website header when they’re in the app, they’ll be prompted to go through the NHS login journey just to end up back on the app)
• misleading or unhelpful terminology is shown to users (for example, links saying “NHS App” take users to pages about the NHS App rather than to the app itself and links to “profile editor” can be interpreted as being related to the user’s app profile rather than profile pages for services on the NHS website
• the search bar searches the NHS website, not the app, and returns results that can be misleading in an app context
• breadcrumbs take users up a level in the website hierarchy, rather than back to the previous page, causing confusing journeys and ultimately trapping users within NHS website pages when they access them from the app
• lots of distracting links in the website header and footer can take users away from the task they came to the app to complete

The inconsistency also causes some issues for the NHS website, such as:

• analytics data is easier to gather when content is consistently integrated in a web view
• journeys that involve passing across patient data work appear to more smoothy in a web view
• the general direction of travel for app integrations in the future is a “custom overlay”, which is a variation on the current web view integration (not the standard overlay pattern currently used for a lot of NHS website pages)

Our recommendations for the NHS website

Our team has recommended that NHS website pages in the app should always be displayed using a web view rather than an overlay, and that NHS website teams should implement a consistent “app integration pattern” that customises global navigation elements when we detect a user is accessing the content via the NHS App.

The integration pattern consists of 3 main adaptations for app users:

1. Suppressed site header – total suppression of the NHS website header, including NHS logo, account button, search bar and site navigation links
2. Simplified site footer – a reduction in the number of footer links displayed so that only essential links (terms and conditions, cookies policy and accessibility statement) are shown
3. Backwards navigation – a mechanism for allowing users to return to the previous page in their browser history (generally this means replacing the standard site breadcrumb with a “Back” link)

While some of these issues and recommendations may be specific to the NHS website, it’s likely some would apply to any other 3rd party site/service and could form the basis for more general guidance about how other organisations and services should adapt their pages for the app.

[Graham-Pembrey]

Thanks Mark! This definitely feels worth us pursuing.

Adding this related issue to the thread: Tell a user they are about to access a third-party service

That issue relates to some work the app navigation team did, looking at introducing a new style of start screen. It would replace the blue interrupt screen used currently when users jump off to a third-party service. The work also included a plan about overlays.

I've just checked and the start page work is due to start soon, but the overlay part has been paused and left for the native team to pick up. It feels like we could try to square the work the nav team did with what you're suggesting, and arrive at some draft guidance.

[flora-nhs]

Prioritised as part of the upcoming Patterns work to define the x-OS (iOS, Android and Web) patterns

[flora-nhs]

Guidance from @davidhunter08 's "Access web journeys in native" patterns

Which type of overlay to use

##Custom web view
Use a custom web view if you need to customise or control how a journey is presented in the NHS App.

This applies to:

website-based app journeys – such as requesting a repeat prescription or viewing test results
all NHS website journeys – whether they are authenticated, such as 111 online, or unauthenticated, such as Health A to Z and App help
authenticated third-party journeys – such as online consultations, Wayfinder integrations and Be Part of Research
the "Give feedback on the NHS App" survey – which contains links to the NHS website that we need control over
Examples of a custom web view being used for repeat prescriptions, online constulations and NHS website journeys.

##Web browser overlay
Use a standard web browser overlay (Safari View or Chrome Custom Tabs) for journeys you do not need to customise or control.

This applies to unauthenticated, third-party information websites. For example, online pharmacy websites.

Examples of Safari View being used for the external websites Bamboo Pharmacy, British Heart Foundation and a Department of Health PDF.