Gallery

Design the import/export flow for a SaaS product where users move data in and out of the app. Start from the place in the product where the action is launched, then move through file/source selection, validation, review, progress, and completion. Make the path feel like a real product flow, not a generic upload dialog.

If the user is importing, show what format is accepted, what fields map automatically, and what happens when the file has missing or invalid rows. If the user is exporting, show what data range, format, and destination are being used before the export begins. The user should know exactly what will happen before they click the final action.

Include clear in-progress feedback for long operations, plus cancel and retry where they make sense. Show at least one failure state that keeps the user’s current selections and explains the problem in plain language. Finish with a success state that confirms the result and offers the next step, such as viewing the imported data or downloading the exported file.