Problem

For a long time, we instructed our customers to export their expense data as CSV’s and import them to their accounting software. This sounds simple, but in reality it’s not:

• It takes a ton of formatting to get the exported CSVs in the right shape for an accounting import. Doing this twice a week is a hassle.
• We only supported all-data export. Even if admin just want to look at 1-2 columns, they had to export everything out of Abacus, which took a while.

This process has become one of the most time-consuming, manual, and error-prone process our admins have to go through. In addition to accounting import, accountants just love having full control of their data. They’d also much rather view and manipulate their data in a dedicated software like Excel. The fact that we didn’t support a very advanced export workflow was a huge disadvantage for our product.

Hypothesis

By building a custom CSV export workflow that allows admins to select and format exactly what data to export, we will be able to not only support integration with any accounting softwares but also empower admins to mobilize Abacus data for tracking, reporting, and analysis.

Research

We have an idea of the general export workflow, but now we’re faced with a more taxing question: How custom is this custom export flow going to be?

• We want admins to be able to export relatively clean, ready-to-import data, but we also don’t want to turn Abacus into Excel. We definitely don’t want this feature to carry the complexity of our customers’ accounting softwares. After all, we’re still an expense management platform.
• We made an educated guess that most admins would be willing to do some amount of extra formatting on their own, provided that we allow them to A.Select exactly what they want B.Do basic formatting such as rename column names, concatenate, etc… But these are just assumptions.
• On top of this, we have yet to understand our customer’s export habit: how often they are exporting expenses? Would an export history be useful to them?

To answer existing questions and validate some assumptions we made, we sent out a survey to our admins.

What we found

• Sage, Oracle, and Dynamics are our top 3 platforms. However, even within these platforms, there’s a lot of variation. Nothing totally "off the shelf" is likely to work.
• The ability to rename column headers and reformat column values is important. Simply turning on and off columns is insufficient.
• Considering admins' exporting frequency (once/twice a week), the ability to auto-schedule exports is something worth considering.

User stories

After we have a substantial understanding of admins' needs through the survey, we started scope out the functionality requirements of this feature. As an admin, I should be able to:

• Create, edit and delete export templates
• Within the template, add, rename, reorder, format, and concatenate columns
• Pick a template and export CSVs with correct data and format

Design

USERFLOW & WIREFRAME

The biggest UX challenge here was to figure out where the create template flow lived. Setting up a template is something that admins are going to do only once. Once the template is ready to go, chances are they’ll keep using the same template for every export, with relatively little post-setup alterations.

My initial thought was to place this creation flow in the same spot where you would do your export. However, after first round of review with my PM, I realize that it’s more ideal to keep this in the setting. I then continued to spec out the feature's flow and drew wireframes to illustrate the UX for each part of the flow.

UI & INTERACTION

Once we got a good grasp of the feature architecture, I moved on to design in high-fidelity. Users can either start with some of our suggested pre-canned templates or from scratch.

For me, the most interesting part of this project is designing the interactions around string formatting. Admins need to be able to concatenate two columns together and also edit date format. We happened to already be using React Select in our webapp, which works perfectly for both cases. Check out how we handle these interactions below.

Below is a compilation of every mockup I did to spec out the many micro-interactions that happen within this feature, ranging from date/name format to column concatenation and reordering.

Once admins finish setting up their template, they can use it to export needed data from their inbox every time after.

I also explored the export auto-schedule flow. However, with our resource constraints, we decided to push this back to v2 of this project.

Launch

The feature was launched on March 12, 2019. It has since become a core selling points to our sales team as no other solution in the market was as adaptive as Abacus's Export Builder. You can read more on our blog posts Remix Your Expense Data With Export Builder and 6 Cool Things You Can Do With Custom CSV Exports.

Takeaways

• Design for the 80% case first. It is easy to get caught up in all the possible functionalities that a feature could bring in. However, we could end up with an overly complex feature with only 20% of our customers actually needing the complexity. Consider it a successful feature if you could account for the 80% case.
• Break up the feature if needed. This falls right in with the 80% case's ethos: don't try to do everything at once. As a startup, we have to be strategic with our resources. If a part of the functionality is going to a complex add-on, save it for v2!