Personal Cards

Instantly send transactions made with your personal credit card to your Concur Expense report

It’s time consuming to track, identify and log business-related charges from a personal credit card in order to be reimbursed by your company.

With Concur's current flagship application, Concur Expense, it’s time consuming to track, identify and log business-related charges from a personal credit card in order to be reimbursed by your company. Personal Cards simplifies the expensing process by allowing people to send transactions to Concur from their digital bank statements.

Role
UX Design Intern
Key skills
Research Synthesis, Rapid Prototyping, Visual Development

Examining the Problem

Concur Expense allows its users to report and expense their business travel transactions to their company via a web application. However, there were a number of pain points during this process, particularly for employees without company issued credit cards.

Many employee are not issued a company credit card and end up having to use their own credit card to pay for business expenses with the hope that they'll be reimbursed later
While on business travel, it's hard to keep track of small purchases and discern what is a personal expense from what is a business expense
Current applications meant to help employees get reimbursed are intimidating and not easy to use. Because of this, some forget to add transactions or decide that it's not worth their time

Concur Expense User experience map

Where we began

In order to get reimbursed, the Concur web application required that you enter in the exact amount spent, the date of the transaction, a description of what you purchased, and for particular items, a receipt. In order to find out that information, you have to pull up your credit card statement and manually input each field. If you made travel bookings through a third party, you would need to refer to that issued receipt as well.

How can we make documenting business travel expenses easier ?

To kick-off the project, I began by examining some of the qualitative and quantitative data available from past user interviews and research reports that Concur had on hand. I was able to find a few interesting points and was able to better understand the frustrations that people faced.

It usually takes me about half an hour to 45 minutes. After awhile my eyes start hurting after looking back and forth between my monitors so many times

INSIGHT

Users do not save receipts and instead rely on online banking services to retrieve information about what they purchased

It takes me forever to have to type in every single thing. I just do it so I can get the money back that I spent on all the stuff I bought

DEMOGRAPHICS

People of working age

Average to income earners

Identifying Key Tasks

By examining the paint points, I came with a list of key tasks that users needed to perform in order to reach their goal of being reimbursed. I only had to consider the resources and time available to the developer team, we defined three main task flows that the app would prioritize above all else.

  • Link a personal credit card to the application
  • Create a new expense report in the app
  • Add transactions to the user's expense report

Iteration through Rapid Prototyping

Equipped with the insights we had gathered from the previous discovery phase, we started by creating an idealized customer journey experience.  We referenced past NPS surveys and used concept mapping to examine possible opportunities.

Usability Test Findings

  • Users remembered transactions in terms of physical spaces, usually meaning location, not necessarily in terms of specific dates, credit cards, or amounts
  • Confusion from transactions that were income
  • Confusion about the meaning of the word "Add" and the blue color used for the button
  • Infrequency use of tab navigation
  • Mistakenly added transactions were frequent

Project
Outcomes

Design decision

Help the user take their first steps in the app

Change what users see first

To begin using the app, the user would need to do three activities, sign in with Concur, link their bank account, and create their first expense report. It became clear from the inital usability tests that people were unsure of how to begin adding expenses without some verbal guidance. I decided to make the process extremely linear, hiding the main UI until the user completed the required steps to have their transactions populated in the app.

Design decision

Remove bottom navigation bar in favor of guiding the user

Change what users see first

One thing I realized after a couple rounds of iteration was that the bottom navigation bar did not support the user's most highly-frequented activity. People were not spending their time adding new credit cards or creating new expense reports - they were spending time looking for transactions. By removing the navigation bar, I was able to utilize the space as a guide for the user. There would be less question of where the user needed to go next in the task flow.

Design decision

Don't make them think

Change what users see first

The biggest highlight of the app is that we would try to prevent the user from doing any work at all. The app would detect if the user went on a trip by looking for a pattern of transactions from a switch  city/location. We would also include any transactions of ride-shares (Uber/Lyft) if they occurred within two days of the location shift. The user would need to review the report before it was exported to Concur Expense, but this saved the user from having to select all of the transactions manually.

Design decision

Account for user error

Change what users see first

While the design tries to prevent user error as much as possible via clear visuals and large spacing, we still had to acknowledge that slips and mistakes still might occur. To account for this, I tried to make it as easy as possible for the user to correct their mistake.

Reflection and Takeaways

This was my first taste of collaborating directly with front-end developers and it was an amazing experience. I learned how to better communicate design specifications, determine reasonable compromises to coincide with engineering limitations, and definitely sharpened my visual design skills since I was solely responsible for the user interface of the app.

The next step for this project in terms of design would be to further develop the web companion application so that users could also set up expense reports from their desktop.

Next Project