BeeWell

----

Simplifying healthcare through empathy-driven, accessible design.

BeeWell

----

Simplifying healthcare through empathy-driven, accessible design.

BeeWell

----

Simplifying healthcare through empathy-driven, accessible design.

beewell logo

"When we were contracted with Vivianne we were in the middle of a rapid tech evolution that required rapid, expert, and focused review of our interface. Vivianne jumped in, led us through a very clear and directed process which resulted in actionable results that gave us exactly what we needed, in a compressed timeframe, and on budget. We would highly recommend Vivianne, she is a joy to work with!"

Matt Womble, CEO of BeeWell

BeeWell simplifies how people engage with their health care. Their mobile application provides patients with information about every aspect of their medical care and helps physicians increase patient engagement and satisfaction. They asked me to conduct an accelerated User Research Engagement on their product in light of recent changes to their business strategy and product design. 

BeeWell simplifies how people engage with their health care. Their mobile application provides patients with information about every aspect of their medical care and helps physicians increase patient engagement and satisfaction. They asked me to conduct an accelerated User Research Engagement on their product in light of recent changes to their business strategy and product design. 

My Role

In light of a new business strategy, BeeWell needed to quickly identify usability issues within their new designs before shipping out their new product. They needed a UX Researcher to help them identify launched design decisions that were hindering their ability to meet their strategic goals and to help them think through user flows that would be affected by their new business strategy.

Primary Contributions:

  • UX Research
  • UX Strategy

The Challenge

As the sole UX Researcher on this project, my challenge was to: 

Collaborate with their visual designer to get their prototype ready for usability testing in a limited time frame.

Guide the BeeWell team to consider what requirements are necessary to create a MVP.

Research their competitors, how their patients engage with their product, and their audience's needs and pain points.

Apply best practices for accessibility and communicate how it should affect the design system.

Test multiple iterations of designs and make corrections for the next round of testing in a limited time frame. 

Goals & Approach

The goals for this User Research Engagement were the following:

  • Conduct user research and usability testing to improve their new approach and UI
  • Establish an onboarding workflow that is intuitive and simple
  • Identify and resolve any issues pertaining to usability and UX
  • Solidify the mobile app structure and design concepts
  • Identify and establish KPIs

My approach to this project covered three phases:

I. User Research

There were a number of user research tasks I needed to accomplish in order to help me understand BeeWell's current needs and potential solutions:

  • Review the original needs and user stories to determine what's changed and what still applies.
  • Recruit users for research and testing.
  • Develop scripts/surveys to elicit helpful feedback to inform the product’s design.
  • Conduct usability tests to see if users are able to complete core tasks that are crucial to the product's success.
  • Review users’ feedback regarding navigation and onboarding to enhance usability and the overall user experience.
  • Review the product in light of BeeWell's new business strategy and strategic goals and apply UX best practices.
  • Develop KPIs to help BeeWell track their product’s success and provide guidelines on how to track KPIs.

II. Discovery
Due to an accelerated timeline, I guided them through a Discovery Kickoff meeting and developed a comprehensive questionnaire for the BeeWell team to complete at the beginning of the project. The questionnaire was designed to help BeeWell explore their:

  • Business strategy
  • Positioning and competitive landscape
  • Project outcomes and aspirations
  • Audiences and engagement goals

III. Analysis & Recommendations
During this stage, I analyzed and synthesized all the data and information collected during user research, developed recommendations for the project, and presented them as a formal deliverable. The deliverable contained findings from my review and research, articulated their design and product requirements, and documented approaches for possible design revisions.

Results

The following was accomplished in this User Research Engagement:

  • Quick feedback that allowed us to create iterative design
  • Easy, intuitive onboarding process
  • Research-driven visual designs
  • KPIs and a methodology/protocol to capture and engage UX metrics
  • Real insights from real users that reflected BeeWell's current and prospective patients
  • A product that evokes trust and is empathetic to the needs of their audience

The following was accomplished in this User Research Engagement:

  • Quick feedback that allowed us to create iterative design
  • Easy, intuitive onboarding process
  • Research-driven visual designs
  • KPIs and a methodology/protocol to capture and engage UX metrics
  • Real insights from real users that reflected BeeWell's current and prospective patients
  • A product that evokes trust and is empathetic to the needs of their audience

The Process

Here is a brief overview on how I accomplished each goal:

Here is a brief overview on how I accomplished each goal:

GOAL: Research and test how to improve BeeWell's planned approach and UI

In order for me to deliver quantitative and qualitative insights to BeeWell on the needs, motivations and behaviors of their users, I needed to apply a range of tools and methods to the user research process. 

chart

Methods and tools used during this engagement include:

  •  UX Best Practices
  • Accessibility Standards
  • WireFraming
  • Remote Usability Testing (Moderated and Unmoderated)
  • In-Person Usability Testing
  • Guerrilla User Testing
  • Surveys & Interviews
  • Preference & Click Tests
  • Visual Attention Software
  • System Usability Scale (SUS)

