Feature Enhancement

Web

Logistic

B2B

Designing for Massive Data Entries via Batch Import

company-logo
CartrackDelivery
cartrack_delivery_batch_import_banner

Quick Overview (1min)

As Cartrack Delivery app primarily functions as a task management platform, creating jobs/tasks is a critical daily routine for the app users.

The Batch Import feature enables users to drag and drop a file (in csv, xlsx format) into the web app, facilitating the creation of numerous jobs instead of manually inputting them one by one.

This is a feature enhancement for the Cartrack Delivery Web app.

The unique aspect of this feature is that only one file is required, even for complex data input, and many unnecessary steps are cleverly bypassed to ensure a smooth importing experience.

VS

Before

cartrack_delivery_batch_import_compare1_before1

The Old Communicator App

VS

After

cartrack_delivery_batch_import_compare1_after1

The New Cartrack Delivery

Previously, users had to go through multiple steps (data mapping, manual checking, etc.) to import jobs. This method only worked with simple data and couldn't handle complex job imports.

After the redesign, users simply drag and drop, and it works! It also supports complex data imports through data merging. One file fits all.

💡We designed and built this feature from scratch. Many innovative ideas were implemented, and they work seamlessly under this simple interface.

Curious about how we did it? Let's dive in!


Highlighted Problems and Solutions

❤️‍🩹PROBLEM

During our user research, we found out that users often have to going through many repetitive steps in order to importing jobs. One of the example is data mapping step. User often found it confusing and have to re-mapping every time they import.

💡The reason why system was build like this is due to how importing works under the hood. Bath import is essentially import data via files. The system must use the headers of the file to decide what that column of data used for. Those headers could be called anything in different language, without mapping, the system don’t know what to do with them.

💡Most system is not smart enough or safe to make the guess, they just simply loop the file’s header(from left to right) and map them with preset data column. Since they don’t know if this is correct (most likely not), the burden was passed to users to verify.

My mental model for the fix is to streamline the process by skipping unnecessary steps:

  • let system smartly skip steps and processing data underneath
  • only let users step in and fix if there’s something missing or error occurred

Recorded a demo for the batch import function without error

Demo importing function with data mapping error

Before the redesign, users have to going through the same steps every time.

After the redesign, users just drag and drop without experience repetitive steps over and over again.


❤️‍🩹PROBLEM

During our user research and testing, we found out invalid data or error often happen during the validation process, this especially true when importing huge amount of data(>200 records). Users are forced to stop the process and must fix them and restart the whole process all over again.

💡The job files often come from different places (e.g. exported from other order management system) with various formats and sometimes lacking validation. e.g. Invalid address records could leads to error and driver won’t know where to go once assigned. All those error need to be fixed first.

💡Those errors are often unclear or not showing at all: some generic message appear without knowing where they happen and how to fix them. Once the process were stops, users must guess and redo everything all over again.

My mental model for the fix is to clarify errors and allow save progress:

  • The system will identify which cell/row has what error and show those to the users
  • The system allow users partially import correct records and save progress

VS

Before

cartrack_delivery_batch_import_compare2_before1

This is before design

VS

After

cartrack_delivery_batch_import_compare2_after1

This is after design

Before redesign, errors are not showing or generic without knowing what happened exactly.

After redesign, error screen auto popup with precise location and reason. User can save progress by partial importing all correct records if they need.

Recorded Demo for Partial Import

Bonus point: the system will auto generate a new file contains only the incorrect data. Users can fixed them separately and import later with all the progress saved.

During our user testing, we’ve seen people trying to import almost 7000+ records with over 50+ errors, but still can safely continue first and fix errored files later. This kind of tasks would be a total nightmare before the redesign.


❤️‍🩹PROBLEM

The job data could be quite complicated: one job can have many stops, each stop can have many todos and items, each items can have it’s own unlimited todos… This is not a big deal when users are using the web app UI to enter jobs. But it pose extremely challenge when people trying to recreate those data by using CSV files.

💡The old Communicator only allow users to create simple jobs. Then users must manually update those jobs on the web app after the importing.

💡Other competitors let users importing multiple simple files separately(one for jobs, one for stops, one for items, etc) and users must connect them after the importing.

All of the above solutions are not ideal, and force users to go extra steps after importing.

My mental model for this fix is to allow data merging in one file:

  • allow combine multiple rows into one single job via simple merging logic
  • allow adding todos and stops as many as needed in one file

Before the redesign, users can only import simple jobs and must do post-editing after uploading.

After the redesign, users can import complicated jobs in one single file.


Example: Import a Pickup-Dropoff (P-D) Job with an auto-generated Order Number by the system

💡Logic: The prefixed "AUTO…" keyword triggers the system to auto-generate order numbers. The value after the "AUTO" keyword groups rows together.

cartrack_delivery_batch_import_file_auto

💡Batch import features is one unique feature that may looks simple on a glance, but can turn to complex when special situation encountered. So we spend a lot of time trying to let people know how to use it.

Here are the efforts we made to facilitate easy user onboarding:

  • We provided various templates to help users get started.
  • We included hover tips in headers and cells for better understanding of the template usage.
  • Sales representatives and trainers are available to guide new clients with special requirements.

Fortunately, not every client will need all complicated advanced feature. The basic template is very simple to start and understand for most of users.

Research indicates that 99% of clients stick to their job template because their business workflows are relatively stable. Even for complicated jobs, the system can meet all kinds of requirements. Users have become accustomed to this during our user testing.