My role: Lead UX/UI Designer (user experience, interaction design, visual design, user research)
Year: 2018
Client: NHS
Company I was working for: Sparck/BJSS
Length of project: 18 months
Deliverables: Coded high-fidelity prototype, user journeys, style guide, GDS assessment
Tools: HTML, CSS, Javascript, Sketch, Invision, Adobe CC
Google Play: https://play.google.com/store/apps/details?id=com.nhs.online.nhsonline
Apple App Store: https://apps.apple.com/gb/app/nhs-app/id1388411277
NHS App: https://www.nhs.uk/nhs-services/online-services/nhs-app/
Year: 2018
Client: NHS
Company I was working for: Sparck/BJSS
Length of project: 18 months
Deliverables: Coded high-fidelity prototype, user journeys, style guide, GDS assessment
Tools: HTML, CSS, Javascript, Sketch, Invision, Adobe CC
Google Play: https://play.google.com/store/apps/details?id=com.nhs.online.nhsonline
Apple App Store: https://apps.apple.com/gb/app/nhs-app/id1388411277
NHS App: https://www.nhs.uk/nhs-services/online-services/nhs-app/
Overview
The NHS App allows patients using the National Health Service in England to book appointments with their GP, order repeat prescriptions, access their GP records, change their organ donation preferences, and discover other apps that can support them. The mission of the NHS App is to reduce the demand for GPs and help patients quickly access primary care services.
I led some co-creation sessions with the team in Leeds and London
Where it started
The project started when then-Secretary of State for Health, Jeremy Hunt, laid down eight “challenges” for the development team in September 2017:
• Symptom checking and triage
• Access to your medical records
• GP appointment booking
• Repeat prescription ordering
• Changing data sharing preferences
• Changing organ donation preferences
• Changing end of life care choices
• Promoting “approved apps” to patients
• Symptom checking and triage
• Access to your medical records
• GP appointment booking
• Repeat prescription ordering
• Changing data sharing preferences
• Changing organ donation preferences
• Changing end of life care choices
• Promoting “approved apps” to patients
Challenge
Initially, we went through a Discovery phase. There wasn’t much information about integrating all the different GP systems in an app. At that time, the NHS design team was creating a new identity for the NHS website, there were some ideas, but there wasn’t a style guide. Also, the NHS hadn’t made any apps before, so I had to create a visual identity that would work in a mobile app and at the same time be aligned with the NHS's new identity that was still being developed. I quickly sketched some wireframes, and, alongside the user research team, we started to test some concepts with members of the public. We wanted to understand the appetite for an NHS-branded app and gather user needs around primary care services.
After the Discovery, I evolved the prototype to a high-fidelity coded version that we used to user test and demo to stakeholders during the Alpha and Beta phases that lasted 12 months.
I started wireframing some of the ideas.
I created end-to-end screen flows for each journey to help the development team .
Coded high-fidelity prototype
The prototype was accessibility-ready, which helped us to test with people with accessibility needs. This also allowed the development team to implement the UIs seamlessly.
This is an example of a how I covered complex scenarios using screen flows.
Results
After 12 months of Alpha and Beta phases, we launched the app. We continued evolving functionalities and iterating the UIs based on 100 user testing that we’ve done across the different cities in England. We also interviewed GPs and Pharmacies to understand how to serve them better and use the NHS App to reduce the demand on the phone or face-to-face. Today, the app has over 1 million downloads on Google Play and is the #1 Medical app on the Apple App Store. The NHS App continues evolving and today serves as a platform for new features helping the NHS handle the COVID pandemic.
Coded prototype
Link: https://nhs-app-v1.herokuapp.com/
View in device mode: Command+Shift+M
View in device mode: Command+Shift+M
Some other screens
