ECサイトの商品一覧はデザインや構成にはどのような工夫があるのでしょうか。
調べてみると意外にも売っている商品によって見せ方の独自の工夫が見られたので、紹介していきたいと思います。
ECサイトの商品一覧デザイン参考7選
①STAYFUL LIFE STORE
出典:https://stayful.jp/
長方形のボックス型に商品が並べられ、ピックアップ商品はサイズを変え目立つデザインに構成されされています。カーソル を合わせると別写真が紹介されます。
②株式会社ナプラ
出典:https://www.napla.co.jp/
商品写真と商品詳細が横並びで紹介されたデザインになっています。１アイテムずつ縦に並び構成されています。
③バーミキュラ公式オンラインショップ
出典:https://shop.vermicular.jp/
ボックス型に商品一覧まとめられている構成で表現されています。カーソルを合わせると写真がアップになり、ボックス型が浮き出るデザインにされています。
④ZOZOTOWN
https://zozo.jp/
カテゴリーエリアの右に５アイテムずつ整列され、適度な余白もあり、すっきり整えられたデザインにまとめられています。
⑤ユナイテッドアローズ
出典:https://store.united-arrows.co.jp/
横に６アイテム15列で構成されたデザインで表現されています。統一感があり、明解でシンプルにまとめられています。
⑥GREEN SPOON（グリーンスプーン）
出典:https://green-spoon.jp/
写真とタイトルのみの商品一覧です。５メニューごと縦に並び、写真の情報をメインにまとめられた構成に表現されています。
５メニューごと縦に並び、写真の情報をメインにまとめられた構成に表現されています。
⑦Uniam（ユニアム）
出典:https://uniam.jp/
レシピページのカテゴリーごとに商品が紹介されています。
ポップなサイトにかわいいあしらい、商品カテゴリーを縦文字にデザインされユニークな構成になっています。
KOHIMOTO LABO
WebプロダウションKOHIMOTO Inc.が発信を通して成長していくためのラボ🧪 IT企業出身。世界中の人へ発信できるWebサイトを通じて、社会がより良い方向へアップデートしていく為に日々学び、技術を生かしていきます。
出典:https://stayful.jp/ 
出典:https://www.napla.co.jp/
出典:https://shop.vermicular.jp/ 
https://zozo.jp/ 
出典:https://green-spoon.jp/ 
出典:https://uniam.jp/ 
