- McMaster-Carr は産業用部品の供給会社で、ナット、ボルト、ベアリングなどを販売している
- どうしてこのような産業用サイトが最高のショッピングサイトになり得たのか? 必要なことだけを徹底しているからだ
- ミニマルなデザインで、ほとんどがグレースケール、そこに緑と黄色でわずかにアクセントを加えている
- ポップアップ、アニメーション、バナー、カルーセル、動画といったものは一切ない
- サイトを訪れるユーザーの目的は、欲しい部品をできるだけ早く見つけること。このサイトは全面的にそのために設計されている
- 見て回るために来る場所ではないので、AI推薦アルゴリズムもなければ、注目商品も、新製品紹介もない
- たとえば「ボルト」を探すとすると
- 検索欄に
bolt と入力
- McMaster はいくつかのサブカテゴリを表示する。形状ごとの
hex head、socket head、set screws などだ。ここでは Socket Head を選ぶ
- 左側のナビゲーションバーを見ると、いくつかの絞り込みオプションが表示される。ボルトは通常、ねじ山サイズ(Thread Size)と長さで分類される。私は
1/4"-20 x 1" のボルトを探している(ボルトの直径が 1/4"、長さが 1" という意味)
- そのほかにも素材、強度、ヘッドサイズなどのフィルターがある。フィルターを選ぶと、メインの検索画面にはサブカテゴリではなく、各アイテムが直接表示される
- McMaster の検索インターフェースは本当に素晴らしい。このページのあらゆる機能は、欲しい部品を最速で見つけられるように設計されている
- フィルターセクションはシンプルで洗練されており、必要に応じて構造を説明する図解も表示してくれる
- 図解は関連情報だけを見せるよう簡略化されているので、検索時に気が散らない
- 結果ページにも、探しているパーツを説明してくれる便利なドロップダウンが用意されている
- エンジニアのハンドブックとカタログを一つにまとめたようなものだ
- エンジニアはこうした用語を直接検索することも多いため、この情報を含めることで貴重な時間を節約してくれる
- McMaster のフィルターは、狙いを定めた検索に役立つだけでなく、自分が何を求めているのかを決める助けにもなる
- 私は時々、欲しい部品について大まかなイメージしか持たないまま検索することがあるが、そんなときはサブカテゴリの説明を通して細部を決めることもある
- たとえば
Lock Washer(ゆるみ止め用ワッシャー)が必要だとは分かっていても、どれが適切か分からないとき、画像と説明を見て判断できる
- McMaster は販売しているすべてのものが仕様で定義されているため、直感的な検索を提供できる
- ブランド、製品写真、マーケティング要素のようなものは一切ない
- それでも Grainger、DigiKey、Home Depot のようなサイトよりはるかに優れた機能を提供している
- 比べてみると、Amazon はアイテムの絞り込みが本当に苦手だ
- もちろん Amazon にははるかに多くの製品があり、それが難しさを増しているのだろうが、価格のような基本的な検索機能からしてかなり良くない
- Amazon の価格選択欄は2つのテキストボックスだ。普通にスライダーではだめなのか?
- しかも、製品に関係なく価格選択オプションはすべて同じだ。とても安いペンを検索しても、高価なトランポリンを検索しても変わらない
- McMaster の利点の一つは、ほぼすべての部品について CAD ファイルを提供しており、ダウンロードして自分の3Dモデルに追加できることだ
- McMaster は有名な CAD プログラム向けの拡張機能も提供していて、ファイルを直接インポートすることもできるため、
エンジニアの生活を10倍以上楽にしてくれる(もちろん McMaster での購入も大いに増える)
- McMaster - https://www.mcmaster.com/ はほぼ完璧だ。検索バーがもう少し目立ってくれるとさらに良いが……
- McMaster は「ユーザーを理解しているサービス」
8件のコメント
設計に関するデータを詳細に提供していることも一因です。
一般的なショッピングモールでは、製品詳細ページですら欲しい情報を得られないことが多いですよね
必要そうな方にリンクを共有しますが、数十年続くサイトだそうです。20年前には、電話帳の2倍の厚さがある冊子型カタログを発行していたとのことです..!
モバイルWebはまったくサポートせず、アプリのダウンロードへ誘導するのも新鮮ですね。
あれ? 私はiPhoneからアクセスすると「App Clipで開く」と表示されて、押したらアプリのインストール手順なしでApp Clipが実行されました! WWDCの動画でしか見たことがなく、実際にApp Clipを体験したのは初めてですが、とても自然に切り替わりますね
あっ、私はすでにインストール済みだったので気づきませんでしたが、それも実装されていたみたいですね。
モバイルアプリもかなりよくできています。見て回るだけでも楽しいです(笑)
ドメインに特化したショッピングサイトを作るときに参考にしやすい、良いリファレンスですね
カテゴリがあれほど多いのに、すっきりしていて無駄がなく、不要にリソースを食う要素もありませんね。
落ち着いた統一トーンのイラストも見やすくて、"あれの名前何だっけ" という時にも役立ちそうなUXです。
基本に忠実な感じですね(笑)