I'm looking for the best way for a customer to track their e-commerce orders in a summary format. The difficulty is, there may be several packages to ship for each order.

  • A customer may have placed up to 100 orders that they need to track
  • Each order may have up to 10 packages that need their status displayed
  • There is a fixed process that each package goes through before the order is complete (submitted, waiting on stock, packed, dispatched)

What is the best way to give an overview of all of these orders and the status of the packages within them?

  • Are you saying that a customer might have up to 100 active orders being processed at any one time?
    – Matt Obee
    Commented Oct 21, 2013 at 10:52
  • 1
    Yep. It would normally be somewhere between 10 and 30. Commented Oct 21, 2013 at 11:00
  • How about table (Date, Order) with expanded rows for each order, which display packages and statuses? For overview task it is probably enough. Commented Oct 21, 2013 at 11:58
  • Yes, maybe rows for each order. I was trying to think of a way of showing a count in the overview (e.g. Order 1 has 3 packages PACKED and 2 packages DISPATCHED). This gives an overview of progress and would allow users to click on the number to identify the packages at each stage. We tested this with users and understanding wasn't that great - They thought the numbers appeared to be more of a spreadsheet that needed column and row totals. Not the desired effect :) Commented Oct 21, 2013 at 16:42
  • How important is if for the userd to know about the different process stages? Commented Oct 22, 2013 at 12:10

2 Answers 2


I think you could combine Order view and Package view. The atomic item is a Package, as it is shipped independently. So default view is detailed package view, which could be ordered by status or other column name.
The table also supports folding packages into a Order view, when all packages are grouped by order and folded into one order line. User can unfold orders to view its details.
enter image description here


That seems like a lot of packages. Is this just pre-emptive design, or is this actually the common case? If the latter, I think the best approach is to find out what interests the user the most, most of the time, and displaying them so the desired information is displayed first.

I'd try displaying them first by whether a package delivery has completed (bottom) or is still in progress (top), and second by expected delivery date. The idea here is that the user can take advantage of the sort order to find a particular package they're looking for, but can also immediately find the currently relevant packages.

I'd presume that's the ones that were just delivered (in case the delivery hasn't reached them personally, they can thus check what neighbor/department/colleague it was delivered to or the like), and those that will be delivered next. Ones that have been delivered a while ago or won't be delivered for a while more aren't really that relevant to the user, so should go farther down the list.

If the user has just placed an order, you'd also want to make it easy to find that order again, either by placing it at the top of the list, or by having separate "recent orders" and "track packages" sections.

To keep the list as small as possible I'd recommend you group together packages from the same order that will be delivered at the same date into one item, as well as all packages that have completed delivery from the same order into another. I'd also expect that users will want some way of determining whether an order's packages have all arrived, but you can probably do that by just adding a "Delivery completed on " marker to the one item that groups all packages from that order (because they've been delivered).

In short: Try to keep the lists as small as possible, taking advantage of natural groupings that occur due to manufacturing and delivery dates, and base your page design on actual use cases your users actually have, making sure that they can quickly find the most important, most frequently needed information, and are only a click away from a detail page for a particular package/order for the rest. And feel free to have an adaptive design if most users will only have a few orders.

Amazon's order status with its nested boxes for deliveries is also a good inspiration for the basic design and arrangement, even if not quite intended to track 100s of packages.

  • This is actual common case, not pre-emptive. I agree with your logic for what's important. UI-wise, it's looking crowded. This info is very useful. Thanks! Commented Oct 21, 2013 at 16:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.