hiro 
最近話題のECプラットフォーム「Shopify」を使って作られたサイトが知りたい。他社事例を研究して、自社のECサイト構築に役立てたい。
こんなことを考えている人はいませんか？
この記事を読むことで以下が分かります。
・Shopifyを使って作られた日本のサイト、海外のサイトのまとめ
・閲覧しているサイトがShopifyで作られたかを調べる方法
この記事を書いている私は大阪在住のweb制作フリーランスです。
東証一部のEC企業で5年勤務した後、フリーランスに転向しました。現在はウェブサイトを作ったり、ECサイトを作ったり、ブログを書いたりして生活しています。
最近はShopifyを使ったECサイト構築に携わっているのですが、先日こんなツイートをしました。
仕事でshopifyのECサイトを構築中。
— hiro@大阪のフリーランス (@hiro_hitoritabi) May 10, 2020
下調べとして、shopifyで作られたサイトを色々見ています。
レッドブルのサイトがshopifyだったのは個人的には衝撃。https://t.co/Dm6iqyc2Byhttps://t.co/VLDWEjs6Chhttps://t.co/ddJSiz27Cy
このツイートを掘り下げます。
Shopifyを使ったウェブサイトの事例【国内】
Shopifyを使ったウェブサイトの事例は、以下の2サイトにかなり丁寧にまとめられています。
Shopifyって、そもそもどんな感じのサイトがつくれるの？
っていうのが気になる人は、まず目を通しておくことをオススメします。各ブランドの説明やサイトの特徴も記載されており、かなり役に立ちます。
ただ、上記で紹介されている中には、「現在はShopifyを利用していないと思われるサイト」もありました。
それらを除外してカテゴリ分けしたのが以下です。
独自に発見したShopifyサイトも追加しています。
| No | カテゴリ | サイト |
| 1 | アパレル | A BATHING APE PIRATE STORE |
| 2 | アパレル | KIT |
| 3 | アパレル | FUMIKODA |
| 4 | アパレル | Sellenatela |
| 5 | アパレル | NA |
| 6 | アパレル | TAYLOR STITCH |
| 7 | アパレル | objcts io |
| 8 | アパレル | grirose |
| 9 | アパレル | Runtrip Store |
| 10 | ライフスタイル | KANAGU STORE |
| 11 | ライフスタイル | Furbo ドッグカメラ |
| 12 | ライフスタイル | Gadget Mart |
| 13 | ライフスタイル | ひとえうさぎ |
| 14 | ライフスタイル | ゴーゴーサイクリング |
| 15 | ライフスタイル | LOUVRICH |
| 16 | 食品 | ゴーゴーカレー |
| 17 | 食品 | Kindred |
| 18 | 食品 | Elmers Green |
| 19 | 食品 | Kyoto Brewing Co. |
| 20 | 食品 | ぬま田海苔 |
| 21 | 食品 | レッドブル |
Shopifyを使ったウェブサイト【海外】
Shopifyを使った海外のウェブサイトは、Awwwardsで探すことができます。
Awwwardsは世界中のデザインを表彰するサイトです。イケているデザインを多数発見できるので便利です。
Shopifyのタグで検索をかけると180件以上がHITします。
海外のECサイトはお洒落なデザインが多いですが、日本人に馴染みのないデザインや挙動がたまにあります。
デザイン面だけを重視して自社サイトに導入してしまうと、ユーザーにとって使いにくいUI・UXになる可能性があるので、注意が必要です。
180件以上あるサイトのうち、いくつかピックアップして以下にまとめています。「カテゴリ」は取り扱い商材を指します。
| No | カテゴリ | サイト |
| 1 | アート | See Make Play |
| 2 | アパレル | Cuts Clothing |
| 3 | アパレル | MITA Eyewear |
| 4 | アパレル | DUMBGOOD |
| 5 | アパレル | Perfect Number |
| 6 | アパレル | 2NDDAY |
| 7 | ガジェット | Nova Smart Home |
| 8 | ガジェット | 2NDDAY |
| 9 | ジュエリー | Karpov Paris |
| 10 | スポーツ | Robin Golf |
| 11 | スポーツ | haywoodgolf |
| 12 | ヘルスケア | Bite Toothpaste Bits |
| 13 | ライフスタイル | Boyd Blue |
| 14 | 食品 | Popbar |
| 15 | 食品 | Queen Garnet |
Shopifyを使ったウェブサイトを見分ける方法
Google Chrome の拡張機能を使うことで、Shopifyを使ったウェブサイトを簡単に見つけることができます。
手順は以下です。
それぞれを詳しく解説していきます。
「IP Address and Domain Information」をインストール
Chromeウェブストアにアクセスし「IP Address and Domain Information」をインストールします。
インストールが完了するとブラウザ右上に「IP Address and Domain Information」のアイコンが表示されます。
調べたいサイトのページに行く
次にShopifyを使っているか調べたいサイトにアクセスします。今回はサンプルとして以下のサイトにアクセスします。
ブラウザの右上にある「IP Address and Domain Information」のアイコンをクリックします。
すると、拡張機能が起動してIPアドレスやその他の情報が表示されます。この中の項目を見ることで、Shopifyを利用しているかが一発で分かります。
「Reverse DNS (PTR record)」のエリアを確認する
拡張機能を起動すると、以下のようなウィンドウが開きます。色々とタブや項目があるのですが、見るのは「Reverse DNS (PTR record)」というエリアです。
このエリアに「shops.myshopify.com」と表示されていれば、Shopifyを利用しているサイトです。
IPアドレスからも分かるのですが、こっちの方が分かりやすいかと思います。
Shopifyでのサイト構築を学ぶのにオススメな教材
- 本なら2020年の12月に発売された「商品売るならShopify 世界標準かつ最先端のECサイト構築入門
」がおすすめ！
私も買いましたが「shopifyとは？」という導入から、実際のストア構築方法に至るまで網羅的に情報が掲載されています。
- 動画ならUdemyの「Shopifyでクライアントのストアを作る人のための講座
」がオススメです！
私も買いましたが、Shopifyでのサイト構築からオーナー権譲渡までを一通り知ることができます。
shopifyは日本語のリファレンスが少なく、独学しようとすると大変です。
ネットで調べたり、Shopifyサポートに直接質問したりして学ぶこともできますが、知識にムラが出たり、そもそも正しい情報でなかったり、というリスクもあります。
今回紹介したのは、両方とも日本語の教材です。
内容も初心者向けなので、
これからshopifyに関わってみたい！
shopify一通り分かっているけれど、抜けてる部分がないか確認したい！
といった方にはとてもおすすめです。
Shopifyで14日間の無料体験をはじめる
・登録にあたってはクレジットカードは不要
・必要なのはメールアドレスだけ
・14日間を過ぎたらサイトは凍結。自動で請求は発生しない
・無料体験中に構築したサイトは本契約後もそのまま使用可能
・無料体験期間中に正式契約しても、無料体験期間が終了するまで月額料金が請求されることはない
まとめ
この記事のポイントをまとめます。
Shopifyを使ったウェブサイトは、この記事内の以下のエリアでまとめています。
Shopifyを使った海外のウェブサイトは、Awwwardsでも探すことができます。
また、Shopifyで制作されたウェブサイトを調べる方法は以下です。
今回の記事はここまでです。