top of page

hollyoo Health

W

Phone Whollyoo Health.png

A healthcare mobile app focused on the betterment of the user, by providing tools catering to their health needs; externally, internally and mentally. 

UX Designer/UX Researcher/ UI Designer

Timeline: March 2021-Sept 2021

UX Immersion Showcase

Empathize

1

The Problem

Challenge:

The user needs a way to be able to track and log their personal goals; whether it be physical, mental or medical, and to be able to share that data with whomever they see fit. Being able to do this will ease tension of unnecessary medical bills, paper trails,  and stream line treatment.

The development of this app stemmed from working on a medical team in the midst of a pandemic, where adaption was key in what seems to be a never ending crisis. 

Hypothesis:

We believe that user's having a simpler, instant way of distributing their personal data will result in less back log, fewer medical bills,  and less stress overall. We will know this to be true when a user can easily collect their personal data and share it with whoever they see fit, without the chaos of a paper trail. 

"As a person with numerous health concerns, I want a core location of all my medical records, so that I can share them with my provider."-User Stories

"As a healthcare provider, I want a quick and easy way for my patients to share health records and personal stats so that I can review them and prevent repetition of care; as well be able to reassess their medical plan."-User Stories

Competitive Analysis

In order to better understand the industry and find out where the product currently fit in the market I conducted a product analysis. 

I focused on companies with a similar end goal for the user. Better Health. 

After working in the medical field I was able to pinpoint opportunities my app could cater to, which other platforms lacked. 

Rally Health Logo_edited.png
Untitled design (37)_edited.png
Easy to Use
Reminder Prompts
Compatible with Health Insurance
Motivating Reward System

S

Strengths
Extremely easy & convenient to use
Caters to user
Largest food data base
Reminder prompts
Not distributable
Doesn't pair easily with tracking devices.
Catered to health insurance preferences

W

Weaknesses
Not Diverse
Limited to what can be tracked
Cost to fully utilize
Make results distributable
Easier pairing to tracking devices
User be able to customize

O

Opportunities
Subscription for full range access. 
Allow for limited use of workouts
Partner with health care
Insurance no longer paying to partner with health platform
Industry transitioning to more virtual care
 Insurance covers more with virtual care 

T

Threats
Employers recognizing the benefit of healthy employees
Health Insurance Industry

Surveys & Interviews

Survey Questions.png
Survey Question 2.png

Next, I conducted a survey to determine attitudes, reactions and gauge opinions in regards to health care platforms. 

I was surprised by the survey response. I sent out 70 surveys by email and anonymously via survey monkey. I received 40 in reply. 

Overall, the mindset I had in regard to health care platforms when starting was pretty spot on. I also gained new insight; I discovered a younger population than I expected, would be interested in utilizing a health care platform to improve their overall self. 

Since users of the health care website can be separated into two categories, I conducted six interviews; three of each category, health care providers and patients. I focused my design around the "patient" user, but interviewing both categories allowed me to focus on all aspects of the patient's needs, even those they were not aware of, from the medical side. 

Interview Insights & Summary

The interviews went well. I kept the flow of the conversation focused but light. I made sure to ask follow up questions to get a clearer understanding of certain viewpoints. I learned there are one or two features which could cater to the users playing the role of provider. However, my main focus will be to cater to the users playing the role of patients.  

  • The number one pain point for both user genre is having access to patient health records. For the provider perspective, it's to know previous treatment of the patient. From the patient perspective, it's to keep from repeating duplicate labs and avoid unnecessary fees. 

  • Health care providers are not as keen on changes and people taking charge of their own health. They feel it will result in people being more needy than they already are. 

  • Patients prefer to be in charge of their own health, but aren't sure where to begin or what that looks like with this day and age. 

  • HIPAA is a huge factor of concern. Following rules and regulations in regards to it is an absolute must.

  • People mostly want easier formats of communication when taking care of their health. Insurance is making it cheaper for telehealth visits. Providers are requiring more in house visits as it costs more. 

  • It's obvious the health care industry is changing. We need a way to keep up with that change. 

