Hearts Don’t Lie: The Importance of ‘Favouriting’ in E-Commerce

Simply put, “favouriting” is a method by which you allow the user to add or save a product to a list of favourites. It enables quick access to a central area of your app or website, where users can review all products they have shortlisted to consider purchasing at a later point in time — perhaps, after they’ve received their paycheck, for example.

This approach has been available under various guises for many years — primarily, under the names of, “wishlist” and “registry”. However, in recent months, there has been a notable rise in the prominence of the functionality that allows a user to add a product to a list of favourites. Calls-To-Action (CTAs) are now not only appearing on product pages but also on product list pages and search results too, thereby indicating just how important retailers feel this functionality is to their users

Why Is “Favouriting” an Integral Part of the ‘Browse and Shop’ Journey?

A list of ‘Favourited’ items in ASOS’ iPhone app (2015)

From usability testing I’ve previously been involved with, as well as app reviews I’ve read for a number of retailers’ apps, there is a clear consensus that users have historically used the shopping bag as a means of “favouriting” products. If a user sees something they like, but aren’t sure whether or not to purchase it right away, they’d add it to their bag anyway. They’d then review and remove the products they don’t want at the point they’re ready to commit to purchasing. Makes perfect sense from the user’s perspective — it’s quick, easy and convenient.

The biggest problem users face in adopting this approach, is the fact that the contents of their bag are only ever being saved for a set amount of time — often, for less than a day. On coming back to review their bag, they’d often find that it had been emptied without their permission. Annoying, to say the least.

Some retailers have combated this to some extent by extending the period for which the contents of the bag are saved.

Others have created a dedicated area in their app/website where the user can add products to a list of favourites, which in turn will be stored for an infinite period. Or, at least until the user either purchases a favourited product or consciously decides to remove it from their list.

In doing so, it gives the user a reason to come back to a retailer’s app/website, with a view to making a purchase.

The Design of the “Favouriting” Experience

With the rise in popularity of “favouriting” across mobile, it’s important to deliver an experience that is consistent with what others are already doing in this area. The design and placement of CTAs that allow the user to add a product to their favourites, at the bare minimum, should be aligned. This means providing the ability to add to favourites from the product list page, search results and product page.

Picking the right icon to represent your “Add to Favourite” action is also crucial. In the past, I’ve experimented with both a heart and star icon — the latter, based on the familiarity of a star being used in web browsers to add a bookmark. On concluding this testing, there was very little difference between the two in terms of the perception of what the icon stood for. Users understood the purpose of each CTA. The heart icon was a marginal winner and is the more widely adopted of the two, but it is worth A/B testing for further reassurance.

Similarly, the positioning of the “Add to Favourite” CTA on the aforementioned screens/pages is of equal importance.

The ‘Favouriting’ function on Topshop’s iPhone app (2015)

On the product page, proximity to the “Add to Bag” button seems to make the most sense and appears to be the preferred placement among retailers. As far as the product list page/search results page is concerned, only a handful of retailers are currently allowing users to favourite a product from here, specifically. Those that do, have primarily adopted the position just below the product image in the product listing, floated to the right of the product title. Again, a great candidate for Multi-Variate Testing (MVT).

As far as accessing favourites functionality, those who offer this facility in their iPhone apps, often have a dedicated tab in the Tab Bar, as a direct route in. It’s perfectly placed for comfortable thumb reach, regardless of whether the user is left or right-handed, but also works well for both single and two-handed device use. Those that don’t provide a Tab Bar (but instead, favour a “Hamburger Menu”), tend to position their CTA directly to the left of the shopping bag CTA, towards the top-right hand corner of the viewport.

Again, of the examples I’ve seen, the design of the favourites area isn’t too dissimilar to that of the shopping bag. For any products listed here, you’ll usually also find a supporting product image, product title, price, colour and size. If a colour and/or size weren’t selected prior to favouriting a product, you have the option to edit these details. It’s often necessary to do so before being able to move the favourited product to your bag. Some retailers’ apps/websites will direct the user back to the product page to specify this criterion, whereas a better experience would be to allow the user to edit this information in place, whilst still in the favourites area. You also have the option to remove an item from the favourites.

One way to further improve the design of the favourites area would be to provide details of any price reductions (or increases) since the product was originally favourited. If for whatever reason, favourites cannot be stored for an infinite period, then another enhancement would be to display messaging around how much longer each product will remain as a favourite for (e.g. “12 days”), before it’s removed automatically. In doing so, this will help avoid any unnecessary annoyance/disappointment on the user’s part and may even help speed up the decision-making process around committing to purchase.

How “Favouriting” Has Changed the Way I Choose to Shop on Mobile

For the most part, my mobile shopping journey consists of a keyword search (for speed and convenience) followed by the repetition of going from a product list page to a product page, then back again, until I settle on a product I have an interest in purchasing.

Forcing sign in to ‘Add to a Wishlist’ in New Look’s iPhone app (2015)

With some retailers now offering the ability to favourite directly from a product list page, that’s had an impact on the way I personally choose to shop across mobile. In apps / on websites that offer this functionality, I will still perform a keyword search but instead of the repetition of the steps described above, I’m now scanning down a product list page and favouriting products in the process. In turn, I’m avoiding the need to go to the product page. I’m effectively shortlisting products of interest, primarily, based on the product image and price displayed on the product list page alone. Once I’ve shortlisted enough products, I’ll then go to my list of favourites with a view to cut the list further — again, based on the information provided in the product listings alone. Only after I’ve done this, will I then look at the product pages of the favourited products that remain on my list, before making a final decision on what to purchase.

I may be one of just a handful of individuals that do this; however, what I would say is that this journey and the decision making that comes with it, is heavily reliant on the design of the product list page and the information displayed in each listing. As I’m quickly scanning down the list, I’m making a judgment call as to whether or not to favourite a product, within a fraction of a second. I’m initially looking at the product image and if it takes my fancy, I’ll then quickly scan the price to see if it’s within budget. When I come across a product that satisfies this criterion, I’ll then favourite it. Remember, this is a split-second decision. I can’t stress that enough.

With the help of user testing, there’s a lot that could be done to determine how best to optimise a product list page, specifically with favouriting in mind, if indeed it does turn out that a large sample of your user base are following a similar journey.

Potential Setbacks

A somewhat disruptive approach to adding to a list of ‘Crushes’ in Nasty Gal’s iPhone app (2015)

One of the biggest challenges retailers face with functionality like “favouriting” (and saving the contents of the bag), revolves around the issue of managing stock inventory. A number of retailers may have legacy stock management systems, which in turn hold the stock that is sat in a user’s list of favourites, in reserve, thereby preventing others from being able to buy those products. For some retailers, this could pose a massive issue.

Another issue is the maintenance of favourites across all channels i.e. apps and websites. If a user favourites a number of products on a retailer’s website, how can that retailer ensure those products are also available in the user’s list of favourites when they next launch that retailer’s app? There are some retailers who do force login, presumably, to accommodate this persistent behaviour.

Conclusion

Offering the ability to favourite products, gives users a reason to come back to your app/website with the intent to purchase. It’s a quick and convenient way for users to build up a list of products they are interested in buying — be it now, or in the near future. If you don’t already offer such a facility, it’s well worth considering for development, especially as it’s fast-becoming expected functionality as far as the user is concerned. If in doubt, speak to your users and see if there is an appetite for it.


Originally written and published to www.uxchap.com on December 21st 2015, by Joe Pendlebury.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.