Case Study

Associate Desktop Experience

at Fidelity Charitable

(End-to-End B2B2C Project)

Duration

April 2022 - December 2024

Fidelity Charitable

Part of

Associate Desktop Experience

at Fidelity Charitable

Overview

1. Grant submission (26% ($3.87B))
1. Create Grant (10 months)
2. Regrant (5 months)
2. Contribution submission (25% ($598M))
• Create Contribution (10 months)
• Book Manual Contribution (8 months)
• Modify Contribution (6 months)
3. Account Profile (8 months)
4. NPO Verification (5 months)
5. Account Alerts (6 months)

End-To-End Product Strategy initiatives

• Unmoderated A/B testing effort
• iOS App Contribution integration (Fast release)
• Account summary (Post release fixes)
• Broker Dealer Auth (Discovery phase)
• OFAC interaction updates (Office of Foreign Assets Control)
• Account search (New implementation before busy season)
• Associate Desktop integration discovery research

Additional support of smaller projects

Part of

Process of Creating

a Grant

The 25-year-old associate B2B2C eCRM application has an outdated interface, security risks, and lacks integration, resulting in slow workflows and on an average 4-5 minute per on-call transactions. This limits transaction volume, especially before market close.

Problem statement

Goals

Business Goal: Increase operational efficiency by reducing call handling times and streamlining workflows, leading to higher transaction accuracy and improved productivity.�

User Goal: Provide associates with a modern, intuitive, and secure eCRM system that simplifies task flows, minimizes friction in daily operations, and enables them to serve customers more efficiently within market time constraints. A user friendly, secure application is essential to streamline workflows and boost efficiency.

​

• Grant: A cash donation to a Federally approved NPO.
• Tax deductions: Donors can receive tax deductions for these grants.
• Process: A donor or their authorized account manager can call a Fidelity associate to submit a grant.
• Fidelity Charitable fees: Fidelity Charitable charges to maintain the account and takes a commission from investment money/assets.

What is a Grant?

Who is the user?

User

Transactional Representative (Rep)

They complete transactions on-call with customers who need assistance for different scenarios. Most frequently due to reasons such as non-tech savvy/high amount/Functionality limitation on Donor App.

Different use-case types: �2024 Overall volumes - 2.66 million transactions [$14.9B]

Associate Application shared 26% [$3.87B]

• Submitting new grants for the donor (13%)
• Submitting a grant from past preferences (46%)
• Scheduling a future grant (31%)�
• High amount transactions ($1M+ per transaction)
• Modifying existing grants
• Repeating past transactions

Case Study

My Role

UX Designer II

Subject Matter Expert

Tools

Figma

Sketch

Miro

JIRA

MS Copilot (AI) for data research

2 Teams

1x Product Owner

1x Data Analyst

1x UX Design Lead

1x Architect

1x Dev Team (10-15)

Groups of Stakeholders/Users

Duration

5-15 months

7 End-to End projects�

2 Week Design Sprint

Contribution

SME for Associate Experience

Design Lead

User Experience

User Interaction

Existing Experience research

User Research

Wireframe

Prototyping

Design system guideline

UI Component Design

User testing

UX Writer

How might we leverage a design system to integrate our product into seamless and cohesive user experience, ensuring increased efficiency and consistency with higher business impact?

Design Phases

Epic/Stories in backlog

• Design (70-80% complete)
• Defined interactions

Process

Illustration

Right

Solution

Right

Problem

UX Discovery tasks

Wireframes, Scenarios, Task evaluation

Current state research,

Competitive analysis

Refinement

Scenario discovery, Technical support,

Scope adjustment

About 30% designs will be finalized throughout the Epic/initiative.

Defining right problem to provide right solution.

User journey 1

Answers donor’s call

• Verify the donor
• Figure out the ask

• Copy credentials from My Voice App
• If unavailable, ask the user

• Manual intervention required to copy credentials

• Automation to populate credentials and pull up relevant information

STEPS

GOALS

DOING

PAIN POINTS

Opportunities

Create grant

Validation page