A total of 64 participants were involved in this User Research Engagement. 

Methods and tools used during this engagement include:

  •  UX Best Practices
  • Accessibility Standards
  • WireFraming
  • Remote Usability Testing (Moderated and Unmoderated)
  • In-Person Usability Testing
  • Guerrilla User Testing
  • Surveys & Interviews
  • Preference & Click Tests
  • Visual Attention Software
  • System Usability Scale (SUS)

A total of 64 participants were involved in this User Research Engagement. 

GOAL: Establish an onboarding workflow that is intuitive and simple.

GOAL: Establish an onboarding workflow that is intuitive and simple.

Utilized Methods & Tools: UX Best Practices, Accessibility Standards, Surveys, Wireframing, Remote Usability Testing (Unmoderated), Guerrilla User Testing, Click Tests, and Visual Attention Software.  

GOAL: Establish an onboarding workflow that is intuitive and simple.

Utilized Methods & Tools: UX Best Practices, Accessibility Standards, Surveys, Wireframing, Remote Usability Testing (Unmoderated), Guerrilla User Testing, Click Tests, and Visual Attention Software.  

Log In and Welcome Screens

1. User Error: Their original designs didn't take into consideration user error. In case a prospective patient accidentally clicked Log In, the "Need to Register" ensures that a prospective patient is redirected to the registration process.

Log In and Welcome Screens2

1. Splash Screen: The app needed a design for what appears while the app is loading. 

2. Register & Log In: Their original designs needed to consider two distinct Call to Actions and they needed to be placed at the bottom of each onboarding screen. 

3. Learn More: Healthcare apps require a level of vulnerability most designers overlook. We included information screens that gave the prospective patient a look inside the app in hopes of creating trust.

1. Splash Screen: The app needed a design for what appears while the app is loading. 

2. Register & Log In: Their original designs needed to consider two distinct Call to Actions and they needed to be placed at the bottom of each onboarding screen. 

3. Learn More: Healthcare apps require a level of vulnerability most designers overlook. We included information screens that gave the prospective patient a look inside the app in hopes of creating trust.

Onboarding1

1. Progress Bar: To help decrease the number of prospective users abandoning the app during registration, I implemented a progress bar in their onboarding process.

2-3. When CTA Appears: Instead of having the CTA treated with an inactive style until an input is selected, I decided to have the CTA remain hidden until after an input was selected,which would prompt the CTA to appear. This decision was a direction reflection of what I learned during the application of the Visual Attention Software.

1. Progress Bar: To help decrease the number of prospective users abandoning the app during registration, I implemented a progress bar in their onboarding process.

2-3. When CTA Appears: Instead of having the CTA treated with an inactive style until an input is selected, I decided to have the CTA remain hidden until after an input was selected,which would prompt the CTA to appear. This decision was a direction reflection of what I learned during the application of the Visual Attention Software.

click test

Click Test. I decided to test the original screen BeeWell designed (on the right) and an alternative one that removed the CTA (on the left). I then recruited two separate groups of participants to answer the following prompt: Where would you click first? 

Not only did everyone who was assigned the alternative design correctly completed the task, but they did so an everage of 4.3 seconds faster, affirming that the design drove them to engage more effectively than the original design.

Screen Shot 2017-10-01 at 4.04.04 PM

The Visual Attention Software. This Tool predicts the areas & objects that are likely to attract our first glance. The original visual treatment of the CTA barely catches the user's attention; in order to drive engagement, I advised the BeeWell team to adjust the visual treatment of the CTA so that it's hidden on the screen. 

The Visual Attention Software. This Tool predicts the areas & objects that are likely to attract our first glance. The original visual treatment of the CTA barely catches the user's attention; in order to drive engagement, I advised the BeeWell team to adjust the visual treatment of the CTA so that it's hidden on the screen. 

Screen Shot 2017-10-01 at 4.11.49 PM

Privacy. The original designs had a social networking feature that would publicly identify patients by their first and last name. However, after surveying 30+ participants, we altered the designs to have patients publically identified by their username, with additional privacy settings. 

Privacy. The original designs had a social networking feature that would publicly identify patients by their first and last name. However, after surveying 30+ participants, we altered the designs to have patients publically identified by their username, with additional privacy settings. 

Onboarding2

Establishing Trust. We want to delay asking users for personal information until the last step of registering. It's communicates that they're almost done and it allows us more time to establish trust and explain why we need this information.

Celebrating Success. We need to leverage every opportunity to celebrate a user completing a desired task. Rewarding users with praise will encourage them to continue engaging the app. 

GOAL: Identify and resolve any issues pertaining to usability and user experience and solidify the app structure and design concepts.

Group 34