The Problem
Use Stories
Competitive Analysis
Surveys & Anchors
Empathize

2

Define

Affinity Mapping

I used the art of affinity mapping to better organize my research analysis. It allowed me to gather common focuses and pain points of my six interviews of the two categorized users. Laying out my focus by color then category allowed me to pinpoint what my main features of the app needed to be!

My research analysis was conducted by grouping each interview response into four categories:

Original Research Affinity Mapping_edited.jpg

Behaviors & Attitudes

Needs & Goals

Frustrations

&

Pain Points

Quotes & Facts

Affinity Map of Original Interviews:

I then refocused my research analysis of each interview into common topics of all interviews instead of by interviewee.

Tutorials and Progress Charts

Ease of Use

Easier Access to Health Documents

Communication

Affinity Mapping Grouping_edited.jpg

Refocused Affinity Map

Refined Interviews and Affinity Maps

Individual Interview Affinity Mapping.png

I laid out my research analysis of each interview into a refined version focusing on each users needs & goals, frustrations & pain points, quotes & facts gathered during the interview as well as their behaviors and attitudes. 

Refined Research Analysis pg 2.png

Here are refined versions of my affinity map focusing on common topics of the interviews. Communication, tutorials & progress charts, easier access to patient health records and ease of use. I laid out the insights and opportunities of each topic together in the middle as a focal point of where our main features lie. 

Refined Research Analysis pg 1.png

User Personas

User Persona Jack.png
User Persona Jill.png

Meet Jack and Jill! I used my interviews and research to create reliable and realistic representations of my key users. 

Attaching a realistic story and face to my users helped keep me focused on my  end goal and who I was designing for. 

User Journeys

I created user journeys to, essentially, streamline the steps Jack and Jill will need to take in order to reach their end goal. I created an emotional scale of the user's pain points and frustrations as well as the moments that excite and engage them. Allowing me to make their process of reaching their end goal easier.

User Journey Jack.png
User Journey JILL.png

After working with many peers, colleagues and interviewees, I discovered that the idea of a QR code to access information without actually giving a health care provider access during emergency use is not actually possible.  

It was brought to my attention via my mentor that a QR code requires a URL which in fact would violate HIPAA regulations. Therefore, the QR code was removed and the app caters to the user's needs of being able to share health documents via email or text message. As well will still cater to all other user needs. 

Task Flows

Next I used task flows to create a visual image of Jack and Jills journey for each of their end goals. Each flow represents  one task Jack and Jill is hoping to utilize the Whollyoo mobile app for. 

Task Flow Jill – 1.png
Task Flow Jill.png

Creating the task flow,  allowed me to see how Jack and Jill move through the app and where potential pain points occurred. This allowed me to eliminate any unnecessary obstacles for them.

Affinity Mapping
User Personas
User Journey
User Flow
Define

3

Ideate

Card Sorting

To start organizing the layout of the Whollyoo mobile app I did a card sorting exercise with five participants. The card sorting exercise was open and performed virtually with optimal sort.

The topics for the card sort were as follows:
The results for the card sorting exercise were as follows:
Account
Breathe
Calendar
Exercise
Food
Journal
Meals 
Medical
Mental
Mood
Password
Payment
Prescriptions
Profile
Recipes
Records
Schedule
Support
Water
Workout
Groupings by percent for card sorting.png
Personal Review:
  • Duplicate log in/homepage for medical is excessive and unnecessary.
  • Scheduling for medical appointment is not clear, as it was put into several different categories.
  • Medical subjects were more often categorized together than technology, which could be a different way of categorizing things.
  • I was pleasantly surprised that those who did perform my card sort, did group each features main focus together. 
Actionable Outcomes:
  • Finger scan for two factor authentication. Remove the home page and log in section for the medical category. Replace with
  • Schedule is not needed for all categories, because people use google calendars. To set a reminder, have app link with google calendar. 
  • Break down into two main categories, body related and tech related. 

