Changing the GP Booking Experience

A mobile-first UX design process, from problem discovery through to UI design & hi-fidelity prototype testing.

Summary

Empathise
Competitive Analysis
User Survey
User Interviews
User Personas
Empathy Mapping
Ideate
User Flow
Branding
Wireframes
Low-fi Prototype
User Testing
UI Design
Prototype
Hi-fi Prototype
Usability Testing
Priority Revisions

Background

The National Health Service (NHS) is the third largest organisation in the world. GP surgeries are one of the most ubiquitous and relied-upon services by the British people.

Problem

The current process to book a doctors appointment is filled with pain points, such as the online sign-up process, and ringing the surgery directly to book.

Solution

A progressive web app available to mobile and desktop users was designed to meet the users needs for a simple, easy and quick online booking service.

Empathise

Research began by looking at three main competitors in the doctor's appointment online booking space. With no clear preferred provider of booking services to the NHS, it was difficult to discern which was the primary competitor in what is a crowded market. The primary healthcare trend was towards digitisation of public health in the UK, with digital offerings such as NHS choices, aiming to increase efficiency of how NHS resources are used.

The average member of the public sees a GP six times a year; double the number of visits from a decade ago. That’s a lot of appointments. The future only looks more challenging, with additional strain being placed on public health services due to UK’s ageing population and increased demand for A&E services. Resultantly, people are increasingly turning to their GP surgeries for medical attention.

The current booking process for a GPs appointment is outdated and lengthy. Whilst online options exist, from user research it was established all users interviewed ring up to book, navigating through various complex and user unfriendly phone menus, to then be put through to a receptionist to book an appointment.

Competitors analysed
"I hate the automated voice system and how slow it is to navigate through"
To understand how users currently book their appointments and their motivations for doing so, ten users were surveyed online. The results showed that no participant in the UK booked their doctors appointment online, despite it being available as an option - users booked by phone instead due to a difficult online signup process. These users rated their experience low in terms of ease. At a contrast, all survey participants in the U.S. booked their doctors appointment online and had significantly higher scores when rating how easy their booking process was.

All users surveyed would consider booking their doctor's appointment online - citing convenience, speed and ability to view available times as their primary reason for doing so.

To understand how users currently book their appointments and their motivations for doing so, ten users were surveyed online. The results showed that no participant in the UK booked their doctors appointment online, despite it being available as an option - users booked by phone instead due to a difficult online signup process. These users rated their experience low in terms of ease. At a contrast, all survey participants in the U.S. booked their doctors appointment online and had significantly higher scores when rating how easy their booking process was.

User interviews were conducted to gain insight into a users experience of booking a doctor's appointment. Four users were interviewed, all of whom had booked a doctors appointment within the past 6 months. The main finding from interviews was that users all booked their appointments by phone, despite having frustrating interactions with the automatic hold system and receptionists, on average having to wait over 10 minutes to book an appointment.
"It'd be great if I knew when my doctor was available so I could choose a time outside of my working hours"

The full secondary research document is available here.

Armed with some great insights from user research, a user persona and empathy map were created to summarise the findings and provide a springboard for ideation.

Simon, the primary user persona

Simon, aged 47, is a busy professional who struggles to find a minute for himself, anything outside of his work and his family needs to be easy and convenient. He wants to book an appointment online so he can choose a time that suits him, as he hates having to ask for his doctors availability when on the phone to the receptionist at his local doctor's surgery. Simon would prefer to book online on his phone, as he can book on the go.

Secondary User Persona

Based on the user research, a second persona was identified. Rachel, 32, also books doctors appointments for her younger children and unwell parents, so needs a service that offers her the option to book and manage appointments for multiple people that are dependent on her. Although Rachel and her needs will not be focused on in the following design process due to time constraints, it's important to note the distinction between her and the primary persona Simon as this will carry implications for functionality of the service.

Empathy Map for Simon, the busy professional

Based on Simon's and Rachel's needs, a decision was made to design a mobile-first solution that allows users to book easily and quickly wherever they are. Viewing the availability of doctors, calendar integration and email confirmation and reminders were all features that would be explored to help meet the users' needs. These features were later explored through rapid sketches once the user flow was defined.

