Improving different agent experiences so that each team can better perform their respective responsibilities.

Product Designer | Tomo Credit

Product Designer | Tomo Credit

September 2022 to November 2022

September 2022 to November 2022

User Research, Wireframing, Prototyping, Interaction Designs, Usability Tests

Overview

Tomo Credit is a fintech company providing credit cards to their users. At the time of the project, agents were using two different internal management systems called “Supportal” and “Godview”.

Both Supportal and Godview held overlapping and exclusive customer content on one page. This project aimed to create one internal management system that would consider different agents’ responsibilities.

Problem

Due to its divided structure and stacked information, agents frequently scrolled between Supportal and Godview, resulting in time-consuming searches for specific information needed to help a customer affecting the customer experience.

Outcome

The solution involved merging "Supportal" and "Godview" into a single internal customer management system, allowing agents to navigate between different pages in order to find content that they needed to assist customers.

RESEARCH

How did different agents interact

I understood that there were different users for this system, the agents of different teams.TI wanted to understand how each team interacted with Tomo Credit customers and how they used the current system.

Unique goals and frustrations

I interviewed each agents from each team. Since we were a startup, I interviewed 8 participants, all team members that engaged with Tomo Credit customers. My goal was to identify

I asked them to what their main tasks were with Tomo Credit users in order to understand the impact of this project to customers. I asked each agent to walk me through how they would solve their respective customer’s issues. Based on this I developed four quick personas of each agent, listing out their goals and challenges.

Customer Support

Customer Support

Goals

  • quickly get to information required for incoming calls

  • insurance they are reviewing the right customer's profile

Painpoints

  • having to scroll throughout a page and tell customers to “hold a bit”

  • accidentally looking at the wrong profile due to multiple tabs open

Fraud

Fraud

Goals

  • getting a detailed account of each user’s transactions and IP history

Painpoints

  • having to scroll to the bottom of Supportal and Godview

Manual Review

Manual Review

Goals

  • to accurately and consistently review a user’s application

Painpoints

  • having to go back and forth between Supportal and Godview

Collections

Collections

Goals

  • retrieving up a user’s most recent history as quickly as possible before user picks up on a call

Painpoints

  • having trouble pulling up a user’s personal information in order to verify them

Each agent had different goals and painoints when using the current system.

Common goals and frustrations

Based on my interviews with all team members, I noticed common goals and frustrations that spanned across all agents, regardless of team.

Security

Security

All agents always wanted to feel confident they were on the right customer’s profile due to sensitive information and compliance

Quick

Quick

Agents did want to continue scrolling through each page to find the content they need

Organized

Organized

Agents struggle finding unique information due to new additions being added to the bottom of the system’s page

Focusing on one team

After developing 4 personas with unique goals and also common frustrations, I wanted to understand which team’s goals I should prioritize in order to define items to focus on with my design.

I listed all the possible forms of customer communications and the respective teams that handle those. After that, I listed out the potential risk that each form of communication in impacting a customer’s experience.

Customer Support

Fraud

Manual Review

Collections

Incoming emails

Outgoing calls

Lowest Risk

Highest Risk

Outgoing emails

Incoming calls

Customer Support

Fraud

Manual Review

Collections

Incoming emails

Incoming calls

Lowest Risk

Highest Risk

Outgoing emails

Outgoing calls

Based on this, I understood that the customer support team was the only ones that dealt with incoming calls, which required agents to be able to answer customer’s questions quickly and correctly.

Prioritizing the customer support team's frustrations was essential for a better customer experience.

IDEATION

Solving the problem

I engaged in collaborative sketching sessions with agents to develop a solution that directly addressed their frustrations. The aim was to empower them with enhanced capabilities to fulfill their day-to-day responsibilities more effectively.

Prioritizing changes

During discussions with the PM, it became clear that undertaking a complete platform redesign and developing new features to address every team's concerns would require substantial effort.

Considering the timeline and other business priorities, it was decided to focus on reorganizing existing information on the platform and implementing "visual grouping" techniques.

The aim was to avoid relying on new APIs and create an information architecture to navigate easily.

Under one system

It was clear that users did not like going between two different platforms to find certain customer’s information. I decided the best approach was to create one system under the name “Supportal” that would house all information. The next step was to understand how to organize all the information from two platforms into one.

I conducted a hybrid test in order to understand how each team categorized the content on both “Supportal” and “Godview”. The only category I had was “Dashboard” in order to see which content agents wanted to prioritize.

From the results of the exercises, I determined that there would be a total of four secondary pages - “User Dashboard,” “UW & Bank,” “Fraud,” and “Transactions History.”

Several approaches were considered for the "User Dashboard" page's content. The decision was made to prioritize input from customer support agents, ensuring effective and accurate customer responses.

DESIGN PROCESS

Providing agents with the tools to succeed