After call tasks

• Create a grant for specified (NPO) Non-Profit Org
• Allot requested amount

• Search NPO in separate window
• Look at grant history in separate window

• NPO pop window hides in the chaos
• Requires 2 screens to perform one task
• Overall page is very clunky

• Reduction in screens
• Integrating history information within flow

• Validate all the information with the donor
• Update data if required

• Reading through the clutter of optional labels that was not entered

• Why can't this page only show what was input and hide irrelevant data

• Update in the page format needed

• After call ends, input information into Salesforce

• Inputting call notes
• Transaction details

• This task takes additional 3-5 min each time

• Automation to populate information into other applications

FEELING

Overview

Process

Design

User pain points:

• Readability issue
• Difficult to search a listing
• Verbatim inconsistency
• Accessibility issues
• Unclear validation message
• Too many extra pages/clicks
• Lacks specific instructions for closing account
• Lacks validation step
• Need multiple screens to perform tasks
• Use of multiple browser tab logins

Workshop findings

Discovery insights

Uncovered opportunities:

Key insights from conversation with business:

• Inefficient Call Handling is a Bottleneck: �The key insight is that requiring multiple screens for an associate to handle calls for grant submissions is inefficient, limiting the number of grants processed due to the time and manual effort involved.�
• Manual Workflow Limits Transaction Volume: �To increase transaction volume and revenue, the manual, call-based workflow needs to be streamlined. This will reduce dependence on one-on-one human interaction and allow the organization to scale.�
• Automation is the Path to Higher Revenue: �Automating processes to streamline workflows was a key insight. The business understood this would not only reduce costs but also allow them to handle a larger volume of transactions and increase revenue without a proportional rise in operational expenses.

Essentially, the business identified that manual, high-touch processes were hindering scalability and profitability, leading to a strategic focus on solutions that could reduce transaction time and streamline the grant submission workflow.

Discovery insights

Strategic collaboration

Using collected data and user interviews, we finalize deliverables defined by enhancement possibilities within time and technological limits. This allows us to document out-of-scope deliverables for future implementation and planning.

Data analysis

User interviews

Literature review

Competitive analysis/�Design guideline analysis

Phase 3�Right solution

The Gap: Legacy system vs. Modern requirements

The fundamental gap lies in the mismatch between the business's need for a modern, efficient workflow and the limitations of the existing technical infrastructure.

​

Searching desired NPO

Lift & shift iteration:

One search field iteration

Legacy page

Legacy interaction (The Gap)

• Outdated table design
• Clunky Pagination
• Tax ID data missing (61%)
• Search by Organization name �(Secondary name missing 53%)
• Inconsistent typography and �low readability

• Modern interaction
• Custom UI component
• Best practice Pagination for ease
• Search by Tax ID (61%)
• Search by Organization name (Secondary name 53%)
• Accessibility compliance utilizing design system

Wireframes

Overview

Process

Design

Modern page

New benchmark experience:

• Pagination for ease: User can navigate through table easily
• 61% transactions are searched with Tax ID: Custom search field
• 53% customer requests out of all Organization name are searched by Secondary name
• Data is presented in custom component format for higher readability

Legacy page

Enhanced feature

Overview

Process

Design

Legacy interaction

Modern interaction

Less is More.

The Gap: Legacy system vs. Modern requirements

The fundamental gap lies in the inability to switch selections without losing typed data.

​

Legacy interaction (The Gap)

• Multiple dropdowns increases clicks
• Click/tab action does not function under compliance
• Data loss upon selection changes
• Inconsistent verbiage

• Modern interaction
• Standard and custom designation under one dropdown
• Most used option pre-selected (71%)
• Accessibility compliant interaction
• Utilizing modern database, data stays until submission
• Verbiage aligned with customer platform

Missing enhancement

Overview

Process

Design

Legacy page

Page 1�Giving Account & Match Account scenario

Page 2: Regular Grant Page

Giving or Match account

Match AC flow

Account selection

Grant AC flow

Page 3: Giving account flow

Page 4: Match account flow

New Flow

