How Should You Design Data Import and Export in a SaaS App?
How should you design data import and export in a SaaS app?
As a four step flow with a preview before anything is written: pick the file, map the columns, review what will happen, then commit. The single most important design decision is that nothing changes in the database until the person has seen what the change will be.
Import is the least glamorous screen in most products and one of the most decisive. It is where a new customer finds out whether your product will actually hold their work. If it fails here, they do not file a bug. They stop.
This is the pattern we use when we design these flows, and the reasoning behind each step.
Why does import deserve this much attention?
Because it sits at the exact moment of highest commitment and lowest patience. Someone has decided to try your product properly. They have exported a file from the tool they already use. If the import fails, they have learned something about your product that no marketing page can undo.
It is also the point where customer data enters your system in bulk, so a bad import is expensive in both directions. Bad data is harder to remove than to prevent, and the person who has to clean it up is your customer.
The teams that treat import as a back office feature usually discover it during a churn review. By then the flow has accumulated three years of patches. Our piece on SaaS onboarding flow design covers where this sits in the wider first run experience.
What should the first screen ask for?
The file, and nothing else. No format selection, no configuration, no options. Accept what they have, detect what it is, and figure out the rest after you have seen it. Every question you ask before the upload is a question asked without information, by both of you.
Tell them what you accept in plain words next to the drop zone, and give a sample file. The sample is not a nicety. It is the fastest way for someone to understand your data model, and half the people who download it will use it as the template.
Accept the messy version of the file too. Real exports have a title row above the headers, blank columns, and trailing summary rows. A parser that rejects those is a parser that rejects reality.
How should column mapping work?
Guess first, then let them correct. Match their headers to your fields automatically, show the result as a mapping the person can adjust, and be honest about what you could not match. A blank mapping screen is a form. A pre filled one is a confirmation.
Show sample values from their file next to each mapping, not just the column names. Someone can tell instantly whether Column F really is the email field when they can see three addresses under it. Names lie, values do not.
Let them skip fields explicitly rather than leaving them blank. Skipped and unmapped look identical on screen and mean different things, and that ambiguity produces support tickets a year later.
What goes in the preview?
Counts and consequences. How many rows will be created, how many will update existing records, how many will be skipped and why. The person is about to change their own data and they deserve to know the shape of that change before it happens.
This is not only good practice, it is an accessibility requirement in the relevant case. WCAG 2.2 success criterion 3.3.4, at Level AA, applies to pages that modify or delete user controllable data in data storage systems and requires at least one of three things: the submission is reversible, the entries are checked for errors with a chance to correct them, or a mechanism lets the person review, confirm and correct before finalising.
An import is squarely inside that definition. A preview step satisfies the confirmed option and a checked mapping satisfies the second, which is why doing both is the straightforward path. Our guide to WCAG accessibility covers the rest of the criteria this sits among.
How do you handle a long running import?
With honest progress and permission to leave. Jakob Nielsen's response time limits, published on 1 January 1993 and still the clearest statement of the problem, set three thresholds: 0.1 seconds feels instantaneous, 1 second keeps a person's flow of thought uninterrupted, and 10 seconds is the limit of keeping attention on a task.
Beyond 10 seconds people want to do something else, and Nielsen's recommendation is a percent done indicator. He gives three reasons for it: reassuring the user the system has not crashed, indicating how long the wait will be, and reducing the psychological burden of waiting.
So an import that takes a minute needs a real progress bar, and an import that takes ten minutes needs to run in the background with a notification at the end. Never make someone watch a spinner while a job runs server side. Our piece on loading and empty states covers the visual side of this.
What should happen when some rows fail?
Import the good ones and hand back the bad ones as a file they can fix and re upload. All or nothing failure is the cruellest possible design: one malformed phone number in row 4,000 and the person starts over.
The returned file should be their original rows plus a column explaining what went wrong, in language a non technical person understands. Not a validation code. Not row 4012 failed. Something like the date in the Start Date column could not be read, expected a format like 2026-09-17.
Then let them re upload that file directly. A failure loop that ends in a corrected file going back through the same flow turns a dead end into a two minute fix.
Does export deserve the same care?
More than it usually gets, because export is a trust signal. A product that makes it easy to get your data out is telling you it expects to keep you on merit. A product that buries export is telling you something else, and buyers notice.
Export what is on screen, including the filters and sorting the person applied. The most common export complaint is that the file contains everything rather than the view they carefully built. If they filtered to 40 rows, the file has 40 rows.
Offer the format people actually use rather than the one that is easiest for you. That is usually CSV, even when you think it should be something better, because CSV opens in the tool they already have. Making that view worth exporting is the same work as making your filtering and search good, so the two problems should be solved together.
What about undo?
Make the whole import reversible for a reasonable window if you can, because that is the first option WCAG 3.3.4 lists and it is the one that requires the least from the user. Tag every record created by a given import run and offer to roll that run back.
This is genuinely harder when the import updates existing records rather than creating them, since a rollback then has to restore prior values. It is worth doing anyway for the create case, which is the common one and the one where a mistake produces thousands of rows nobody wants.
If a full undo is not feasible, say so before the commit rather than after. People will accept an irreversible action they were warned about and will not forgive one they were not.
How do you test an import flow properly?
With other people's real files, not with your own clean sample. Ask three customers for the export they would actually use, with permission, and run those through. Every ugly thing in those files is a thing your flow will meet on a Tuesday.
Test the empty file, the file with one row, the file with a million rows, the file with the wrong encoding, and the file that is an Excel spreadsheet renamed to CSV. That last one is not hypothetical and it happens constantly.
Then watch someone do it without helping. Import flows are full of moments where the designer knows what a word means and nobody else does.
What is the smallest version worth shipping?
Upload, automatic mapping with manual correction, a preview with counts, partial success with a downloadable error file, and CSV export of the current view. That is a complete flow. Everything else, scheduling, API sync, incremental updates, can wait until customers ask.
What is not optional is the preview. If you ship one thing from this article, ship the screen that says here is what is about to happen, before it happens.
If you want a second pair of eyes on an import flow that is losing people, or help designing one for a product that is about to have real customers, we are happy to walk through it. Find us at phoenix.studio.
Want a site that performs like this?
Tell us about your project. We will come back with a clear next step, no pressure.
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.
Have a project like this?
Tell us where you want to go. We'll tell you how we'd get you there.