My role: Interaction Designer (student project)


The opportunity

The online shopping experience has a familiar browse and buy flow. Generally, we land on an ecommerce site, do a search or look for what we're interested in category pages. We then gather information about individual items. When we’re ready to buy, we add the items we liked best to a cart, shopping bag or basket. But there are other states besides the cart and checkout: the wish list, favorites list or save for later. These states have several use cases but fundamentally give shoppers more time to gather complementary items, compare and decide on alternatives, or to simply to watch an item over time. For many retailers, the intermediate wish list or favorites list is a valuable use case, often given equal hierarchy to the cart in top nav bars.

The standard of this intermediate state of a wish list or favorites list before the cart doesn’t have a single pattern, in fact several areas on a site can add cognitive load and require some effort to recall where those items were saved. The expansion of the shopping experience to multiple devices adds to the complexity.

framer prototypeframer prototype

The wish list reimagined

My goal was to come up with a simple pattern that didn’t break the browsing flow and gave customers a quick way to add to a single list for review at the end of a browsing session. I was inspired by the interaction of dragdis, an online drag-and-drop bookmarking tool. Because physical engagement, according to Susan M. Weinschenk can be an influential part of the decision-making process, I wanted to add a more involved physical action of the drag-and-drop to allude to the physical aspects of taking something off a rack or putting something into a cart.

I wanted to explore ways to simplify this experience and design a new interaction paradigm that doesn't break the browsing flow.

*I focused on the web experience with the presumption the app or mobile experience had comparable features.

What's out there today

I started by looking at the top-10 US online retailers along with some niche shopping sites to create an audit of the pre-cart states: favorites lists, wish lists and save-for-later lists. 

Audit infographicAudit infographic

Audit analysis

It became clear there wasn't a standard way sites treated the pre-cart, pre-purchase state. Amazon had the most options. Shoppers can create lists, heart exclusive items and interesting finds, add things to an Alexa shopping list or to Dash buttons—shortcuts to quickly find and reorder products. The many-option strategy gives shoppers more ways to save items. It’s not a bad strategy because shoppers think choice equal control (Susan M. Weinschenk), but runs the risk of reducing confidence in a purchase by adding cognitive load of finding where items were saved. 

On the other side of the choice spectrum were Asos and Farfetch, sites that opted for a simpler approach by having only a favorites list on the same hierarchy as the cart. Asos and Farfetch had a seamless add to favorites from cart back to list and vice versa, with the same options available whether you were signed in or not.

Kohl’s had the most functionality for wish lists, where shoppers could set budgets and add dates for important events.


1. Words matter

Many retailers require naming lists (Home Depot, Target, Costco) before you can add anything to them. This requires shoppers to have an idea about a category or theme. But categorizing after you’ve collected items might be easier. Users aren't always sure what the categories are until they start adding things and often start with generic list names: "likes" or "my stuff."

Naming can also befuddle, like the case at BestBuy where Saved item lists and Save for later in the cart are not the same thing. Saved items do not appear in the cart like save for later items as you might expect. 

Sign-in messages presented to non-signed-in users who wish to add items to a list tend to put the onus on the user. An example from Gap:

“Don’t see your favorites. Check your devices to see if you saved Favorites without signing in. If so, sign in on that devices and hit refresh to access all of your saved Favorites.”

A better option: “Keep track of what you want in one easy place. Sign in to create lists.”


2. Sign-in pages break browsing flow

The majority of retailers require users to sign in before they can save to a list or save for later. The sign-in is typically a jarring takeover sign-in page. 

Sephora had a good example of a less intrusive sign-in flyout "to add to Beauty Bag."

Design choices impacted sign-in consistency. Like Sephora,  Rei has a less intrusive sign-in modal pop up when an attempt to add was made. If the top nav was visible, from which the flyout emerged, it was not a problem, but when the top nav was hidden above the fold, you're taken to a full page to sign in.


3. Business logic driving user options

In the Costco shopping experience, business logic isn’t transparent to the user. It’s not clear why some items can be added to a wish list and some to a registry while others to neither:

  • Shoppers can add a $49.99 Kettle to Wish List and to Registry
  • $1299.99 Chase Lounge Set to Registry only
  • $42.99 Diapers to Wish List only
  • $42.99 not member only towel set can't be added to any list


It was also common to see Save for later restricted to items already in the cart. (Amazon, Walmart, Nordstrom)

And it’s less common to see the option to add to a List or Wish list from the cart (Madewell, marcjacobs.com do). Apple and Barneys require shoppers to go to the product page from the favorites list to add to bag because it’s not possible to add an item from the list directly. This seems like a lost opportunity to get shopper to the shopping bag. Similarly, Gap allows shoppers to favorite from product pages and category and search result pages, but not the cart.

It's not a two-way street. Except for Amazon, Farfetch and Asos, the ability to go from one list to another no matter where shoppers initially saved an item is uncommon.


4. Validating choices

Sephora and Target show how many other shoppers also favorited/saved an item. Target has the most involved list and registry creation process but a consistent favorites experience that included the other-shoppers-also-liked number. Target is transparent about likes feeding into your recommendations. 

What I learned

A comparative analysis helps uncover different approaches used to meet shoppers' goals to save an item pre-cart. It also tells us there isn't a standard pattern for this behavior. Overall, my hypothesis is that there are too many options for this single, relatively simple user need to store items for evaluation and consideration before committing to buying. This choice may erode shopper confidence, and since the best predictor of when someone is going to decide is how confident they are they've made the best decision, too many buckets to choose from risks eroding that confidence.