HealthTap App and Website Redesign

HealthTap App and Website Redesign

designed by Josh Shiau and Eugene Tonev

 

Background

Healthtap is a healthcare platform that allows users to get free answers and instant help from more than 140,000 top doctors. Users can also have a virtual consult with doctors or assess their symptoms with our medical AI.

Unfortunately, the mobile and web had not undergone a significant update for years, and the interface was outdated, inconsistent, and in many cases outright confusing.

I joined in the Winter 2017 to lead the redesign of the patient app as the Design Lead for the consumer experience. I did the user research, concept generation, UX, and development support, while working with our visual designer Eugene Tonev on the icons, loading animations, and type. As with all projects, new design paradigms were discussed and codified with the larger Design Team.

The legacy app was not consistent in navigation, style, and interaction method across the tabs.

The legacy app was not consistent in navigation, style, and interaction method across the tabs.

 

Goals  

  • to in introduce a new navigation paradigm that takes into account how users expect to get care through smartphones and smartdevices in 2018.

  • to refocus the app around our core value propositions, adding new ones like Symptom Assessment and Care Guides to already existing Post a health question and Talk to a doctor care options.

  • to greatly simplify and modernize our UI and technical architecture.

  • to build in modularity to accommodate the needs of new partners.

 

User Research

User research was done in three stages: generative, low-fidelity evaluative, and high-fidelity evaluative.

Generative

In the generative phase, there were a lot of competing ideas about what the home page should be. Stakeholders from varying parts of the company had different ideas about what the most important feature to highlight was, citing different evidence. To externalize the knowledge and align on priorities, we mapped our assumptions about the current app on a Rumsfeld Matrix:

Facts - things I know I know

Intuitions - things I don't know I know

Questions - things I know I don’t know

Blind spots - things I don't know I don't know


Low-fidelity evaluative

  • users recruited from outside and from our organization partners were asked to describe each screen and interpret what what they saw.

  • users would then be asked how they would treat a condition, seeing where they would tap, what their expectations would be, and what their intents would be. We carried out the research with the acknowledgment that someone in an urgent health situation would have much less patience and peace of mind.


High-fidelity evaluative

  • users on our direct-to-consumer app got an update for the conversational UI, and we gathered feedback though support channels, reviews, and direct feedback.

  • later, users on our direct-to-consumer app got an update for the card based UI and we gathered feedback though support channels, reviews, and direct feedback.

 

Ideation

After generating dozens of sketches, I narrowed it down to four interaction paradigms to test.

chat paradigm: amazon alexa

The original idea for the chat paradigm was to have a universal interface for smartphones, wearables, and smart home devices. The app would address any question with articles, care guides, an in-depth assessment with our AI, or a recommendation for an immediate online visit with one of our doctors. Phrases like “I want to talk to a doctor” or “what do I do for a headache” would trigger the appropriate content and skill.

 

feed paradigm: quora/facebook

In this approach we would continue to have a feed on the home page, but leverage our network of doctors and medical information sources to serve new research and doctor responses relevant to a user’s conditions, personal health info, and followed topics. This would allow us to push notifications about interesting information and also give users a good reason to come back.
After evaluating the options, we found the ROI of aggregating and curating new content was not high enough to justify having a feed front and center in our app anymore.

 

search paradigm: google/wikipedia

At the time, search accounted for almost half of all user intents on our site, so a search-centered home page home page may be the most efficient way to route users to the optimal care option. After users click through to a topic page or a health answer, a sidebar displays the most relevant care options.

A downside of this approach is that it places a penalty on experienced users who know what care option they want to take when they open the app.

 
smartcard.png

smart cards paradigm: apple control center

The concept with smart cards was to serve cards based on differing contexts, like what appointments you had upcoming, what things your insurance or coverage provider wanted you to know, and what was in your health profile. The main concern with this approach is the potential for the screen to look very different from user to user, and even from different time of days. From our research, we have a large cohort of users that only use our app when they need medical help, which usually every few months. Having an interface that may look different each time they open the app would heighten both user confusion in a time of need and our ability to troubleshoot. Consistency is a source of comfort and efficiency.

 

Iteration

After collecting both user feedback and strategic direction from stakeholders, I further narrowed it down to two approaches to explore further. We combined some of the design elements from the initial explorations like a prominent search bar and configurable cards and integrated them into two competing designs we could build and test with. We built both versions and tested the technical limitations and user reaction. Here are some of the most important findings about the strengths and weakness of the two approaches:

 
chat.png

Chat-based Approach

  • Natural Language Processing is not yet able to derive intent consistently, especially for non-native speakers.

  • New users were not familiar with the different care options and content we offered, so discoverability was low.

  • Entering free text to start features is a new interaction paradigm, and was not immediately intuitive and required training for the average user to use.

  • Chat history took up most of the screen and was irrelevant/distracting to users coming with an intent.

 
card.png

Reminders and Shortcut Cards Approach

  • Good discoverability for care options, users confidently navigated tasks during testing.

  • However, for first time users, understanding which care option they should pick was sometimes still an issue.

  • Enterprises are really enthusiastic about company programs/recommended actions for broadcasting initiatives and programs they are running.

  • The status bar above the search bar for allows crucial information (e.g. pending questions, claims, appointments, tasks) to be available-at-a-glance

 

Implementation

new top level pages

all@3x.png

enterprise specific top level page options

extratabs@3x.png

Care history views

history view@3x.png

now live on all devices

all+devices.jpg
 
app store review@3x.png