The world’s best B2B ecommerce UX: Grainger (2/5)
Tags: opensource, webdev, programming, ux
Published: 2022-12-19 15:41:45

I am a UX specialist experienced in both developing and texting great UX experiences.

For this article series, I’ve spent time digging into some of the best ecommerce sites for B2B and zoomed in on what makes them stand out on their UX.

I will go through and dissect the best pages I’ve found one by one. Hopefully, this gives you some inspiration to take into your ecommerce site.

## Series overview

1. [The world’s best B2B ecommerce UX: McMaster-Carr (1/5)](https://medusajs.com/blog/9-best-ecommerce-ux-practices-with-examples/)
2. [Top 5 B2B Ecommerce sites: Amy Myers MD (3/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-amy-myers-md)
3. [Top 5 B2B Ecommerce sites: Blake (4/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-blake)

*More to come this week!*

## Medusa’s UX and B2B Focus

[Medusa](https://medusajs.com/) provides bespoke commerce infrastructure through its composable commerce platform. Its extendible and open setup makes it well-suited to support cases that require setup flexibility and is easy to customize.

Medusa’s headless architecture makes it possible to build bespoke storefronts that can be optimized to provide a great UX, leading to customer conversion. This is needed in a B2B setting, where most stores are not set up well to cater to the particular needs of a B2B customer.

If you’d like to know more about our product and how we serve B2B users, feel free to visit our [B2B page](https://medusajs.com/b2b-commerce-platform/).

# Grainger

[Grainger](https://www.grainger.com/) is an industrial supplier that offers a large selection of private-label and brand-name products from some of the world’s top manufacturers.

With Grainger, customers can place bulk orders quickly and seamlessly. The main focus is on all-inclusive categorization. Customers can easily filter categories to narrow down their options.

This article explores some of Grainger’s powerful UX, such as:

- Well-organized categories: assist your customers in finding exactly what they need from the first scan.
- B2B-focused Shopping Experience: understand your customers and implement the necessary features that convert visitors to customers.
- Powerful search experience: provide the customer with different options that lead to the results they’re looking for.

## 1- Well-Organized Categories

Good categorization helps customers find what they need quickly. When a customer is looking for a specific product, they’ll try to find the category that this product could fit into.

Ensuring that your B2B ecommerce website’s categories are clearly outlined and showcase enough information about their underlying products will help your customers find what they require easily.

Grainger does a good job at this by doing the following:

- On the homepage, popular categories are shown in a grid layout. Each category has a name and a large icon that gives an idea of what products are available in the category. This makes it easier for customers to scan and find the category they’re looking for.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b24p9rtqupzt7tcxa1ix.png)

- All available categories can also be browsed on a dedicated Product Categories page. Customers can use this page in case they don’t find what they require among the categories on the homepage.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zcgutbotckyof6taz5bm.png)

- Every category level has a detailed description. This helps the customer understand more about what the category is and what they can find in it.
    

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x3yz41j2813t9hqz4phk.gif)
    
- Categories can also be browsed directly from the mega menu in the navigation bar. They are sorted in alphabetical order, making it easy to scan and find something specific.
    

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rfnq4ip3131rgcmeowsh.png)
    

## 2- B2B-focused Shopping Experience

B2B ecommerce websites should streamline the shopping and checkout experience to ensure their visitors are converted to customers, and one-time customers to returning customers.

This can be done by carefully planning and designing the shopping experience based on your customers. Provide the features that would increase the possibility of your customer placing an order.

Grainger offers some good features that show an understanding of their B2B customers, including:

- The Add To Cart button in the Recently Viewed Products section on the homepage, is noticeable and attention-grabbing to the primary action you want the customer to take.
- Recently viewed products are shown on the homepage. Each of these products has an Add to Cart button. This can help customers look back to what they were interested in, and consider it for purchase.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1lgbudpojmmsg0sbeh1p.gif)

- Bulk order is a superpower for B2B ecommerce websites. Customers can enter the SKU of the product and its quantity, and it’ll be directly added to the cart. Grainger provides this feature directly in the navigation bar. This facilitates the shopping experience of returning customers and encourages them to make more purchases.


![](https://medusajs.com/images/ezgif.com-gif-maker%20(1).gif)


- Customers can quickly access a summary of a product’s details from the product's listing page. They can also directly add the product to the cart from that same page.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ahk8obf8xrrdca3mc4hx.png)

## 3- Powerful Search Experience

As B2B websites generally offer a large set of products with different details and attributes, it’s important to provide a search experience that allows the customer to find the products they’re looking for.

Making your search experience powerful is more than just showing the correct results for a search query. It’s providing options to narrow down the results, suggestions for better results, and more.

Grainger provides their customers with the following features to enhance their search experience:

- The search bar placeholder informs the customer what keywords or attributes they can search products by, such as model or part number. This clarifies to the customer what they can look for with the search bar.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a2gupi802g5a06yu58d7.png)

- As the customer enters their query, they see real-time keyword suggestions, recommended products, and search results for products, product categories, and brands. Each of these helps the customer narrow down the available results to what they need.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gh1zr32qy3v7jmgysn1r.png)

- Customers can quickly add the items from the search result to the cart. They can input the quantity and click the Add to Cart button. This is especially helpful for customers that already know what specific item they want.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yq4hhpi0acl1kxiwutu7.gif)

- Save customer search history, which personalizes the search experience and makes the customer reach quickly to products that usually purchase.
- The customer’s search history is saved and shown when the customer clicks the search bar. If the customer has previously conducted a search and wants to look through the results again, this helps them find the results again easily.

## Build your B2B Store with Medusa

With Medusa, the open-source B2B platform, build your ecommerce store to include all these features and more. Use Sales Channels, Customer Groups, Price Lists, and other features to build your B2B ecommerce store.

Learn more [here](https://medusajs.com/b2b-commerce-platform), and follow this tutorial to [start building your B2B store](https://medusajs.com/blog/medusa-b2b-part-1).

## Want More UX Tips?

This series covers other top B2B websites that provide good UX. Check other parts out to get more tips:

1. [The world’s best B2B ecommerce UX: McMaster-Carr (1/5)](https://medusajs.com/blog/9-best-ecommerce-ux-practices-with-examples/)
2. [Top 5 B2B Ecommerce sites: Amy Myers MD (3/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-amy-myers-md)
3. [Top 5 B2B Ecommerce sites: Blake (4/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-blake)

*More to come this week!*