Iterative Process. In light of my client's tight deadline, I took an iterative approach to this project.

Iterative Process. In light of my client's tight deadline, I took an iterative approach to this project.

Iterative Process. In light of my client's tight deadline, I took an iterative approach to this project.

Group 28

User Engagement. I used the Visual Attention Software to help us make quick visual iterations. You can see how the design on the right went through iterations that forced the user to pay attention to all the different elements of the page, whereas the original design (on the left) caused users to glance over key tasks BeeWell wanted them to complete. 

User Engagement. I used the Visual Attention Software to help us make quick visual iterations. You can see how the design on the right went through iterations that forced the user to pay attention to all the different elements of the page, whereas the original design (on the left) caused users to glance over key tasks BeeWell wanted them to complete. 

Group 29

Icon Usability. A common thread of concern that surfaced in usability testing and interviews was confusion about the icons on the bottom navigation bar. We designed an iteration that had the icons labeled and then provided two groups of participants with the follow prompt: There are daily and weekly steps to check off as you prepare for your knee replacement surgery. Where would you click to see which steps are overdue?

Without labels, users took almost 3x longer to complete the task. Not only did we add labels, but in a later iteration we also changed the icon to a more recognizable checklist since some users complained that it looked like a clock. 

Group 31

Content Structure. The information BeeWell provided in their Discovery Questionnaire, along with additional user research gathered throughout the project, revealed that their primary audience were men and women over 50 years old. In light of this, we needed to keep accessibility in mind, starting with the way long pieces of text were structured. In order for their content to be successful, I advised BeeWell to:

  • Remember Accessibility: font size should be no smaller than 16px and padding on the top and bottom of input bars should be at least 20px.
  • No All Caps Words: stay away from placing headings and other text in caps; for patients who struggle with seeing, words that are completely capitalized may appear to look too square-like. 
  • Distinguish Call to Action Buttons: at the bottom of some pages, they had a "Continue Reading" button that had the same length and similar visual treatment to the bottom navigation bar. I recommend that they visually treat them differently, so as to limit the possibility of users feeling frustrated or confused.
  • Check Spelling: during several usability tests I had participants point out misspellings; while this may seem small, spelling errors can cause users to see the product as not credible or trustworthy.
  • Paragraph Length: should be no more than 4-5 lines, especially in light of their audience.
  • Copy: most of their copy was written by physicians; I encouraged them to write copy that is more relatable easier to read, as several participants commented that the copy seemed overwhelming and wordy. 
Group 32

Your Audience Knows Best. I recruited people to participate in interviews, surveys and usability testing who could be potential patients using BeeWell's app. I wanted to make sure that the participants could fully immerse themselves in the prompt or described situation they had to embody before using the app. Here are some helpful insights from the participants that influenced design:

  •  "I'd like some more help screens, it's hard to know what to do on this page and I'd like the option to have help or not."
  • "The orange color of the progress bar makes me feel stressed. I imagine that if I'm using this app there is already enough stress in my life."
  • "I had no idea that 'Steps Due' and 'Overdue Steps" on my profile page are clickable. How would I know to click there? I only discovered it by accident."
  • "It's difficult to read the text that's in all caps. Also the text is too small and there isn't an option for me to make the size bigger. I don't want to have to always use my reading glasses when I'm using this app." 

System Usability Scale. Each participant who completed a usability test also completed the System Usability Scale, a technology-agnostic questionnaire for quantifying the usability a design system. Each user responds to 10 questions using a five-point scale where 1 means "strongly disagree" and 5 means "strongly agree" (you can read these questions here). An algorithm then generates a score that reflects the usability of a system.

The average score is 68 and BeeWell scored a 83.5 at the end of our User Research Engagement.

Bitmap

GOAL: Identify and establish KPIs.

I was able to provide BeeWell with KPI needed to see how successful their product was doing, along with a guide on best practices for seeking out that information and a list of helpful (and free) tools and software to help them. I am unable to share the specifics for this case study.

Opportunities

Not only did I deliver BeeWell qualitative and quantitative research throughout an iterative and well-documented process, but I also presented them a comprehensive list of opportunities they can take advantage of in the near future. Here a some examples:

  • Additional Features: in light of a tight deadline and a limited budget, I had to remind BeeWell of the importance of designing an MVP, causing them to prioritize some features for a later launch.  
  • Research-Driven Designs in Sales Pitches: BeeWell can talk about the intense level of user research and testing that went into their product, ensuring that they have a product that is in demand and is easy and intuitive to use.
  • Gamification: leverage the benefits of positive reinforcement by adding an element of gamification in the product.
  • Diversity in Imagery: since stock images are limited when it comes to minorities in healthcare, I encouraged them to consider investing in a photographer to provide those images. This will be an important investment as their app increases in popularity and brings with it a more diverse audience.

Vivianne Castillo  © 2018