CAS Confirmation

EarnUp is a consumer-first financial technology platform that intelligently automates loan payment scheduling and provides savings options to prepare for homeownership.

OVERVIEW

Team

Sharon Langevin - Product Manager
Me - Product Designer
Zackary Stallings  - Lead FE Developer

Deliverables

User Research
Information Architecture
Visual Design/Prototype

Tools & Software

Sketch
InVision
Principle
Abstract

Problem Definition

Enrollment confirmation is a slow and error-prone process. Customer happiness agents need a streamlined process that allows them to more efficiently enroll new customers and increase the percentage of customers who are successfully enrolled.

Our high level goals were to:

01 Migrate the enrollment process from Salesforce into CAS, our agents’ internal tool

02 Decrease time spent per enrollment

03 Decrease the occurrence of errors in the enrollment process

04 Increase likelihood of confirmation

My Role

I led the complete design and research process in collaboration with 1 Product Manager.  The new CAS designs are set for development in January 2021.

Kickoff

Setting Design Requirements

To kickoff design for this project, my PM and I discussed the design requirements to ensure alighnment with the overarching business goals. With our intent of automating more of the enrollment process, we needed a design that would effectively scale and push us forward. I started by doing an initial audit of the current state of CAS.

01 Establishing an entry point

Since users’ eyes are initially drawn to the upper right corner of the viewport, I determined that the best placement to notify agents of a customer’s incomplete confirmation status would be within this area. On calls, agents also focus here to identify customers by name, address, and date of birth. See EarnUp - Notes on more of my observational research into the agent workflow.

02 Visual design and usability

Another initiative within this project was to update the visual design. According to the aesthetic usability effect, users perceive an aesthetically pleasing design as more usable. The CAS dashboard’s UI was thus hindering it’s perceived usability.

03 Alignment and Hierarchy

The lack of consistent text alignment within the CAS dashboard and overuse of text formatting, decreased it’s usability. To ensure that incomplete confirmation could be identified quickly, the dashboard needed a consistent design for agents.

01 Establishing an entry point

Since users’ eyes are initially drawn to the upper right corner of the viewport, I determined that the best placement to notify agents of a customer’s incomplete confirmation status would be within this area. On calls, agents also focus within this area to identify customers by first name, address, and date of birth. See EarnUp - Noteson more of my observational research into the agent workflow.

02 Visual design and usability

Another initiative within this project was to update the visual design. According to the aesthetic usability effect,users perceive an aesthetically pleasing design as more usable. The CAS dashboard’s UI was thus hindering it’s perceived usability.

03Alignment and Hierarchy

The lack of consistent text alignment within the CAS dashboard and overuse of text formatting, decreased it’s usability. To ensure that incomplete confirmation could be identified quickly, the dashboard needed a consistent design for agents.

How we got there

Information Architecture

I explored different design solutions with low-fidelity mocks using our component library that focused on allowing agents to complete the confirmation process efficiently. Based on the initial product requirements, design needed to account for a multi-step process so I explored different layouts by focusing on two key areas within the viewport: customer data and navigation.

Customer Data

Agents will be using data inputted by customers in the verification process. They need a clear view of customer data that is editable in the case of customer errors before confirming can occur. As the most important information in the flow, I ensured that all options prioritized placement of customer data.

OPTION A
Customer data is clearly visible
Agents can filter sections by status
Unnatural layout, defies higher-to-lower heirarchical structure
Navigation

Agents need to be able to jump through different sections within the verification process as they may be unable to confirm a section in one sitting. Thus, I designed each section in all options to have it’s own status so that agents can come back to the flow and continue where they left off.

OPTION B
Customer data is clearly visible
Natural layout with left navigation

Re-Evaluating Designs

A Design Pivot

Further investigation into the current CAS enrollment process and goals within the Operations team helped me identify other design limitations before moving forward. With the move to a more automated process, agents would be relying more on submitted documents from customers. As such, the designs needed to account for side-by-side document comparison as the default experience.

Initally, I used the layout within Option B above to explore how documents can be accessed by agents through the confirmation process.

However, this design would hinder agents from having a side-by-side comparison, more than likely increasing the likelihood of errors from agents.

In order to ensure agents are able to have more direct access to document comparisons and simultaneously edit customer data, I adjusted the initial layout accordingly.

The right panel design allows agents to edit customer data while comparing it to the information provided in the document preview. And the top navigation forces a horizontal scanning direction that allows agents to easily access the different sections within the confirmation process.

Outliers

Special Use Cases

Before finalizing the design, I took account of special use cases to ensure a holistic experience.

Multiple Loans

For customers who have multiple loans that need to be confirmed, agents will first identify which loan they would like to confirm before entering the confirmation flow.

This state also allows agents to determine how far along a loan is towards being fully confirmed, tracking completion of individual sections within the confirmation flow.

New Payee

On some instances, agents will need to add a new payee if a customer’s listed payee has not been previously verified in our index.

The Design

CAS Confirmation