Dr.Kathleen Mahannah
Naturopathic Physician
Project: Responsive Website Design
Role: UX Designer
Tools: Pen & paper - Sketching Paper Prototype
Sketch - Wireframes & High-Fidelity Screens
Invision - Prototype
Read: 3 minutes
Visit the Live Desktop Version here : www.drkathleenmahannah.com
“Allowing voices to be heard, through a one-on-one natural healthcare journey
that aims to get at the root of the problem through integrated medical practices”
Approachable. Empowered. Qualified
These are the traits of Dr. Kathleen Mahannah who is a naturopathic physician at Restoration Health Clinic. She focuses on integrated medicine which is a balance between scientific and natural medicine. She provides a holistic approach to treatments i-e. she not only treats people physically but also mentally and emotionally.
PRoblem:
Being new in this field and having difficulty reaching her target audience
Solution:
To share her approach and knowledge regarding naturopathy
To gain more bookings and email subscribers
To reflect her personality through her website
Research methods
The research for the project took place during the first week and the data from the research was then compiled.
The research methods we used were user interviews, surveys, domain research and C/C analysis. We did a total of 12 user interviews and collected 15 surveys which helped with our quantitative data. The interviews and surveys really helped us understand the frustrations and motivations of the users.
Domain Research:
We did some domain research to have a better idea of where the website conversion was dropping. Through this we discovered some issues with the current website:
Lack of Dr. Kathleen’s services
Lack of information about naturopathy
The blog on the website was not properly set up
There was no fixed header
The external booking website, Medeo, was extremely confusing
Journey Map:
We asked the people we interviewed to go through Dr. Kathleen’s current website. As they went through the site, we mapped their journey of emotions.
One thing that confused the user was the jumping between her site and an external booking site, Medeo. This was a major frustration because on the Medeo website they would have to once again search for Dr. Kathleen from a large list of doctors. Due to this, Dr. Kathleen would lose a potential patient, as now the patient had the ability to pick a different doctor.
Planning
Once the research was compiled it was followed by the planning phase which included user persona, journey map, storyboard and user scenarios.
Affinity Diagram:
With all the data gathered we created an affinity diagram which is an amalgamation of all the data points we gathered from the interviews and surveys. With this, we were able to identify the pain points, frustrations, values and the concerns the users have. This allowed us to come up with possible solutions for our potential users.
From this method we pulled out some key categories:
Different ways of booking an appointment
Frustrations when navigating medical websites
Pros and cons of a General Physician
Pros and cons of a Naturopathic Doctor
We saw that the key points from our affinity diagram were consistent with our findings from surveys and interviews.
User Persona:
From the affinity diagram we created a user persona. Our user persona is the person who has never been to a naturopathic doctor.
Sarah I 28 years I Single
Goals:
To be concerned about her well-being
To have trustworthy relationships
To have a healthy lifestyle
Frustrations:
Coming across mean people
Not getting the attention she needs
Waiting for something for weeks
Frustrated with getting the wrong information
Being rushed out of the door
DESIGN AND TESTING
After the planning phase, ideation and sketching started immediately. We started by creating a paper prototype to test the idea, and then digitized it on Sketch to create medium fidelity screens. After further testing from the medium fidelity screens, we finally created high fidelity screens for our responsive website.
Paper Prototype:
We created the paper prototype for desktop and mobile side-by-side to have a certain consistency in both the platforms.
Testing:
From the initial paper prototype testings, people weren’t able to navigate and find certain pages. We tackled this by incorporating card sorting, a method used to help design or evaluate the information architecture of a site, to help feature prioritize and see what the normal user would be accustomed to.
This image shows how we integrated 3 separate pages into a single, clean, and easy to use page for booking an appointment with Dr. Kathleen
Mid-Fidelity Screens:
After making the iterations, we created the mid-fidelity screens and did some user testing. These tests showed that the website was smooth and easy to navigate.
Final high-fidelity screens:
We created high-fidelity screens for the responsive website of Dr. Kathleen. Using the screens, we created an InVision prototype which helped us navigate through the website using our scenario.
Landing page
About me
Discover Naturopathy
Blog
Services
Contact us
Read full detailed case study on Medium