MENU
CLOSE
DESIGNWEB Edit : 2024.01.10 Update : 2024.01.30

【ECサイト】トップページの優良デザインを集めてみた

ECサイトのTOPデザインや構成にはどのような工夫があるのでしょうか?
調べてみると意外にもSHOPによって独自の工夫が見られたので、ひとつひとつ紹介していきます。

ECサイトのTOPデザイン参考6選

①STAYFUL LIFE STORE

ECサイトのTOPデザインSTAYFUL LIFE STORE 出典:https://stayful.jp/

カテゴリー、商品一覧、セレクトアイテムなどそれぞれのコンテンツがボックス型にバランスよく整列されています。シンプルでわかりやすい構成にデザインされています。
 

②株式会社ナプラ

ECサイトのTOPデザイン株式会社ナプラ 出典:https://www.napla.co.jp/

正方形のサイトバナーを交互にスライドさせる動きが特徴的です。わかりやすく伝えるため、明解でシンプルにまとめられています。
 

③バーミキュラ公式オンラインショップ

ECサイトのTOPデザインバーミキュラ公式オンラインショップ 出典:https://shop.vermicular.jp/

ボックス型の構図が工夫された商品写真を整列させたトップビジュアルです。シンプルであるが、組み合わせを生かしインパクトがあるデザインに表現されています。

④ZOZOTOWN

ECサイトのTOPデザインZOZOTOWN https://zozo.jp/

ピックアップされた8記事をスライドさせる動きが特徴的です。カテゴリー、商品紹介など情報を優先したデザイン構成になります。
 

⑤ユナイテッドアローズ

ECサイトのTOPデザインユナイテッドアローズ 出典:https://store.united-arrows.co.jp/

8記事の長方形サイトバナーをスライドさせる動きが特徴的です。長方形・正方形・円それぞれのコンテンツごとに写真の形を変化させ、余白を持たせたすっきりとしたデザインに 構成されています。

⑥GREEN SPOON(グリーンスプーン)

ECサイトのTOPデザインGREEN SPOON(グリーンスプーン) 出典:https://green-spoon.jp/

ファーストビュー では画面いっぱいにムービーが流れます。商品はアーチ型に並べられ、サイト内の工夫された動きなどユニークなデザイン表現されています。

Web Trends Lab.編集部

KOHIMOTO Inc.所属。トレンドやノウハウ中心にWebサイトを作るための知見を現場から発信していきます👀また、制作したWebサイトでの活用法や、最前線での施策を伺う企業へのインタビューも実施予定。