In a rapidly changing ecommerce market, great ecommerce UX offers an unambiguous way to distinguish yourself from your competitors, offer a great customer experience, and meet your KPI goals.
By some estimates, nearly 95% percent of purchases will be facilitated by ecommerce by 2040. The generational numbers further support this prediction, with 67% of millennials and 56% of Gen Xers preferring to shop online. In such an environment, a bad ecommerce website UX and poor product page UX design can damage your company’s revenue as well as its reputation.
Top strategies like hyper-personalized search, product reranking, mobile optimization, and voice search will not only maximize your revenue, but keep your ecommerce experience up to date for the near future.
Here’s how to get started.
Table of Contents
1. Ecommerce UX-optimized Search
In an ideal world, the user would enter a question into their ecommerce site’s search box and the results would consist of exactly what a user is looking for, no matter how vague the query. Modern search engines powered by data, analytics, AI, and automation are starting to get pretty close.The search box is what users first look for when they arrive on a site. According to Forrester, 43% of users start their ecommerce interaction at the search bar. This means that a powerful search engine built specifically for ecommerce is absolutely critical. There are a few things companies can do to build truly powerful search:
Personalized search results
Providing personalized search results is absolutely critical to ensuring that customers keep coming back. The most powerful brands like Amazon, Spotify, and YouTube have a high degree of user retention in part because they offer a high level of personalization in results.
Personalized search ensures that as the consumer interacts with the system, the subsequent results increasingly match their preferences. Therefore, their ecommerce website UX keeps improving. Companies can achieve this by using a combination of data, analytics, AI, and automation in their search engines.For example, say a new customer searches for “organic milk” followed by “organic meat” and then searches for “apples.” An AI-powered search engine can compare other apple buyers to your customer’s organic-heavy preferences and provide a personalized result like organic apples near the top.
Demographic information is the first piece of the puzzle to optimize. Through their interactions, customers are constantly giving you information about who they are, including age, gender, location, and more. Companies that can leverage this information already have a big advantage compared to companies that don’t.
The big advantages of search start to accrue when companies apply technologies like AI and NLP. The information people provide through their actions—including queries, product views, clicks, add to carts, and purchases—is called clickstream data.
When AI collects and analyzes this data, it can identify the context behind certain actions and recommend the ideal products to offer.
Frustrated/abandoned searches (CES)
A common irritation for online retailers and merchandisers is getting zero result pages or frustrated results—situations where there are either no products displayed at all or lots of products that don’t fulfill the user’s search intent. In both cases, customers are more likely to abandon their search and leave the site due to a poor ecommerce experience.
More often than not, these pages are due to the system not dynamically recognizing common colloquial synonyms. For example, “bedside tables” may be synonymized as “nightstands,” but if a system doesn’t recognize that connection it could return zero results, despite having products that match what the user is looking for.
This happens because most retail search engines rely on simplistic algorithms that match keywords found in the product page title or body. The result? Merchandisers have to spend hours manually making synonyms and redirects to make their search engine work well, which ends up not being an efficient or particularly effective use of time.
But with an AI-powered feature like Cognitive Embeddings Search (CES), layers of deep learning algorithms can understand the relationships between terms and concepts even when they don’t have explicit semantic relationships. It does this by training the algorithm on product data, such as categories, product name, and text descriptions.
The results can dramatically improve the user experience by giving users exactly what they need at exactly the right time. For instance, it can understand the relationship between “healthy snacks” and “freeze-dried banana chips” by mapping concepts adjacent to each other.
Autocomplete (NLP)
Autocomplete is usually considered table stakes for most ecommerce sites. A basic autocomplete ensures that people can access the products they want faster. However, this ubiquity also ensures that ecommerce retailers don’t pay attention to this basic but vital part of their website user experience. After all, an effective autocomplete can boost sales by 24%.
In such an environment, natural language processing (NLP) can bridge the gap between a ditched cart and a completed transaction. An effective NLP-powered solution can correct phonetic misspellings, detect synonyms, and show products in the search bar itself, thus improving ecommerce website UX.
Achieve larger lifts with simple changes.
Discover our top 5 autocomplete UX best practices that have increased conversions.
2. Home Page UX
The homepage on your website is like your storefront. It is in some ways the most critical aspect of the website as it establishes the nature of your relationship with the prospect. While the search box is the most important part of the home page, there are a few more non-search aspects that also define your user experience.
Above the fold
The “Above the Fold” section establishes your brand identity almost immediately. The logo, colors, fonts, and choice of products displayed tell the user a lot about what your company is about.
You can heavily customize this section based on the location and time of viewing. This may include special offers, privacy notifications, promoted products (new or low in stock), hero images, and the all important navigational elements.
A good example is Target Australia, which shows all of these elements.
Another critical but underrated part of the home page is the copy. Most companies neglect how critical this is, relegating the work to junior copywriters or even interns.
“On most websites, it’s the copy that has the biggest influence on conversions,” says Peep Laja, founder of Conversion XL. “The mindset of ‘writing good copy is easy, anyone can do it!’ seems pervasive. Or the copy got written years ago, and nobody’s ever touched it since. There is so much extra revenue to be had through copy optimization.”
Target’s copy above is efficient. It loads action words at the beginning of calls to action (e.g. “Shop All Deals”), and provides exactly the right amount of information needed by prospects.
Storytelling
Along with brand voice and tone enumerated above, the home page should tell a story, prioritized by the most important and time-sensitive information at the top, followed by progressively less important content below.
On an ecommerce website, this structure is typically reflected through new/own brand products at the top, deals in the middle, best sellers below that, and finally keyword-heavy products or categories. A useful example of this is the Backcountry website.
At the top of the page, they display some of their newest own-brand products. In the middle of the page, they display deals and finally best sellers near the bottom.
Navigation
In an ideal world, search should be powerful enough to render navigation moot. But while search technology and ecommerce UX trends are getting there, navigation remains a critical element.
One common ecommerce website feature is the mega menu, which is essentially a massive menu which displays upon hover and highlights all the relevant categories that the online retailer deems important.
Typically, a good mega menu will have plenty of options categorized by user interest and business needs. Visually, it has to be clean with font hierarchy, layout, images, and colors working together to make it easy for the user to tell categories and products apart.
3. Category Pages
Category pages are another critical part of the user journey. When a customer wants to specifically browse a type of product while on their journey to find the perfect match, category pages are critical. Ideally, the first result or subcategory is the one the user wants. However, that isn’t always the case, so making the page easy to browse through, sort/filter the results, or reformulate their search query is important to your KPIs.
Luckily, there are a few technologies at hand to increase the chances that customers can find what they’re looking for quickly and easily:
Personalized Product Reranking
With personalized product discovery, machine learning algorithms can rerank the products that customers are shown—even in real time! Drawing from a combination of sources including clickstream data, merchant preferences, and historical patterns, products can be automatically re-ranked by algorithms. As a result, customers see only those products that are appealing to them, thereby providing a more personalized ecommerce experience as early as the first session.
This results in customers finding what they want faster and driving more search-powered revenue. By using Constructor’s machine-learning platform, for example, Target Australia achieved a 14.8% lift in search purchase rates.
Merchant Tooling
Though automated, AI-powered search is the future, the human in the loop is still the most important element. In the context of an ecommerce company, the AI’s decisions are heavily modulated by merchandising teams who set the limits and the conditions within which the technology works. This helps them maintain a uniform user experience across the site.
This combination of merchandising and search is called “searchandising,” and allows merchandisers to override the AI and leverage their merchandising expertise to provide users the best possible experience. These searchandising powers include boosting new or own-brand products, boosting high-margin/low-inventory products, blocklisting products or groups of products, and more.
Filtering
Although merchandisers might have the final say on which order products are presented to the user, users still need to be able to specify what products they want to see. In ecommerce UX, this means providing customers the right filtering options.
The most basic options here that every online retailer must have are filtering by price, relevance, ratings, and more. However, in certain verticals, companies can get creative with their filtering and sorting options.
Dynamic filtering powered by AI allows filters to change based on the attributes that are likely to matter most to shoppers on each category or results page. For instance, upscale men’s clothing ecommerce retailer Bonobos provides a high degree of customization particularly for its discerning clientele, including allowing customers to filter khakis by pant or short length, color, fit, and more.
4. Product Page UX
So you have effectively guided your customers through the home page and they are satisfied with your category pages as well. They click on a particular product and land on the product page. What now?
Product pages are where the customer actually gets to learn whether the product they have picked is the right one for them. Traditionally, it is the product page where the customer adds the product to the cart and initiates the purchase process.
And since this is where the customer chooses the product, it is also where they abandon a product. This makes the product page UX design critical. Some key elements to get right at the product page level include:
Product descriptions
Effective presentation of the item is critical, and it begins with the copy. Too much detail can overwhelm the user, while too little information can lead to search abandonment. Effective copy is among the must-haves for product pages and should include a descriptive product name, concise information about the offering, and any other information relevant to the purchase.
For more complex products, an “expanded details” section is also helpful.
Images
Multiple high-quality images are among the most important elements on a product page. In fact, 90% of shoppers rated quality of images as the most important aspect of a product selection.
Some best practices associated with great images include:
- Multiple product angles that showcase important details
- On-hover magnification to allow users to view even smaller product details
- A sense of the actual size of the product
- A 360-degree view of the product
- Understanding the context in which a product is used
- Animated views
These rules are particularly true for an image-sensitive industry like fashion. Curtsy, a leading resale marketplace, has examples of these best practices by encouraging sellers to take many high-quality photos of each item.
Related products
Great images and detailed information is table stakes, but an area where truly exceptional ecommerce retailers pull ahead of their competition is related products.
AI-powered recommendation engines like Constructor can draw from clickstream data, NLP data, and aggregated data across hundreds of thousands of customers to present personalized recommendations right on each product page. This strategy can optimize for business KPIs by encouraging upsells or alternative products if customers find that the product they’re looking at isn’t the right one.
Collections
Merchandisers have another powerful tool to improve the user experience of the website. Landing pages are designed specifically to allow customers to act on an offer. This can include custom, timed collections around holidays, sports events, lifestyle interests, and more.
An ideal landing page should have all the virtues of a results page: an easy-to-navigate presentation of multiple products and a well thought-out variety of product groupings.
Of course, to really supercharge this ecommerce element, AI is an essential tool to generate and launch personalized landing pages for a number of use cases. For instance, if a retailer wants better matches for “90s denim,” they can create a ‘90s denim collection quickly with the products they already have and quickly launch it.
5. Cart
The cart is the final step in making the sale. If you have followed all the steps mentioned above, you will have already received a lift in add-to-cart transactions.
The most important thing that ecommerce companies miss out on is giving adequate feedback once a customer clicks on “Add to Cart.” This action can be in the form of a popup, a notification, or a conspicuous change to the cart button.
But optimizations to ecommerce UX can continue even inside the cart. Since the mind thinks in images, large thumbnails of each product in the cart is helpful, along with images of recommendations for potential upsells. If your recommendations are powered by an AI solution like Constructor, the user receives a personalized combination of recently viewed and complimentary products (such as salsa to pair with the chips you’ve added to the cart).
Some companies like Petflow can combine all these advantages:
6. Social Proof and Authority
Social proof is incredibly effective as a reputation builder. In fact, 39% of customers said they trust a brand more when they learn about it from their peers, who are seen as 14% more credible than brand employees.
So in addition to a fast, accurate, user-friendly, and well-designed ecommerce website, it is critical for online retailers to leverage social proof signals like reviews or testimonials. We see this in practice by Bonobos:
Another good way to build trust is making it easy for customers to connect with your brand. This means making sure that non-sales oriented pages like customer service, contact, and support documentation are clear and easy to find. Beauty retailer Sephora does this particularly well.
7. Mobile Optimization Essentials
There’s no longer a clear line between in-store shopping and ecommerce. The real behavior of consumers rests today in an omnichannel model that involves the use of connected devices even when customers are physically in the store. 44% of shoppers now shop on a mobile phone. With most customers walking around with a virtual shop in their pocket, mobile optimization is a straightforward way to future proof your website.
Several technologies mentioned above already massively benefit your transition to omnichannel retail. For instance, accurate, hyper-personalized, and contextually aware search results with large images help reduce painful scrolling on a mobile phone. And mobile-optimized navigation with easy-to-thumb multi-level menus also contribute to better experience.
Several other unique features may also function as best practices in a mobile-led environment.
Voice search
Conversational UX is the next big thing in ecommerce, and having voice recognition layered over effective natural language processing algorithms is bound to massively increase your mobile engagement.
Most modern voice search algorithms aren’t trained on your product catalogs and consistently miss obvious search terms like brand names, product types, and more. A search engine embedded with voice recognition and NLP technology for advanced facet understanding can provide a better user experience that’s in line with customer expectations.
Sephora’s iOS app, for example, has deployed voice search effectively.
Using phone features
Modern cell phones are equipped with a host of features like GPS, cameras, zoom and pinch, and microphones. Creative use of these features for an omnichannel world can provide an up-to-the-minute ecommerce experience for users. For example, QR codes resurged during the pandemic for their utility in allowing users to achieve contactless pay on delivery.
The Future of Ecommerce UX
Ecommerce websites provide an increasingly large share of revenue for omnichannel retailers. In order to get ahead, the most successful retailers will innovate in how they’re able to put customers first at every stage of the ecommerce experience.
With the right combination of powerful search, hyper-personalized recommendations, informative pages, and cutting-edge features like voice search, you will see significant improvements to your business KPIs, conversion rates, and customer loyalty.
With a search and discovery platform like Constructor, you’re already ahead of most.
Is your ecommerce website future-proof?
Achieve larger lifts with simple changes.
Discover our top 5 autocomplete UX best practices that have increased conversions.
