HealthEquity COBRA Mobile
Project Overview
Problem
The overarching issue with the mobile screens was the design inconsistencies and overall lack of updates made to it after multiple improvements made to the design library that has defined its user experience principles.
The mobile responsiveness of the application needed to be addressed as well for further iterations that would be rolled out for the tablet and desktop versions to ensure the best experience possible.
COBRA mobile is a comprehensive platform that manages everything end to end such as billing and collection, eligibility reporting, etc.
Before
Solution
The redesign of the COBRA mobile screens served to better match the user’s expectations when it came to keeping the product consistent with the other products housed by HealthyEquity. This initiative will also allow HealthEquity to support future redesigns and streamline their products.
Focusing on accessibility design to ease the user so that anyone interacting with these screens, regardless of ability levels, can enjoy the product and have the best user experience available to them.
After
Role
I was the main designer leading this project in Q3. I worked with two other designers whom I presented my designs to regularly to get their feedback.
The Problem
User Problem
There were issues with functionality regarding the misuse of buttons, such as radio buttons, and other elements on the screens that made it difficult for users to effectively use the product to its maximum potential.
Users did not feel they were able to take advantage of the application. The ability to add multiple dependents to their healthcare plan impeded that particular action. Without the proper usage of elements, critical tasks were nearly impossible to complete or required additional, unnecessary steps.
Business Problem
The inconsistencies regarding the design detracted the product from the brand of the company. Brand consistency is an important aspect of HealthEquity that is pushed heavily, and the COBRA screens were deterring from their brand values.
The user experience is destroyed by poor brand consistency which makes it harder for users to engage with the product.
Goals
User Goals
We want to empower users throughout the enrollment process and that all forms of communication relating to payment are accessible to them. This allows users to have more power in how they manage their accounts and money.
Business Goals
We want to ensure all users have the capabilities to manage their accounts and use COBRA to minimize late or missed payments which disrupts the flow of revenue to the company.
Design Process
We know from previous user research that users needed an updated and streamlined mobile application that addressed accessibility issues regarding colors, text styles, sizes, and grid spacing. There were also some functionality issues such as the use of radio buttons despite the user needing multi-select functionality.
The first round of edits involved updating all elements in each screen up to par with the current design system standards.
Updating the components used on the screens, fixing spacing issues and using a 4px baseline grid, etc.
Following the first round of edits, there was a preference for using a lighter tone of purple as the active color when a selection was selected, as well as increasing the text sizes even more for accessibility purposes.
The second iteration of these mobile screens fleshed out functionality and accessibility seeing as checkboxes were utilized as opposed to radio buttons and colors and sizes of various elements were enlarged for the ease of the user.
The user flow throughout the enrollment process needed to be understood to understand the various interactions.
The components that were utilized were in need of an update using the updated components in the design system to keep this product streamlined with the other products by HealthEquity.
Design System
The implementation of the new components and elements present in the design system were essential in streamlining COBRA mobile and bringing it up to par with the set standards.
Adherence to the UI style guide which includes colors, iconography, typography, etc. ensured that the product was consistent with the brand and communicate the company’s message to the customer.
Results
As a result of implementing the current design system and updating various components within the design system, the mobile screens were able to be rolled out to the COBRA mobile users.
Many improvements were actualized through this process that led to a more cohesive product for the company, as well as an application that was fully functional and usable.