AFter coming up wihtt the solution, I went into designing how the experience would be with an updated information architecture.

Fixed Header

With an approach incorporating secondary pages, agents would jump from different pages of a customer’s profile. I needed to provide confidence for agents that they were reviewing the correct customer regardless of which page they were on. This is to ensure that agents were able to confidently practice data security when working with so many customers.

I conducted a survey and asked, “Which information about a customer do you need to remind you which customer profile you are reviewing? (Check all the apply)”

What information do you need to verify a customer’s identity?

What information do you need to verify a customer’s identity?

Customer Name

Customer Name

100%

100%

Customer Email

Customer Email

100%

100%

Associated Tags

Associated Tags

100%

100%

Phone Number

Phone Number

38%

38%

Address

Address

38%

38%

All teams felt that it was important for them to be reminded of the customer’s name, email, and any associated tags with them. I decided that these would be included in the fixed header.

I conducted follow up interviews to see why Phone Number and Address were not that important. Agents stated that each customer’s data was uniquely identified through their email. Therefore, I decided to omit those information to provide an easier identification for agents based on how the our databased classified each customers.

2

1

1

Search

Maintaining search functions for agents to easily navigate between customers

2

Identifiable Content

Customer information that will help any agent quickly identify and verify the customer they are working with.

2

1

1

Search

Maintaining search functions for agents to easily navigate between customers.

2

Identifiable Content

Customer information that will help any agent quickly identify and verify the customer they are working with.

A header provides agent comfort in knowing they are on the right customer profile and ensuring data protection.

Navigating Content

With additional pages organizing the different contents, agents needed a way to jump from one page to another. I developed two low-fidelity approaches in addressing this and came up with pros and cons for both approaches.

Navigation Bar

Navigation Bar

Updating the left navigation bar to hold the different pages. Agents could click on the side to jump from page to page. Prior, this navigation bar contained pages for a customer’s dashboard.

Embedded Tabs

Embedded Tabs

Incorporating tabs into the header would allow agents to jump from one page to another.

I took my low fidelity frames and conducted a usability test by asking users how this would affect their day to day responsibilities and concluded the following pros and cons.

Version 1 : Navigation Bar

Pros

Cons

1

2

2

2

3

1

More content

Allows for more information to be above the fold

2

Distance

increases glancing back and forth from profile to pages

3

Lost guide

The Customer support team utilizes the navigation bar on the side to help guide customers step by step in solving their issues.

Version 1 : Navigation Bar

Pros

Cons

1

More content

Allows for more information to be above the fold

2

Distance

increases glancing back and forth from profile to pages

3

Lost guide

The Customer support team utilizes the navigation bar on the side to help guide customers step by step in solving their issues.

1

2

2

3

Version 2 : Tabs

Pros

Cons

2

1

1

Hierarchy

Provides hierarchy on importance of information. Agents can easily associate who’s information they are viewing.

2

Increased fixed space

Requires more screen space to be fixed, reducing the amount of content above the fold.

Version 2 : Tabs

Pros

Cons

2

1

1

Hierarchy

Provides hierarchy on importance of information. Agents can easily associate who’s information they are viewing.

2

Increased fixed space

Requires more screen space to be fixed, reducing the amount of content above the fold.

Modifying the left navigation bar impacts customer support by offering access to customer dashboards and facilitating step-by-step issue resolution guidance. Given the importance of user interviews, prioritizing the customer support team becomes crucial as they exclusively handle incoming customer calls.

The redesign of the side menu necessitates the involvement of engineers, who would be responsible for crafting a menu that effectively presents information from either a customer's or an agent's perspective. This may impact day to day operations.

As a result, I decided to go with a “tabs” approach not to create friction in the user flow for the agents in the customer support team when they support TomoCredit customers.

Combining the information architecture, fixed header, and navigation feature, I prototyped a solution that would address agent’s needs to efficiently and safely assist customers.

Final Thoughts

Unfortunately, this project was terminated due to resources being allocated to other projects. However, I wanted to share the next steps that I would have taken and also the learnings from this project.

Next Steps

I intended to conduct usability tests to evaluate the mockup's effectiveness and the information architecture. During these tests, agents would work with simulated tickets to perform their routine tasks within the system. The main goal of these tests was to gauge the time agents needed to find information and identify potential improvements to the information architecture.

Reflection

Working with diverse user groups throughout this project was an enjoyable experience. It was crucial to consider the requirements of various teams utilizing the internal system while taking into account customer impact.

I want to thank Jon Umber, our Product Manager, for providing valuable guidance and support throughout this project.

Thank you for reading.

I appreciate you checking out my work and I hope you liked it! If you want to keep that energy going check out my other projects.

email:

kylewlu97@gmail.com

website:

kailu.io

linkedin:

linkedin/in/kylewongkailu

e:

kylewlu97@gmail.com