Site Map

This version of my site map was refined after reviewing the card sorting results. I eliminated an entire section that focused on a calendar feature. This could be eliminated by linking to google calendars.  This was proven to be unnecessary with several users during the card sorting exercise. I eliminated it in the site map and relocated it under the topic account. 

Updated Site Map.png

Wire Frames

All information collected up until this point helped me start to build and reiterate wireframes for the mobile app.  I started with a quick sketch then designed in Balsamiq, Figma and Adobe XD. These wireframes helped me to not only form the layout of the mobile app. , but also to allow users to click through them to target pain points and restructure the layout to best cater to the user. 

Wireframes.png

To best exemplify one of the main features of the Whollyoo mobile application, I chose to showcase Jill's task of sending health documents to her health care provider below...

Sending Documents Sketch Design.png
Mid Fidelity Export Documents.png
Final Iterations:

The introduction/ log in/ sign up wireframe and the process to upload and send documents. 

02.V2 Introduction.png
Introduction Screen
27. V2 Individual Health Record.png
30. V2 Health Document to send.png
31. V2 Two Factor Authentication.png
32. V2 Two Factor Authentication Verified.png
33. V2 How to Send Health Document.png
35.b V2 Send by Text Sent!.png
Task: Sending Health Documents
Card Sort
Site Map
Ideate
Wire Frames

4

Test & Prototype

Conducting Usability Testing

Usability testing started with six users. Four were focused to meet the demographics of the study, two were outliers but still met the demands of all users who may use features of the app. Testing all user's gave us the insight we need for any obvious hiccups we may not have noticed with our key demographic who could potentially use the mobile app. 

Interviews:
interview 1 usability testing.png
Interview 2 usability testing.png
Interview 3 usability test.png
Interview 4 usability testing.png
Interview 5 usability testing.png
Interview 6 Usability Testing.png

All results were gathered into a rainbow spreadsheet to determine the severity of error or user pain points they come across during testing to determine what pain point needs to be addressed first. 

Rainbow Spreadsheet.png

The top five opportunities that came to light from the rainbow spreadsheet and how the changes which were implemented are shown here...

Screenshot (451).png

Preference Testing

Based off of a response of my rainbow spreadsheet, images used were 'basic' including the introduction screen. I decided to update them and conduct preference testing to see what was preferred overall. Obviously I was biased to my work, and wanted a clear understanding of how others viewed my work, and how my layout and visuals affected their usability and desire to engage with my app. 

​

People's preferences took me by surprise. When it came to an app focusing on the betterment of their health. People wanted a busier background with a simpler layout. They wanted it to be more fun and intriguing, losing some of the seriousness attached to healthcare. 

First preference test conducted, simple icon vs cartoon image.

Blue Icon Image.png
Workout Icon.png

When an image was preferred over an icon for the introduction and onboarding process, I chose to change the layout for the onboarding and sign in/up. Still keeping the same idea and color schemes but using character images vs icons in the layout. Implementing the character like images gave the app a friendlier feel intriguing more users. 

Whollyoo Health Intro Page Mobile.png
01 Splash Screen.png

Design Deliverables

In order to be able to hand off my layout and design Whollyoo Health to the software engineers I am working with, I've created a design deliverables file. The file will house the main image of the page/screen. Any icons or images used with the design of the specific features at 1x,2x,3x. The file will also house the color scheme listed with hex codes, font sizes and title per use.  This will cater to any future changes made within the design. As well, allow for uniform synchronicity across all pages moving forward in development. 

Color Scheme
Untitled design (39)_edited.png
Typography
Buttons
Untitled design (40).png
6.png
7.png
Navigation & Search
Untitled design (41)_edited.png

High Fidelity Prototype

The end result of empathizing, defining, ideating then prototyping and testing is a high fidelity prototype which can be accessed by clicking on the phone to the left. 

Test & Prototype
Usability Testing
Preference Testing
UI Kit
High Fidelity Prototype
bottom of page