Select Page

Connecting During Crisis

A mental health center with multiple community sites needed to provide virtual appointments quickly.

Problem

In 2020, the mental health center needed to pivot to online appointments quickly to serve their patients during COVID. They built an MVP app, but it wasn’t getting much adoption.

Solution

Review the MVP version of the app and make UX recommendations. Collaborate with developers to launch enhancements in 2-week agile sprints. 

My Role:

Lead UX Designer (research, strategy, design, writing)

Methods:

Heuristic Evaluation, Content Audit, Information Architecture, User Flows, Component Library, UI Design, QA testing

Tools:

Adobe Xd, Miro

Partners:

UX Designer, Developers, QA, Product Owner

Research

  • Reviewed existing personas
  • Conducted a Heuristic Evaluation.

I compared each feature or flow against Nielsen’s 10 principles for interaction design, plus 2 additional heuristics helpful to this product (Extraordinary users, Structure of information)

 

Prioritization

  • Prioritized recommendations
  • Presented to stakeholders to define the roadmap

Working in 2-week sprints, it was not possible to make all of the enhancements at once.

Prioritizing high-impact, low-effort tasks gave us big wins right away. We decided to start with UI enhancements to the home and appointment screens, and  improvements to the cancelation flow.

UX Design

  • Defined hierarchy
  • Added navigation in expected places
  • Increased legibility with colors and whitespace
  • Updated the look and feel to be softer and calming

 

UX Writing

  • Shorter
  • Less technical
  • Actionable
  • Neutral in tone

Since this is a mental health app, some people may not be having a “Good Afternoon!” The change to “Hi there” is friendly while respectful.

Improving the Cancelation Flow

  • Met accessibility color contrast ratios
  • Supported recognition over recall
  • Reduced from 5 screens to 4 (while also adding a step)
  • Captured enhanced information for staff, to help with follow up

 

Dealing with Constraints

It is not possible to reschedule in the app (due to business reasons, ratehr than technical). So we clarified and directed users to what they could do.

Component Library

  • Built reusable components in Adobe Xd and Flutter
  • Met accessibility color contrast ratios, improved legibility

Illustrations

  • Selected stock art to save time and budget
  • Updated skin tone and head coverings to represented diverse people

Next Steps

The client was happy with the work we produced in the first few agile sprints. We continued to work with them for a year enhancing and adding more features, including:

  • registration flow
  • appointment details
  • pre-appointment forms
  • notifications
  • pharmacy integration 

“I really like the UI enhancements. It’s really helped bring our app to another level of maturity.”

Product Owner, Mental Health Center

Anika’s Advice

Building reusable components and working daily with developers makes a project move efficiently.