The world’s best B2B ecommerce UX: Blake (4/5)
Tags: ux, opensource, webdev, programming
Published: 2022-12-21 13:11:58

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 B2B websites 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: Grainger (2/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-grainger/)
3. [Top 5 B2B Ecommerce sites: Amy Myers MD (3/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-amy-myers-md)

*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/).

## Blake

[Blake](https://www.blake-envelopes.com/) is a market leader in the world of paper, envelope, and postal packaging solutions. Blake's B2B ecommerce has a well-designed homepage, an accessible menu, and direct access to brands, colors, and product specifications.

Blake’s product pages include detailed descriptions and different options to order. Overall, it focuses on attracting customers by providing them with seamless features.

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

- Clean and Clear Menus: design the layout of your menus to make it easy for customers to find the categories they’re looking for.
- Informative product pages: provide your B2B customers with all the information they need, encouraging them to purchase.
- Next-level filters: allow your customers to filter beyond the filters. Allow them to navigate their way through your products list to find what they need.

## 1- Clean and Clear Menus

B2B customers often know the exact specifications of the product they want and just want to find it as quickly as possible on your site.

Your B2B ecommerce website should make it easy for customers to scan available products and categories to find what they need efficiently.

Some examples of how Blake does this:

- The typography and spacing used between different elements, products, and categories, make it easier for the customer to scan available products or categories to find what they need.
    

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/awcnd5zt4g3ot3lfoinq.png)
    
- The available options in the menu are grouped into related sets. For each group, concise and descriptive labels are used.
- Customers have the choice to navigate available products using sizes, types, colors, or brands.
- Different designs for different mega menus, depending on the top category, the menu shows up in different styles and different types of links to promote customers for what matters in this category.
- Mega menus are designed differently based on what products are available in the top category of that menu. Customers browsing these menus get a glance of important items in that category.
    

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

## 2- Informative Product Pages

The product page should be simple and not stuffed with too much information. This allows the customer to properly focus on the product and its properties.

Some ways that Blake does this:

- Product images are of high quality and can be zoomed in, which gives the customer a closer and more realistic look at the product. For products like those that Blake provides, this is essential as customers can almost get the textual feeling of the products.
- Provide a brief and informed description next to the image and below provide detailed product information in the table. the descriptions are a key area here so clear, well-written product descriptions that help customers to choose the product is the right fit.
- Products have a brief description at the top of the page, but more details are shown in a table below it. Customers can use the description to learn the general details of the product, then, if they’re interested, browse the more detailed table.


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


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

- Breadcrumbs are available at the top of the product page. It helps the customer understand where they are on the website, as well as what category they’re browsing.
    

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/owr0isgpfeq6m9zljt24.png)
    
- Customers have different purchasing options, either by the pack or by units. This gives B2B customers freedom while ordering and allows them to easily order large quantities.


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

- If customers register, they can request a sample or get help from Blake’s sales team when ordering large quantities. This encourages customers to register.
    

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

## 3- Next-Level Filters

Product filters are one of the essential elements impacting your customers’ user experience. Optimizing your product filters increase customer engagement.

Some practices that Blake applies in their product filters:

- Next to filters, the number of products under that filter is shown. This gives the customer an idea of the results they’ll get before applying the filter.

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

- Customers can see all available categories in the filter. When a filter is applied, not only the products are updated, but the filters as well based on the remaining products. This makes the customer’s browsing experience seamless.


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

- The selected filters are shown at the top of the filter list and can be easily cleared. Customers can navigate between different sets of filters by just clearing applied filters, then applying new ones.


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

- The short filter list saves customers time and makes filtering less frustrating for them.

## 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: Grainger (2/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-grainger/)
3. [Top 5 B2B Ecommerce sites: Amy Myers MD (3/5)](https://medusajs.com/blog/top-5-b2b-ecommerce-sites-amy-myers-md)

*More to come this week!*