Redesigning Payment Solutions for Echo Health Inc
About the Client
ECHO Health, Inc. is a revolutionary payment solutions company for healthcare payers of all sizes.
Payers, vendors, employers, providers and members benefit from the association with ECHO, realizing dramatic reductions in the costs of fulfilment and customer service. ECHO’s services comply with ERISA (Employee Retirement Income Security Act), HIPAA (Health Insurance Portability and Accountability Act), CORE (Committee on Operating Rules for Information Exchange), OFAC (Office of Foreign Assets Control), and Taft-Hartley regulations.
The Problem
Just like most of the mid- to large-size companies today, ECHO was using an insanely outdated legacy app. We had to redesign the whole application with additional features for an enhanced experience thus increasing productivity.
The scale of complexity was higher than B2C apps I designed earlier, due to innumerable factors like multiple data states, visualization options, management operations, multiple-user collaboration and integrations with other software. Every design decision made to satisfy one requirement further affects many other requirements, sometimes in ways which are difficult to predict. A seemingly simple feature addition has to go through all kinds of checks and edge-case considerations
Another Challenge was designing with integrations in mind. Acknowledging that existing ecosystem of tools users wrangle, client was not willing to go down a road with yet another solution that can’t integrate with their existing tools or provide some way to carry over parts of the legacy system into the new system.
Few screenshots from the legacy app that were being used when we started this project.
My Role
I was part of the pitch team and responsible for the experience strategy and re-design of the web app. I lead the UX work, producing all major deliverables and presenting these to the stakeholders.
Building trust and empathy
This was the first time our team have worked on an app in healthcare background. We struggled initially with the vocabulary and jargons during meetings with stakeholders. It was quite clear that designing internal tools for ECHO requires an understanding of its organization’s culture, from the basic mindset to the quirks that make it unique.
The whole team were given various training sessions including HIPPA/OSHA so that we understand the business domain and language clients use. Different organizations have different vocabularies, which reveal the way they think.
Once we made sure that we all are on the same page, We opted for a lean approach which emphasised rapid sketching, prototyping, user feedback and design mockups. This created early team‐wide alignment, sparked tons of great ideas and created a strong sense of ownership across different disciplines within my organisation. Meeting with key stakeholders helped us to understand their business challenges. Together we identified risks and aligned on expectations and constructed a shared vision for the app.
Content Audit
I conducted a full content inventory of the legacy app with the help of our Business Analyst. This task helped us to get a much better understanding of the existing information architecture, which was crucial for designing new Information architecture and identifying duplication and understanding all kinds of relationships in the content. We got crucial informations on optimising and enhancing the product’s functionality based on the knowledge we gathered in this phase.
Redesigned Information Architecture
Heuristic evaluation
Heuristic evaluation can be performed at any stage of the design process. However, we decided to conduct one at the very beginning to identify existing usability issues as early as possible.
My goal was to apply Nielsen’s heuristics to critique the legacy user interface design and work my way through each task, while keeping a list of the heuristics handy. As I discovered usability problems within the application, I made sure to write them down and take a screenshot and later sorted the list based on the level of severity.
Personas
One of the advantages of enterprise is that you have a guaranteed customer base. You have the monopoly! The application we design will be used by people at least 40–60 hours a week.
But problem is the divide between the user and the client can be vast. The stakeholders we interact on a daily basis will not represent the actual user. Just like any enterprise-scale bureaucracy, the clients in charge of UX projects are often in higher-level management roles. Even-though they typically have an invaluable grasp of the big picture, they may not completely realize the everyday needs of the people who will use the software.
Keeping this in mind we made the stakeholders understand the need to keep the actual users in loop and once we got the buy in, setting aside some time to answer our questions became part of their job. After that it was a cakewalk, we gathered the user data and created two primary personas and used it constantly throughout the project to guide design decisions and priorities.
User flows
I created user flows for each task. This helped ensure that each flow was prioritized and obstacle-free.
Wireframes
Wireframes were initially sketched out on paper for ideation and after several iterations, I recreated them on Sketch for rapid prototyping and user testing purpose.
Conducting Usability Tests
Clickable prototype of the wireframes were created with Sketch and InVision and then we started usability tests. I created the test plan and facilitated all the test sessions. There were 4-5 users per test sessions and I took notes and key qualitative and quantitative metrics were captured.
All the tests were conducted online since in-person lab tests were not feasible. I used Skype to connect with the user and shared the link and facilitated the tests online with quicktime screen recorder to capture the test sessions. After analysing the test data and user interview feedbacks we were able to identify design issues and recommend solutions. These test reports helped me to defend design decisions and validate design concepts.
Key Problems identified
01) Users were not able to review crucial payment related information on the individual cards due to the lack of space.
02) One of the frequent task ‘provider setup’ was hidden under a menu limiting access
03) Payment options were not understood
04) 90% of the users did not use ‘Add Provider’ due to lack of privileges.
Solutions
I redesigned the card layout to a scalable table structure to accommodate all payment informations and and each row were given provider setup access for effortless operation. We decided to move the ‘Add Provider’ component to Administrator screen and kept a separate carousel to switch through payment data.
Redesigned Wireframe
High fidelity version
We used a combination of Sketch and Github for creating our design system.
The biggest challenge was to convince the stake holders and ensure 'buy-in' for creating a design system. During the meetings I demonstrated the ROI for the effort and we convinced them that it can save huge time and costs of coding and redesigning when we use an established framework to provide consistency.
With the limited time and budget, We designed essential components, patterns, templates and color guides and compiled them on a master Sketch file and stored it on a shared drive. Developers created code snippets, angular components and CSS architecture alongside and used Github for the check-in.
High Fidelity Mockups & Interactive Prototyping
With design system in place, I designed all high fidelity screens for MVP.
Dark Mode Design
Design Handoff
All the completed screens including the edge cases and empty states were uploaded to zeplin for implementation along with the design system.
Test again
We tested the HTML prototype again to find any remaining issues and engineer out the flaws from a cognitive standpoint.
Final thoughts
Creating a design system not only created consistency in the ECHO DA but the process helped ease the design implementation challenges of ECHO’s larger goal: transition all ECHO products to have same design language and unified brand experience. This project is far from over but I’m extremely proud of the progress we made so far.