UI/UX Case Study

Case study: Reimagining the doctor’s appointment experience

In this case study, I am going to share my design process which I followed while designing this app.

Rohit Methwani
Bootcamp

--

Cover image
Cover image.

This was a personal project which I designed as a Product Designer in November 2020.

What is Mediplus?

Mediplus is an online booking platform that makes it easier for doctors and patients to handle appointments and prescriptions.

The main motive is to reduce the waiting time of people at clinics in order to avoid spread of any infection.

Why did I decide to design Mediplus?

Long queues are undesirable, whether you’re standing in line for a movie theatre or you’re in a waiting room with sick patients like yourself.

Let me share an incident

These Covid times have been really tough for everyone to keep ourselves protected from this virus & keeping a distance from others. During this pandemic, I had to visit a local clinic where I booked the appointment, and still, I had to wait 2 hours in the queue with other patients (some of them were covid positive) to consult with the doctor. I was exposed to other viruses & infections. So I felt a need to have some kind of solution to avoid long waiting queues.

Target audience

People living in suburban areas prefer to visit their local doctors for any consultation & also the local doctors.

Let’s jump into the details

Let’s have a look at the steps which I followed.

Process
Process

Research

Secondary research

The problems in the current queue system exist but to get a deep idea about the same, I created a set of questions.

The analysis after gathering the data:

I. According to market research, 42.5% of the total population in India preferred local doctors/clinics. The other breakup is shown below.

Percentage of people using different healthcare systems.
Source: The livemint blog

II. The average time a patient spends in the waiting queue was 60 mins. The major bottleneck causing this high waiting time was found to be the waiting time for consultation which was 40 minutes on average. Information gathered also revealed that 33% of patients waited for 30- 60mins for the doctor while 32% of patients waited for over an hour.

III. The increasing waiting time in the queues can lead the doctor to pay the charge as much as $47 per/hour for each patient (as practiced in the US).

Competitive analysis

I went ahead and did the competitive analysis based on the important features which helped me to gain market knowledge and whether the product is a perfect fit for the market or not.

Competitive Analysis
Competitive Analysis

User personas

With the insights gained from brainstorming, secondary research, our target audiences’ attitudes and behaviors were identified.

I conducted user interviews to get to know the details of the target audiences’ minds. The primary persona which emerged after this is:

Rahul Ramrakhyani, 28 years old, a Businessman.

Primary User Persona
Primary User Persona

Information architecture

The IA is pretty much simply focused mainly on the appointment booking part, preserving previous prescriptions and, taking into account patients’ previous medical history ensuring the users should be able to perform a specific task with a minimal number of steps.

Patient’s Side Information Architecture.
Patient’s Side Information Architecture.

User flow

Another important part of the project. The most important motive was to provide an easy way for patients to book appointments. So the primary focus remains on the appointment booking part.

Patient’s side user flow
Patient’s side user flow

Mid-fi wireframes

To get clear user feedback and perform usability testing, a mid-fidelity interactive prototype of the application was created. This prototype acted like an actual application for the users & they were able to relate to it as an actual product.

Mid-fi Wireframes.

Usability testing

Usability Testing was performed on Mid-fi wireframes to validate the flow of the application.

Test Plan
Test Plan.
Test Script.

Gatherings after Usability Testing:

The testing was done with 5 users. From overall test findings, we can conclude that the prototype is a success, concerning the appointment bookings workflow. Users find it pretty-simple to book an appointment. The interface was clean & un-cluttered which helped users to access the information easily.

The testing helped to discover new problems:

  1. Provide experience, type of doctor on doctor’s card.
  2. Change the SOS button caption to Emergency.
  3. Users find it difficult to access previous prescriptions.

The recommendations which were received:

  1. Reminder about the follow-up.
  2. Notify about appointment updates/reminders on SMS.

The interface is very easy to use & I can easily book the appointment with very minimal steps.

— A Participant’s Feedback.

Here are the detailed findings of usability testing.

Design

Since blue is associated with calmness, it is used as the primary color.

Design System.

High-fi wireframes

Once the UI style guide is done, I started creating high-fidelity screen mockups on Figma. The overall user interface design was kept minimal to ensure users don’t get overwhelmed using the application.

Patient’s side high-fi wireframes — I.
Patient’s side high-fi wireframes — II.

Doctor’s side

During the current pandemic situation, it was difficult to collaborate with doctors, I decided to move forward with my own assumptions & observations rather than collaborating with the doctors for testing and information.

Information architecture

The IA is pretty much simply focused mainly on the ease of creating appointment slots, preserving previous prescriptions and, giving detailed information about patientsmedical history.

Doctor’s side Information Architecture
Doctor’s side Information Architecture.

User flow

The most important motive was to provide an easy way for doctors to create appointment slots. So the primary focus remains on the appointment slot creation part.

Doctor’s side user flow
Doctor’s side user flow.

High-fi Wireframes

Doctor’s side high-fi wireframes — I.
Doctor’s side high-fi wireframes — II
Doctor’s side high-fi wireframes — II.

Learnings from this project

  1. The major learning was how to create a questionnaire for user interviews in a correct manner & conduct user interviews.
  2. The other major learning was to document things properly.

Thanks for watching!

Do you know you can give me 100 claps by holding the clap button 😋 ?

I also have a plugin on Figma & Adobe XD. I am dropping a link here you can surely check it out!

Let’s connect

Portfolio- Instagram Dribbble BehanceLinkedIn

--

--