Case Study: Evolution1

Evolution1 (acquired by WEX, Inc.) is the largest electronic payment, on-premise, and cloud-based healthcare solution for reimbursement accounts (HSAs and FSAs) in the United States. They came to us to help them redesign Consumer Portal, a brand-able and highly customizable SaaS solution for customers to manage their healthcare reimbursement accounts.

The Challenge

Evolution1 conducted surveys among their users and provided us with the main pain points. In solving these areas, our biggest challenges were simplifying the navigation, combining three different enrollment processes (1plan, HSA, and reimbursement accounts) into one unified experience, and designing for an older audience who were new to healthcare and not very tech-savvy.

Information Architecture

We tackled navigation issues through information architecture. We documented the existing information architecture’s pages, elements, and actions and then rearranged them by hierarchy and a workflow that made sense. By working in IA, we could quickly iterate and incorporate new features and soon produced an intuitive navigational structure that could scale and include future features.

evolution1_ia

Wireframe Concepts

As we started to lay out each screen and the flow, there were many ways to accomplish the same goal, so we provided Evolution1 with two different concepts emphasizing different things (summary views and highlighted primary actions, versus use of color and iconography for easily scannable information). They chose one concept with which to proceed but also incorporated elements from the other concept.

evolution1_wireframe_concepts-3

Wireframe Everything

We produced wireframes for the other flows based on the concept chosen. Our wireframes covered many flows, such as filing claims, contributing to your HSA, requesting HSA distributions, tracking expenses, paying expenses, managing account activity, viewing statements and documents, and more. In total, we designed over 50 screens (not including concepts and iterations) so that all of the flows would have the same user experience.

evolution1_wireframes_all

Visual Design

After the functionality and flows were hammered out in the wireframes, we applied visual design. We used whites and blues for a clean, neutral look and reserved brighter colors for data visualizations and important statuses or notifications. Applying the same appearance to every flow unified the entire experience.

evolution1_visual

Making It Simple

To make the Consumer Portal friendly to an audience new to healthcare and technology, we simplified the wording throughout the site and made all actions and processes clear. We made an “I want to…” section listing out the most commonly used actions. For processes, we broke them down into visible steps, so the user knows what each section entails and what information is needed next. Throughout the site, we inserted help tips which upon hover would explain a term or process.

evolution1_simple

Handing It Off

At the end of the process, we delivered a style guide documenting all elements and interactions so that future features would be consistent with the user experience.

evolution1_styleguide

Before and After

evolution1_before_after

Summary

When Evolution1 came to us to redesign their Consumer Portal, we solved their users’ pain points by reorganizing the navigation into an intuitive structure, applying consistent visual design and interaction across all flows, and simplifying complex healthcare terms and processes, clearly explaining terms and providing users help and tips along the way. After working with us, Evolution1 can now continue to expand on their redesigned Consumer Portal and maintain the same great user experience.

More Work