Web Application

2020 CASE STUDY

CDW has a built-in web application that helps its customers manage their accounts virtually. Increased management automation allows CDW's dedicated account managers to focus on more critical customer priorities than routine transactions.

Opportunities

• Account managers frequently receive non-urgent phone calls, such as those related to reviewing invoices and receipts. These calls can take up a lot of their time, which could be better spent on more pressing matters.
  
  
• Customers are frustrated with the steps required to review items in their accounts.
   
  
  

Solutions

Created a list view with sort and filter to assist users in reviewing their receipts and invoices. 

Outcome

83% increase in self-service automation on customer invoice and receipt reviews

Story

We discovered that our customers have difficulty finding their invoices and credits, leading them to contact their account managers to escalate a routine task into a customer service issue. The account management product team continuously optimizes these experiences. I contributed to designing a list view UI where our visitors can see their product and subscription invoices in one place.

The goal is to simplify and create a frictionless user experience for our customers with our online account management tool.

Thinking through the problem

Before this project, purchasing account holders needed to perform the steps below to view their invoices.

1

Needed to go to their order history.

2

Click view invoice, which takes them to an invoice list page for each order.

3

Then they click “View Printable Invoice” to view a particular invoice.

Our goal was to reduce the excessive number of steps and simplify the task of viewing these invoices resulting to a frictionless account management experience.

1

Click “Invoices and Receipts” on dashboard.

2

An invoice list appears with sort and filter capabilities.

How we solve it

Layout first

For our visitors to see their invoices and credits in one place, we chose a grid list view showing an account's invoice date, number, purchase order, order number, amount, and current account status.

Sort and filter

Having identified the appropriate layout to list the invoices and credits in one place, we needed a way for our account to sort, filter, and search for information.  We added a dropdown and explore input components with modals for custom ranges.

Filter by Account

Date Range

Custom Date Range

Outcomes

83%

Increase amount of automation in account management.

30+

Screens and states are designed with features for invoices and credits.

What else is left?

This project was an opportunity for me to work with an enterprise UI. I'm fortunate to have worked with a talented product design team from different concentrations. It allowed me to refine my workflow with greater accuracy and precision. This project was quite involved for all its simple appearance as this experience lives in a different framework. Having an understanding of that framework helped inform my UI design choices.

Finally, I discovered that I delight in learning the subtle and nuanced intricacies in UI design. I found that my micro-decisions have a broad impact on the web app's overall performance. I was humbled with that knowledge and excited for more opportunities in designing enterprise UI.

Created in Earth, Sol System