In the first days of the COVID-19 pandemic, online grocery stores in the US were overloaded and often failed to meet the sudden demand. People were desperately filling in their carts only to discover that their order could not be delivered or there were no pickup windows available. Those lucky enough to place the order found that many of their items were missing upon delivery. Grocery stores were overwhelmed, the supply was low (as people were stocking up), and there were too few employees available to deliver the order or help with pickup.

The pandemic was a corner case for a system that was not designed for extreme situations: in typical circumstances, most stores in the US expect to be able to find a delivery window and to have a stable inventory that doesn’t change from one moment to the next. So, in normal conditions, it may be okay to ask users to select a delivery window or a pickup window during the last steps of the checkout. But, during the pandemic, that proved a big problem. Luckily, some retailers moved quickly, identified the issues, and fixed some of their flow problems.

It is impossible to predict every future emergency perfectly. All we can predict is that therewill be紧急情况:自然灾害,罢工,进口或出口禁令,战争,产品短缺,设备故障,并列出。许多此类障碍会影响电子商务网站的能力,如预期的那样,必须在用户体验中正确反映。You can’t design for every eventuality in advance, but, for proper contingency planning, you should develop an understanding of the kinds of things that can go wrong and of your users’ main concerns, and find the best way to clearly explain limiting circumstances and plan your response to fast-changing constraints.



  1. 如果在开始购物之前,应当有任何送货或拾取时间有任何送货或拾取时间。所有用户都应该详细讨论此信息,无论是否记录。


Target did not allow shoppers to find if there are any delivery windows available in their ZIP code unless they created an account or logged in. The copy on the site saidSame day delivery to 94089 — Get it as soon as 6pm但邮政编码不正确,无法更改。此外,Get it as soon as 6pm没有关于交付窗口的足够特定信息。

请注意,模糊的措辞如Available today不是特定的足够 - 人们有各种各样的制约因素,并且经常希望确保他们在家安全地储存食物。允许用户查看其区域中可用的确切交付窗口,以便能够在开始购物之前进行明智的决定。即使您有一些送货窗口,请记住,人们可能会在其所需交货日期前几天购买杂货(特别是在大流行期间,他们了解到他们必须提前计划,并且很难确保它很难确保一个下一天的交付窗口)。

Amazon’s Whole Foods advertised that free pickup was available (top), but did not allow users to see pickup or delivery windows before they started shopping. Users had to add items to their shopping cart and go through checkout (bottom) in order to see if any delivery windows were available. If those windows proved inconvenient, the customer had to either abandon the cart or make arrangements for a different delivery date.
Instacart allowed users to see specific delivery times for a store before they started shopping.
  1. 在开始购物之前(或在购物过程中的任何时间)之前,应允许用户预留其交货或拾取的时间。

Scarce delivery windows were a common experience during the early months of pandemic. I have heard many stories of people staying up until 12 am or waking early in the morning to catch a delivery window. It was often the case that, when they had finally caught a window, they remembered that they needed an extra item and left the checkout to add it to the cart. Of course, once they came back, the delivery window was gone!

That is why it’s important to allow users to reserve a window. That reservation can be valid for a limited amount of time — say 30 minutes. (This approach is already used by event-ticket vendors.)


Safeway allowed users to reserve a delivery time before they started shopping. However, this feature was only available to logged-in customers. Those who did not have an account had to create one in order to see the available delivery times or reserve one
Smart&Final: By clicking on theAvailable in 3 hrslink next to the cart (top), users could select a delivery window (bottom) as soon as they added an item to the cart, The design could have been slightly improved by allowing customers to select a delivery window even before they started shopping.
  1. If the user has specified a delivery time or location, check first that the delivery can be made at that time or location. Alert the user if any of these are unavailable as soon as possible in the shopping process.

With DoorDash, a restaurant-delivery application, users could locate a restaurant, set a delivery time, and spend time adding items to cart, only to then discover at checkout that the restaurant was either closed at the desired delivery time or did not deliver to the user’s address. Even though the restaurant page included that information, it was not clear enough and easy to miss. A better solution would have been to alert users as soon as they started adding items to the cart and offer them a suggestion for how to proceed (e.g., tell them that they should switch a different restaurant).

doordash允许用户添加到购物车167美元从用户地址没有提供的餐厅(已作为第一步提供的餐厅)。最重要的是,Doordash也没有提供清空推车的简单方法 - 强迫用户逐一删除所有项目。餐厅的页面确实说了餐厅是Unavailable, but that information was unclear (it could have been that it was closed at the time when placing the order) and was ignored.

一旦用户有一个项目添加到购物车,delivery information and time should be confirmed, in order to make sure that people don’t spend unnecessary effort on an impossible task. If the delivery time and address are not serviceable, alert the user before it’s too late. Offer them alternatives whenever possible (e.g., different delivery times or different restaurants).

Yelp: When the user selected an item from a restaurant that was closed at that time, the site alerted the user. It would have been better if the alert had also offered a link to the page where the delivery time could be changed.

Replacements and Substitutions

Especially during the pandemic, supply chains became overstressed and certain products were available for a short amount of time. It was very common for people to add an item to their grocery shopping cart only to discover that it was out of stock on the day when they received their order and it was replaced for something that was completely useless. For example, in one of my orders, cleaning vinegar was replaced with organic lemon juice. A friend received beets instead of radishes.


  1. 允许用户在购物时指定低股票产品的替代品。在订购产品时使这一部分流动,而不是在结账时隐藏它。

在购物期间选择不同的产品是最容易选择的,因此应该提示用户进行替换时。但是被要求选择为每个产品选择替代乏味 - 所以,只适用于那些存货运行低的产品。

