Customer Representative Tool

  1. Project Name: Customer Representative Tool
  2. Client: Schwab International Customer Representatives
  3. Project Duration: 6 weeks
  4. My Role: UX Designer and Researcher

Chaos on Calls

Customer service representatives were stressed. Support calls could require them to know specific details about products. Why was that so stressful?

  1. Product details were scattered across multiple spreadsheets and PDFs -- they were impossible to find and communicate.
  2. Any call had the potential to ruin performance metrics and anger clients.

A Call for Help

Reps needed a solution. They needed a tool to hold all product details in one place that is easy to understand and quick to navigate.

Enter Experience

As the UX Generalist and Design Lead on this project, I:

  1. Conducted research to fully define the solution needed by the reps.
  2. Conducted several rounds of user testing to refine the solution.
  3. Created several versions of hi-fi UI designs and prototypes.
Image 1 - Wireframe of initial application state

Understanding the Problem

First, we defined the problem.

  1. Interviewed five customer service representatives and their manager.
  2. Documented their haphazard procedure and what they needed to do their jobs more effectively.
  3. Reviewed the documentation they used and cataloged the information they tracked.

The Journey Begins

  1. Sketched UI ideas with the customer service representatives.
  2. Determined the teams’ technical ability required the product details to be documented via Excel.
  3. Created wireframes in Figma.
  4. Prototyped most-used interactions in wireframe fidelity -- changing views, sorting, and viewing product details.
  5. Conducted first round of user testing with five customer service reps.
Image 2 - Wireframe showing additional product information dialog

What We Learned

  1. Identified several necessary changes from user-testing.
  2. Users needed progressive disclosure for input fields and needed data to update dynamically based on those input fields.
  3. Information hierarchy needed to be more distinct when viewing product details.
Image 3 - First hi-fi design using Schwab retail design system
Image 4 - Alternative hi-fi design inspired by Schwab post-login experience

Testing & Changes

  1. We conducted more user testing after updating the wireframe prototype.
  2. We verified our changes based on initial user tests.
  3. We uncovered more hierarchy and visual presentation issues with product details -- it was still too slow and difficult to decipher product information.
Image 5 - Final design, several steps into the workflow

The Resolution

  1. After updating the UI and applying visual design, we ran the final round of user testing.
  2. Our goal was achieved. Customer representatives now had a tool that held all product details in one place that was easy to understand and quick to navigate.
  3. The tool reduced the time reps spent on product support calls.
  4. Customer satisfaction with product support calls also rose due to correct and up-to-date information within the tool.

Retrospective

Verify from multiple IT infrastructure sources that an internal server for hosting the application is obtainable.

You are viewing the beta version of my new website. I'm actively working on this site and larger breakpoints will be available soon. Thank you for your patience!