MAKE AN APPOINTMENT LANDING

The Make an Appointment landing page plays a crucial role in patient acquisition and retention. Without good user experience, UCLA Health suffers from gaining new patients and maintaining returning patients. The previous design lacked in clear visual hierarchy, making it difficult to scan the page. The CTA buttons didn’t provide the clear clue to where they linked, leaving the users confused.

ACTION

Competitive Analysis

I looked at other medical providers’ make an appointment flow and identified common items:

Phone number to schedule an appointment
Link to a patient portal
Request an appointment form

From the competitive research, following common flow was uncovered:

Schedule by phone Call to make an appointment
Returning patient Sign in or sign up for a patient portal
New patient Sign up for a patient portal or fill out a form to request an appointment

Various medical providers' make an appointment user flows, illustrating similarities.

Usability Test Previous Design

To learn what worked and what didn’t work, I tested the original design with five participants.

Make an Appoitment Page Findings

When asked to make an appointment as a new patient, all test participants clicked the blue Request an Appointment button.
When asked to make an appointment as a returning patient, everyone found the log into myUCLAhealth hyperlink.
When asked to find a speciality care doctor, no one clicked the blue phone number button to call customer service. Instead, they either clicked the Find a Doctor hyperlink on the sidebar or the white Find a Doctor button at the upper right corner.
The phone number button was ignored because it was at the button of the page and didn’t give a clue where it linked.
Many users also wanted to avoid calling customer service due to the long wait time.
When asked to schedule a video visit, most participants clicked the Video Visit hyperlink on the sidebar and missed the white Learn more about video visits at the bottom of the page.
Some participants were confused that the sidebar hyperlink and white button took them to the same page even through the link labels indicated different things.

Original Make an Appointment landing page design.

General Findings

Users’ general behavior:

Users/patients begin their tasks such as making an appointment or finding a doctor online (digitally) instead of calling customer service because wait time to talk to a customer service representative is long and would like to avoid the wait time. They also want to conduct their own research about doctors on Google, Yelp, LinkedIn, etc.
Only call when users can’t accomplish tasks digitally.
When searching for a doctor, most important criteria users consider are location, reviews, and profile pictures.
Users are willing to travel more for specialty care doctors, but not for primary care doctors.

In general, making an appointment with UCLA Health doctors:

Is somewhat straight forward.
Can’t be done without talking to a customer care specialist as a new patient.
Is frustrating because wait time to talk to customer service is long.
Isn’t successful because patients often miss call backs from a customer care specialist after filling out the request an appointment form.
Is difficult because there is no way to select a specialty care doctor on the myUCLAhealth patient portal.

Rapid Prototyping

After testing the original design and uncovered some insights, I have developed a new design to eliminate some usability issues.

The make an Appointment landing page new layout version one.

Though many users didn’t prefer to schedule by phone, there was a need to call customer care specialists. And the phone number was often unseen due to the placement of the number, below the fold. So, the phone number was brought up higher on the page as one of the ways to make an appointment.
Instead of dividing CTAs by types of patients (returning and new), ways to make an appointment were made into CTAs such as schedule through a portal, appointment form, etc.
The ways to make an appointment were made into CTA cards because the appointment request form was not only used by new patients but also used by returning patients who wanted to establish a relationship with a new doctor.
To make the video visit option more prominent, the video visit section was made into a CAT card.
To avoid the confusion between the video visit link and Learn about video visit button, the two were linked to different pages. The Request video visit was linked to an appointment request form, while the Learn about video visit was linked to a page that provided video visit information.

Usability Test the New Design

I have tested the new design with five participants.

Make an Appoitment New Design Findings

Users were unclear about the title, “Make an online request”.
Users were hesitant to click the blue Request an appointment button to request an appointment with a speciality care doctor because users wanted to figure out who the right doctor was first.
Users preferred to call when they were requesting an appointment with a speciality care doctor because they felt more secure and wanted to speak to a person rather than going through the requesting process digitally.
Users were more comfortable to clicking the Request an appointment button on a doctor’s profile page because they knew that was the doctor they wanted to see.
Users called customer care specialists only when they were unsuccessful in requesting an appointment digitally.
Users were hesitant to clicking the Call customer care specialist button while they were on desktop. So, they dialed the number instead.
When clicked on the blue Request video visit button and taken to the same appointment request form for the regular appointment, users were confused that they couldn’t specify the type of visit they wanted to request.

NOTE: One user tried to make an appointment with an ophthalmologist on the myUCLAhealth patient portal. But she couldn’t do so since she hadn’t established a relationship with an ophthalmologist at UCLA Health. She was very confused and didn’t know what to do. She didn’t know that she needed to fill out the appointment request form to establish a relationship with a new doctor. She thought that she needed to get a referral from her PCP even though she had a PPO insurance.

RESULTS

Idea 1

Idea 2

How I solved the problems

Changed the middle CTA card title to “Request an appointment” to clarify the action. The previous title confused some users with the word “online”. Some users thought that the online request meant requesting a video visit.
Shortened and clarified descriptions for CAT cards. The previous usability testing confirmed that users don’t read but scan.
Kept at the “Book by phone” CAT card at the top. Though the previous usability testing proved that users tend to avoid calling customer service, some users preferred to call when they wanted to make an appointment with a speciality care doctor.
Changed the “Call customer care specialist” button to a phone number link so that users on mobile can click the link to call, while users on desktop can dial the number.
Removed the “Request video visit” button. After some investigations, I found out that video visits can be requested with some doctors at first encounter, but not with all doctors. So, we decided not to highlight video visits in the card.
Removed the “Vaccine information” CTA at the top. The previous usability testing proved that most users coming to the Make an Appointment page didn’t think that vaccine info. was important.
Came up with the simpler layout, idea 2, to experiment. The idea 1 and 2 layouts will be used to run a A/B testing.