Overview
Problem
Users can’t easily find the documents they’re looking for on Regence.com due to an unintuitive document hierarchy, the large number of documents available, and inconsistent experience across audience type.
The current forms and docs page types are different across all lines of business and not leveraging the existing design system. Stakeholders need a way to standardize the experience for each audience type and elevate the experience to be more user-focused.
Background
Forms and documents have always been a pain point in the regence.com experience. A while back we knew we wanted to add more functionality to the audience specific sites and a team began working on the Individual and Family site during the Regence.com refresh. After working on the Individual and family site, managers realized this would not be a small thing to update as the requirements for other audiences differed drastically.
Project Information
Role owned: UX Designer
Duration: 6 months
Tools: Figma, Mixpanel, UserTesting
Project Goals
Create a consistent experience across all forms and docs pages
Reduce user confusion and improve the user experience by using data-backed designs
Bring the look and feel of Digital First to the public website by leveraging the design system
Current designs
Web views of the public forms and docs page on Regence.com
Responsive mobile views of the public forms and docs page on Regence.com
Business problem
Losing credibility with users
Confusion on how to navigate the pages to locate sensitive forms and documents makes it hard for users to put their trust in Regence as a provider
Confusing elements on these pages results in a high volume of calls to our Customer Service Portal, which limits our customer service reps from helping out other customers
Loss of sales
A large amount of Regence’s revenue comes from the Producer group and their sales. Loss of sales is a direct result of Producers being unable to locate the correct forms needed in order to complete their task
Degrade relationship with Employers group
Inability to find the forms and docs needed hurts our Employer groups from wanting to retain a business relationship with Regence.com
Landing page explorations
Individuals/Families
As this project aims to replicate the designs previously implemented for the individuals/families forms and docs page, there were minimal changes to the designs on this page.
The main stylistic change to this page takes place in the header banner, where I saw opportunities to introduce a content block that aims to surface popular or most used forms and documents to users, to lessen the need to browse through the whole list.
Medicare members
Medicare forms and documents need to compliant with state laws—this means not having the forms and documents for different Medicare groups be mixed together, surfacing correct forms and documents based on location, and displaying external links that cannot be handled by the DAM. As a result, the landing page designs for this audience type went through several iterations, each time evolving with the specific set of rules we needed to adhere to.
In order to keep these documents separated, I explored a tabbed component option and although it was visually well received, it was
not compliant. In order to reduce workload and ensure that we stay
compliant, I took the original Medicare landing page and gave it
visual treatments using design system patterns to still achieve the
project’s goal of being more in line with our new Digital First platform
designs and being more visually engaging for users.
Employers group
The Employers group landing page retained the stylistic approach of the individuals/families page. Although I did explore inserting a tabbed component feature to separate the group sizes (S, M, L), I ultimately ended up with a simpler approach of putting the group sizes in a filter in order to reduce redundancy in the design and lighten the workload for development.
Producers group
The Producer forms and docs page essentially carries the same set of documents for four different audience types. For example: there are Producer forms and documents for Individuals/Families, Medicare, Employers, and a miscellaneous group of forms and documents.
Unlike the forms and documents for Medicare users, Producer documents for Medicare members don’t need to comply to the same display rules, so I implemented a tabbed component for each audience type, allowing the producers to easily move back and forth between each tabs to find the forms and docs they require.
Providers group
The current Providers forms and docs landing page is a long list of copy for each category, with the forms and docs not integrated in the proper Digital Asset Management tool we use to manage forms and documents on the website.
The first step I took was to determine which link on the page is a form and doc and which was sending the user to another landing page. Then I organized the forms and docs into a data table using the design pattern for these page types.
Due to the specific needs of this page type, I introduced new display rules that would show and hide content based on the category that was applied.
Global functionalities
Additional filters
I added more options for filtering in order to make searching
for a document through filters more accurate.
Applied filter pills
When a filter is applied, a representative filter pill is added to the filter box to indicate a filter has been applied. The addition of the filter pill allow users to easily remove that filter if needed, without having to find and then uncheck that filter within the dropdown menus.
Display rules
The Providers forms and docs page have hidden content that is only applicable to certain categories, so I added additional display rules to this page type to
allow stakeholders to customize that information if needed.
Integrated tool tips
Some documents require additional information, so I added the ability to
add a tool tip that will appear next to the form or document when users
hover or click on the tooltip.
Responsive web
This project includes designing across different devices and platforms. This video shows what the process looks like on a responsive mobile website, where producers are looking at Medicare documents and filtering for Pharmacy & Rx documents. It also shows how the filter pills work and what happens when a user clicks on the external pharmacy links.
For the responsive mobile web view, I swapped out the traditional filter design pattern that was used on the web view to a filter box pattern for more usability within a smaller screen size.
Authenticated web experience
As a part of the organization’s ongoing Digital First effort, I looked at how we can integrate native features and designs to the authenticated website to maintain a more seamless experience for users. As the current experience is an iframed page on the classic experience, notable explorations included looking at re-organizing content on the Medicare landing page, adding frequently used action cards, forms in list views, and forms in a classic data table view.
Early explorations
Early explorations of the authenticated web experience for forms and docs. We organized pain points and user needs to determine what the task at hand is for the user when interacting with the page. This also sets the foundation for the upcoming user testing.
Layout explorations for Individuals/Families
For the individuals/families experience, I explored two different types of layouts: a list form and a classic data table layout. The list experience allows for a better responsive layout and allows for more space to explore and integrate new design patterns within Digital First. The classic data table experience is a familiar design pattern but poses an issue on mobile.
Medicare explorations
To stay compliant with Medicare requirements, I explored a tab component to separate the forms based on plan type and instilled the list layout to set up initial testing for Medicare members.
Usability testing
As part of the project’s next steps, I am partnering with a User Researcher to recruit users, develop testing plans and execute the testing phase of the project. Research has not been completed as the main goal of this project was focused on the public site.
Testing goals
Evaluate the discoverability of the page
A high volume of complaints related to the forms and docs page had to do with users being unable to find the pages
Determine which version of the layout users preferred
Determine if users can successfully complete the task of finding a specific document using a set of filters
Surface frequently taken actions on these pages
Testing methods
A/B Testing for layout
Contextual inquiry
Prototype testing
Heat map analysis
Measures of success
Increase usage on page
Reduce numbers of customer service calls regarding forms and docs
Positive feedback from users and stakeholders
Limitations + next steps
Next steps
Move into research for the authenticated website
Examine initial reactions to the new public site pages
Possible exploration for native mobile app features, which includes native form submissions
Limitations we’ve faced
Technical debts from previous iterations
Lack of accountability on forms and docs once they are released to the public
Tight deadlines to make 2022 Q2 release goals causing more pushbacks
New compliance issues for Medicare and Provider groups at the last hour