Overview

Process

Design

Legacy page

Modern page

The Gap: Legacy system vs. Modern requirements

The fundamental gap lies in the multiple entry points, multiple scenarios, data loss on selection change.

​

Legacy interaction (The Gap)

• Giving & Match accounts in different flows
• Making transaction 4 page interaction
• Data loss on selection change
• Transaction call time increases
• Data loss upon selection changes

• Modern interaction
• Reduced pages from 4>1 by consolidating all options in one place
• No requirement to re-enter data if selection is changed
• All account information available in one spot
• Overall saves time, reduction in pages/clicks

New features

Overview

Process

Design

The Gap: Legacy system vs. Modern requirements

Based on user interviews, to avoid data loss on exiting the flow, users need to login from different browser to check transaction history details.

​

Legacy interaction (The Gap)

• Past grant amount, investment allocation, pool selections, acknowledgement details are not integrated within the flow
• Associate has to open donor’s account details in different browser to check history
• Increases transaction time due to back and forth

• Modern interaction
• No need for multiple screens, 3 different login actions, gives quick recap with one click
• Reducing transaction time from 5 min to 2 min 30 sec on avg, increasing overall business impact
• Increasing transactions per day from 32 to 51 (↑59%).

​

As this was a Out of scope feature based on user pain points, we had to validate the ask by conducting user group session to understand the impact.

User Feedback

Overview

Process

Design

User group validation on new feature:

About the key new features.

• "Can't tell you how many times a donor would ask in the middle of processing 'what did I do last time?'"
• Providing details like the last charity, special purpose, and acknowledgment would be "pretty awesome."
• It would be important to include previous designation and acknowledgment details.

New findings

Overview

Process

Design

Liquidate all modal interactions

Grant amount auto populated with read-only component to avoid typing error

Recurring radio button hidden, inline message to convey business logic.

Legacy interaction (The Gap)

• No validation message in case of liquidation
• Manually have to type the available amount in case of liquidation
• Ambiguity about what happened on liquidation and timing of submission allowed. ASAP[Instant], Future, Recurring

• Modern interaction
• 3 different validation copies based on selection of source of grant
• Grant amount auto populated with read-only component to avoid typing error
• Clarity on business process and edge case timing og grant step with clear information

The Gap: Legacy system vs. Modern requirements

Liquidate all is process of donating all the amount from selected dollar source. Based on user interviews and business process analysis, validation step and verbiage missing upon liquidation.

​

Overview

Process

Design

Design system

A React-based Token-based Design system

Token-based Design principles

• Typography
• Spacing standards embedded in components
• Shadows or blurr states for

Designing with WCAG AA compliance.

Leveraging design system:

• Visual Design & Color
• Readability - 200% resize text
• Clear hierarchy - header, sub-header, labels, error validations, specific use cases
• Keyboard accessibility - logical tab order, focus indicators�
• Link text - avoiding generic phrases
• Clear and simple language
• Alternative text for images or visual components for screen readers

Fidelity Charitable Design Library

3 designer team:

Principal designer: Overall design system initiative

• Under his leadership, maintaining Service design tokens
• Updates to components
• Building new figma components
• Collaborating with FCDL Dev team

Success metrics

• Modernized an end-to-end process
• Strategic & Data-driven approach
• Collaborative effort
• Mentorship & knowledge sharing
• Team success:

Our success was a team effort, and we couldn't have done it without the guidance of my three amazing UX managers: Liz, Nate, and Lauren over the time.

More than

56K+

grant transactions via Associate applications

Nearly

$598M

contribution impact

More than

$3.874B (26%)

grant dollar impact

More than

85K+

asset transactions via Associate applications

More than

$14.9B

contribution impact

Facilitated

2.5M

grants transactions by Fidelity Charitable

59% Increase

32 to 51

transactions per associate

50% reduction

2 min, 30 sec

per transaction

Associate Desktop Experience

at Fidelity Charitable

Thank You!

Abhilash Bhakre

bhakreAbhilash@gmail.com

abhilashBhakre.com

THE END