IW Details.

A complete redesign of the existing Injured Worker (IW) Details page, making it easier for adjusters to manage their injured workers.

Web app

Product redesign

Fall 2021

Desktop render of IW Details

Overview

Gain Life is building a better claims experience for all parties. We allow adjusters to take better care of their injured workers (IW) and staff while improving claim outcomes. I was in charge of completely redesigning the Injured Worker Details Page, which allows adjusters to manage their injured workers.

My role

Interaction Designer
Visual Designer
Prototyper

Team

1 Design Manager
1 Designer (Me!)
1 Customer Operations
1 Full-Stack Developer

Technologies

Figma
UsabilityHub
‍React

The adjuster facing product.

During the worker's compensation claims process, adjusters are in charge of managing one to several injured workers as they recover. Our product allows adjusters to communicate and manage injured workers in one.

However, many key details like documents and specific injured worker information are hidden a layer beneath the main page (Currently split into 2 screens).

Original product screen 1Original product screen 2

Hierarchy issues.

Gain Life's adjuster platform currently places most of the important information a page beneath the main claims content. However, this information happens to be most important to adjusters. There also exists duplicate information from the main page on this page.

Site map showing duplicate and important info

Key problem areas.

Documents and key details are hiddenVisually inconsistentMultiple claims cannot be displayedLots of duplicate info

Opportunity.

Reduce duplicate info and bring visibility to important content

1. Duplicate info

Duplicate information takes up a lot of space and pushes down important content.

2. Documents

A key value moment for adjusters is being able to view all injured worker documents.

3. IW info

Injured worker information is essential when managing claims and compensation.

Early design iterations.

Three concepts were created in the form of wireframes. I worked in low to mid-fidelity and checked in with stakeholders and my design manager early and often to determine the best course of action.

After meeting with the development team and stakeholders, we eliminated the two column designs present in Version 1 and 3. However, we wanted to the modularity of those versions, which resulted in a completely hi-fi new version.

Wireframe version 1Wireframe version 2Wireframe version 3High fidelity version 1

1st round of user testing.

The team created two split remote user tests for with five key scenarios for the two high-fidelity versions for 60 participants. Our adjusters were of older age.

The results were quite surprising as the designs were not usable. Below are the results for expected completion time and percentage across both versions.

1 — What would you click to view a different claim for this injured worker?

A total 33.25% of participants completed all steps in an average of 55.25 seconds.

Scenario 1 heatmap comparison

2 — What would you click to view the Medical Authorization Form?

A total 81.75% of participants completed all steps in an average of 15.33 seconds.

Scenario 2 heatmap comparison

3— What would you click to send an injured worker a new document?

A total 13.16% of participants completed all steps in an average of 48.75 seconds.

Scenario 3 heatmap comparison

4 — What would you click to send a new message to the IW?

A total 69.83% of participants completed all steps in an average of 12.67 seconds.

Scenario 4 heatmap comparison

5 — How would you edit the team members on this claim?

A total 51.92% of participants completed all steps in an average of 13.08 seconds.

Scenario 5 heatmap comparison

1st round results.

Users got lost when looking for information because both pages had poor hierarchy to highlight important information. A majority of users didn't even know how to switch between claims, find and send documents, and message.

Slow completion timesVery low success ratesPoor page heirarchyKey value moments for adjusters aren't highlighted

Key decisions.

Combine successful aspects of the versions and emphasize key sections

Final designs.

Final page designComparing old versus newDecisions behind top barDecisions behind overview sectionDecisions behind each section

Implementation difficulties.

The hardest problems were handling the business scaling and edge cases. As we were expanding to new lines of business, many new requirements came into play, which gradually added more design elements.

The UI changing based on the customer environment made it hard to balance customer requests into one clean UI. Edge case handling was easily the most difficult part of the entire design process for me.

In the future, I would try to make a log of possible edge cases first, and work directly with engineering to see how they would be handled before designing.

Impact after redesign.

Impact 1Impact 2Impact 3Adjusters appreciate how the page is redesign since info is in one place

Learnings.

  • Focus on more use cases and user needs (new clients were coming in with many requirements) which forced us to make a couple last minute changes to universally conform to their needs (some aspects of the final version could've easily been considered)
  • Check in with development early on to make sure certain things are implementable (Adjusting to the current app margins, adding in new buttons and stuff based on new / incoming clients etc)

Next steps

The redesigned IW detail page has already been implemented! The first steps include monitoring the health of the page and seeing if the results of our initial tests match the results as we head into the rest of the Q1 2022.

Desktop render of IW Details

This website was designed from scratch in Figma and implemented in Webflow by Rikin Patel in 2021.