Empathy Map for Rachel, the parent

Ideate

With a solid base of research synthesis to ground the designs on, a user flow was defined for the experience. The below user flow demonstrates how our persona would access GP Connect, and book an appointment. This user flow is representative of our persona's "happy path".

The primary access point would be via Google, as all users in interviews googled their doctor's phone number to book an appointment. The user could also join the flow at two points, through their local doctor's surgery landing page, or head straight to log-in directly from search results. The booking process itself requires no more than 5-7 clicks / taps, an intentional decision to increase the simplicity of the process and make it as fast as possible.

User Flow

Once the user flow was defined, the potential features the booking service would have were explored. Each screen in the user flow above was sketched out and iterated on based on research findings and design pattern exploration. The resulting sketches were pieced together to form a low fidelity prototype, which was tested on four users.

The prototype can be found here

User feedback at this early stage in the design process was really important to gain insight into how users interact with the design and to understand what users expected to see as they navigated through the flow. One interesting insight was that users didn't like navigating through a calendar format to select an appointment date, they felt the format was too complicated as it was difficult to view on their mobile screen.

"If I'm booking tomorrow I just want to be able to click tomorrow instead of finding the date"
"I need to grab my glasses to see this calendar properly"

Based on the sketches and user feedback I translated these designs into wireframes.

Wireframes

Once the wireframes were created, it was time to explore the brand identity of the service.
Given the service is grounded in healthcare, it had to have a colour scheme and feel that was calming, simple and synonymous with health. The colour scheme also needed to have an element of continuity with the NHS's brand standards, to increase familiarity and to play on the trust the public have in the NHS - both of which are particularly important for first-time users.

For these reasons, a colour scheme was chosen that featured a strong blue which acted as the primary colour in the design, contrasting well with a clear white background. The lighter teal green was used as an accent colour alongside the lighter blue. The grey was used primarily in text to create a sense of hierarchy.

The wordmark logo created needed to be easy to understand and indicative that it is a healthcare service. The overlapping C and O letters play on the word connect, with the cross symbol highlighting that the service is healthcare. The white box around the letters GP follows a similar format to the NHS logo, again with the focus of establishing an element of familiarity for users. The components of GP Connect's brand identity were then compiled into a style tile that was applied to the UI.

UI Style Tile

The components of GP Connect's brand identity were then compiled into a style tile that was applied to the UI.

Final UI Designs

Prototype

To test my UI designs, I created a high fidelity prototype of the website and asked 4 users to book a doctors appointment, tracking their progress through the flow and noting any observations they had whilst engaged in the task.

The prototype was created using InVision and is available here

Usability testing showed all participants completed the task with ease, completing the task within 2 minutes. A common source of enthusiasm was how easy the booking process was, with many users commenting how it only took a few clicks. Users also liked the amount of information available to them, such as the cards featuring useful information on their landing page.

A source of difficulty for users was visibility of available appointment times, as the view obscured all available appointments, which forced the user to scroll across to find a time that suits them. This was iterated on and the design was changed to incorporate a vertical drop down that listed all appointment times at once.

Iterations based on user feedback

Reflection

This project was completed in a two week timeframe, with the primary focus placed on the booking appointment user flow. In future, my priority would be to develop other user flows based on the second user personas needs from the application, such as booking an appointment for someone else or managing existing appointments. One pertinent area worth exploring would be the sign-up flow, as in initial user interviews the sign-up process for existing services proved to be a significant barrier to use.

What was most rewarding about working on this project was creating a design with the goal of helping the public services in the UK. I enjoyed finding out some fascinating insights in the user research, and using these to create a design that works for everyone across a wide user base.

More Projects

Making City Breaks Easier

A mobile app that helps travellers make the most of their city break. The process followed design thinking principles, from problem discovery, to UI design, to user testing and iteration.

Read More

Reinventing Online Shopping

The task was to improve the users online shopping experience. This was an end-to-end UX design project to deliver a responsive e-commerce site & logo design for a multi-national clothing retailer.

Read More

Making Spotify Social

A research-focused, end-to-end UX design process to improve the music sharing experience on Spotify.

Read More