McMaster Carr – The Smartest Website You Haven’t Heard of

Most people I know haven’t even heard of it, but mcmaster.com This is the best e-commerce site I have used so far.

McMaster-Carr is an industrial supply company. They sell nuts, bolts, bushings, bearings – almost everything an engineer needs to build stuff. I have purchased from them dozens of times over the years for both personal and school projects.

But why is their website so great? And why should an industrial supplies company have the best e-commerce site on the Internet?

mcmaster.com Great because it does what it’s supposed to do, and nothing else.

First, let’s look at the visual design of the site. Minimal, mostly grayscale, with accents of green and yellow. There are no popups, animations, banners, carousels, or videos here – just a cool, static page with categories and a search bar. To avoid inadvertently drawing your attention, even the images are grayscale.

It’s not the most stunning site to look at, but that doesn’t matter here – McMaster has chosen function over form.

When users visit McMaster-Carr their goal is to find their part as quickly as possible. The website is completely designed based on this fact. Users rarely come to browse, so there are no AI recommendation algorithms, exclusive products, new arrivals – it doesn’t make sense in this context. People go to McMaster-Carr with great intentions to buy a specific part, that’s all.

So how do we get access to a portion of the 700,000 products in their catalog? This is what I do.

Let’s say I’m searching for a bolt:

1. I type “bolt” in the search bar

2. McMaster shows me several subcategories: hex head, socket head, set screw, etc. I’m looking for a socket head, so I choose that.

3. Now I turn my attention to the navigation bar on the left, which shows me several filtering options. Bolts are usually specified by thread size (for example 1/4″-20), and their length. I am looking for a 1/4″-20 x 1″ bolt, which means the diameter of the bolt is 1/4″ and its length is 1″, so I select these filters.

4. There are over a dozen other filters, such as material, hardness, and head size. Once I’ve applied enough filters, the main search window shows individual items instead of subcategories. Here I can select an item and add it to cart.

McMaster’s search interface is the main reason for its design superiority. Everything on this page is designed to get you to your part as quickly as possible. The filter sections are simple and elegant, providing schematic illustrations when needed. Pictures are always simplified to deliver only the relevant information, so you won’t be distracted from the focus of your search.

Results pages also show helpful drop-downs that explain the parts you’re looking at. It is like an engineer’s handbook and catalogue. Engineers often look up terminology on the fly anyway, so embedding this information on the site saves valuable time.

McMaster’s filters are useful not only for a targeted search, but also for deciding exactly what you want. Sometimes I’ll just search with a general idea of ​​the part I need, and then I’ll use the subcategory description to determine specifics. For example, I may know I need some type of lock washer, but I’m unsure which one is best for my application. I can use the images and descriptions to decide on the right configuration.

McMaster is able to provide such intuitive searching and filtering because everything they sell is highly legible – it’s all defined by quantitative specifications. There’s nothing intangible to deal with, such as brands, product photos, or other marketing materials. Still, they work much better than other industry websites granger, digikiOr home depot,

As a point of comparison, Amazon does a much worse job of filtering items. Amazon has a lot of products to order on its site, which definitely makes the job more difficult. However, general filters like price are also useless. I won’t talk much about my dislike of Amazon’s UI design, others have already written a lot about it [1] And that’s not the point, but it’s interesting to compare McMaster to what everyone thinks of as an “e-commerce site.”

Take Amazon’s price selector: Why does it have two text boxes? Why not a slider? This has always bothered me, because it’s much easier for me to drag a slider than to manually type in my maximum price. And the quick-select categories are virtually the same no matter the product. If I search for a pen, whatever results I want should be under about $25. If I search trampoline, any result I want will probably be over $200. What nonsense?! I think it somehow won the A/B test, but I can’t think of a reason why.

Finally, the coolest part of McMaster’s product is that for almost every part, they have a CAD file that you can instantly download into your 3D model. Mechanical engineers simulate designs in CAD programs before actually building them, and having access to pre-modeled parts saves time. (Imagine having to model all your nuts and bolts manually.) McMaster has also extension For popular CAD programs that allow you to import part files directly instead of using their website. This makes engineers’ lives 10x easier (and also makes them more likely to buy from McMaster-Carr). Its closest analogy is an AR try-on, but it’s not quite as accurate. The purpose of an AR try-on is to determine whether you like the item you’re about to buy, while the purpose of McMaster’s CAD download is to speed up an engineer’s workflow. In most cases, they already know what part they need, it’s just a matter of completing the CAD model before starting to build the real thing.

mcmaster.com Almost complete. This is a website that will create steve krug Smile. My only suggestion would be to make the search bar more prominent on the home page. It’s visually overwhelming to sift through dozens of product photos, so I always use the search bar to start narrowing down items. The main area of ​​the homepage is effectively empty space, while the search bar is relatively small. New users may miss it and waste time.

I decided to write about McMaster-Carr because it’s very rare to see this kind of careful consideration in an industrial web app, far away from the hustle and bustle of Silicon Valley, Web3, D2C and other niche topics of pixel perfection.

mcmaster.com A product that understands its customer. The minimalist, functional design allows users to find their parts as quickly as possible, nothing more or less. It’s an unexpected reminder not to get lost in the allure of smooth gradients, 3D animations, or sleek fonts and instead constantly focus on what your customers really want.

[1] “Jeff Bezos is a notorious micro-manager. He micro-manages every single pixel of Amazon’s retail site. He hired Larry Tesler, Apple’s chief scientist and probably the most famous and respected human-computer interaction expert in the entire world, and then ignored everything Larry said for three years until Larry finally – wisely – left the company. Larry would do so many huge usability studies and no Will demonstrate beyond doubt that no one can figure it out. The frigging website, but Bezos couldn’t let go of those pixels, all those millions of semantics-packed pixels on the landing page were like millions of his own precious children, and Larry isn’t.” https://gist.github.com/chitchcock/1281611