Instacart alerted the user that an item was running low and allowed him to specify a replacement during shopping. (Unfortunately, there was no guarantee that the shopper would receive the selected substitution either — if the substitution was also out of stock, Instacart would select another replacement.)
  1. 在结账时,有一个专用页面,允许人们为各个产品指定替换。让他们尽可能准确,并提供无替代选项。


亚马逊不允许用户指定替换while shopping, but at checkout it provided a separate page dedicated to substitutions and let the shopper indicate which products should not be substituted. The separate page is likely to draw shoppers’ attention. However, a global不要替换任何东西复选框将有用,并且能够为更换产品选择特定产品。
在结账时,Safeway致力于替换的单独步骤。用户可以选择将产品替换为同一品牌中的一个不同大小或不同品牌的相同大小。(Customize项目link offered these same general options for individual items, but did not allow the shopper to pick a specific product for substitution — which would have been ideal). This policy is, however, meaningless for fruits and vegetables.
  1. 要求人们进行电话号码,以便联系可能的替代品。


In the substitution step at checkout (see above), Amazon showed the on-file phone number for the user and explained she will be texted with a possible replacement that will need approval.


Instacart’s shopper’s messages were sent through the site instead of through text because the user was not asked to specify a contact option and that preference was set to the没有偏好默认。


  1. Don’t automatically remove an item that is out of stock from the购物车Instead, mark it as unavailable or out of stock.

In the early days of the pandemic it was common for people to add items to their grocery cart and wait throughout the day for a delivery window to become available. But, because of the time lag between shopping and actually placing the order, often some of the items in the cart became unavailable. When users finally found a delivery window, they placed the order without realizing that now it did no longer include milk or some other essential item.

In general, when没有东西不可用, it’s best to (a) explicitly say so, (b) if possible estimate the availability date, and (c) offer users the option to enter their email address to be notified upon availability.

  1. Indicate any quantity limits on the product page.


Smart&Final: The user could click the编辑按钮(左)普瑞来的数量变化,布鲁里溃疡t the plus button (right) did not work. A better design would have clearly indicated the restrictions imposed on the product on the product page. (And the quantity field should have been an editable text box instead of requiring clicks on the编辑按钮首先,然后是步进 增加数量)。


  1. Where applicable, clearly disclose whether the online prices are the same with in-store prices before people start shopping.


Costco explained the difference between the online prices and the “same-day” grocery prices. Its price limits for delivery were clearly listed.
GrubHub, a restaurant-delivery service, did not indicate whether the prices listed on its website were the same with the in-restaurant prices.
  1. 明确披露任何交付限额,并告诉别人是否已将足够的商品添加到购物车以获得免费交付的资格。


Safeway told the users that there was a delivery minimum only after an item was added to cart.
Smart& Final indicated that the shopper had to add 19.56 to be eligible for delivery, but this information was only communicated after the user added something to cart and attempted to select a time slot. Ideally, it should have been presented in clear on the home page.
  1. Be upfront about extra costs (service chargers, tips) that the shopper will have to incur.

Often customers have an unpleasant surprise at the checkout when they see theextra delivery and service feesthat are added to the cost of their items. If the delivery or pickup incurs extra charges or fees, disclose them upfront, so people know what to expect.




  1. Allow users to specify a no-contact delivery or pickup option. Make that option the default.


In the early days of the pandemic, I received a takeout order from a local restaurant through Yelp. I was unpleasantly surprised when the driver rang my doorbell and waited for me to pick up the order, as I would have preferred to not have to interact with him. (Even though it may feel that waiting to make sure that the customer received the order is common curtesy, that bit of customer service may be perceived as against social-distancing rules.)

When I came back to Yelp, I noticed that the site did have a contactless delivery-option, but that was not the default. Since then, Yelp has adapted to the new reality and changed its default.

Safeway: The user was given the option of a contact-free delivery, but it was not the default (in fact, it could not even be selected). Moreover, the site did not allow users to find any additional details about what the referred “免费联系“社会疏远meant.
  1. If people must sign or receive certain deliveries (e.g., alcohol) in person, be explicit about that requirement during checkout and on the final order-confirmation page.

Normally, the user is required to sign for certain deliveries. The need for a signature should be clearly specified on the place-order page as well as in the final confirmation page, so people will know what to expect.

For example, while ordering wine with Instacart, the user was allowed to specify that the order can be left at the door. However, because the order contained alcohol, the user had to be present to receive the groceries. The final confirmation did not indicate that. (Even though it is custom to ask for ID for alcohol deliveries in the US, some people may assume that the restrictions have been relaxed because of the virus.)

Instacart: The order-confirmation page did specify that the user must have a valid ID, but the delivery option was still留在门口。This messaging was contradictory and confusing.


Some of the guidelines in this article are specific to the problems during a pandemic. But many are special cases of general principles of good workflow design that apply in many other circumstances, including normal times. Disregarding them may work when product and delivery availability are high, but breaks the design in extreme situations and uncovers some hidden usability issues. These general principles are:

  • Figure out if you can fulfill the order before the user puts in any substantial work. That means asking for customers’ constraints upfront (delivery area, desired time of delivery) or allowing them to see (and reserve) the available delivery and pickup windows. If it’s not possible to satisfy those constraints, offer alternatives (available delivery windows, alternate stores).
  • Once the user starts adding items to cart, keep those items in the cart, whether they become out of stock or not. Mark those items clearly.
  • Be transparent about minimum-price delivery limits and extra fees.
  • 提醒人们对可能的替换,让他们允许预设低库存物品的更换,并尽最大尽力确保他们会看到警报并有机会批准替代。