23 Feb UX Gone Bananas
February 23, 2021
Since lockdown began last year, I’ve become accustomed to ordering groceries online. After much practice maintaining multiple carts, repeat refreshing for delivery slots, and performing Tony-worthy hygiene theater, I’d considered myself an expert; that is, until yesterday, when I was shocked to unpack a small zoo’s worth of bananas — 5 bunches! A better chef might be excited (breads! smoothies! flambé, anyone?), but while waiting for my bounty to ripen, I investigated the user experience (UX) issue contributing to my mistake.
Checking my Amazon Fresh order, I discovered that I had indeed ordered 5 bunches of bananas, instead of my usual 5 or 6 individual bananas. But how? The clues lie in the Amazon Fresh UX, which doesn’t satisfy Nielsen’s Fourth Usability Heuristic, “Consistency and Standards.” In essence, this UX guideline suggests that websites or applications adhere to well-established interaction conventions, both internally (within a family of products) and externally (across a domain or platform). By establishing the bunch as the unit of banana sales, Amazon Fresh flouts the convention of selling bananas by the single fruit, which is the standard sales unit on Amazon Whole Foods (internal convention), as well as national chains such as Wegmans, via Instacart (external convention).
The screenshots below show that Amazon Fresh, Amazon Whole Foods, and Instacart/Wegmans all use photos as their primary product representation. Amazon Fresh presents a banded bunch of bananas, in two views plus superimposed on a human lap, for scale. In contrast, Whole Foods and Instacart both show a single banana (forgoing the potentially problematic lap scenario.) Although Amazon Fresh uses a large clear photo and the phrase “one banded bunch (5 ct)” to indicate the unit of sale, I believe that these indicators may be too subtle for user error prevention when bucking the established single-banana sales unit convention. The quantity selection above the “add to cart” button on Amazon Fresh still shows a number 1, same as Whole Foods and Instacart. The quantity is not labeled in that key action area as a bunch. Whole Foods does a better job contextualizing the quantity selector with an estimated weight and price, as does Instacart. Quickly working through my shopping list, and accustomed to the quantity selector indicating number of single bananas, I chose 5, added to cart, and moved on to my next shopping list item.
Amazon Fresh’s cart sidebar reveals another missed opportunity for user error prevention. Once I added 5 bunches to the cart, my only indication of quantity was a tiny, grey-toned “(x5)” next to the comparably bolder red price. Why not calculate the subtotal here? A red $ 7.45 is a much more immediate, obvious signal of an atypical banana order, potentially attracting my attention better than tiny, toned-down superscript. Although not shown in the screenshot, the bananas were part of a weekly order for a family of four; I didn’t notice the ~$6 increase in the grand total because the order was large overall, and online grocery shopping prices vary so widely from store to store, or even day to day, on price-sensitive platforms such as Amazon.
Even after an attempt at self-soothing via UX-blaming, I still needed to figure out what to do with my banana windfall. A resulting Facebook post/cry for help revealed not only recipes and storage suggestions (slice first, then freeze!), but several BTDT responses. This extremely unscientific user survey reveals that I’m not the only shopper who has been surprised by a banana bonanza. Amazon Fresh, consider this polite “appeel”: please fix your UX, or customers might split.