![見出し画像](https://assets.st-note.com/production/uploads/images/135559939/rectangle_large_type_2_d5a71b6ebbbea3f9875fa374fed9722a.png?width=1200)
【1日1サイトレビュー】 #16 MODERNCA ONLINE
今回は食べ物のECサイトを見てみます!
では早速、色んなスキルを学ばせてもらいましょ〜う🌟
01. サイト概要
芋けんぴやコーヒーのオンラインショップ
高知県に店舗を構える
🌟高知の昔から愛されている芋けんぴを現代風にアレンジし「モダン菓」に
目的・ゴール(予想)
商品をオンラインで購入してもらう
お店に来てもらう
ターゲット(予想)
若い世代の20代〜40代をターゲット(パッケージがスタリッシュなため)
02. 客観的な目線で見てみる
もし私が、「友達のプレゼントに何か甘いものを贈りたいと思って探していたら」という視点で見て見ます👀
・芋けんぴという昔ながらのお菓子だけどパッケージもサイトもおしゃれでギフトに良さそう!
・コーヒーとのセット商品があるのめちゃくちゃいい!ティータイムにどうぞって贈れる。
・フレーバーを選べるギフトもあって、相手の苦手なものとか避けれるのありがたい・・・
・ブランド別、ギフトか単品か、カテゴリ別など、様々な検索方法があって探しやすい。並べ替えも、人気商品、価格順、アルファベット順と豊富なバリエーション。
03. デザイナー目線で考えてみる
![](https://assets.st-note.com/img/1711764050201-BRpyU1QRA9.jpg?width=1200)
配色について
・基本背景白で文字が柔らかい黒を基本として、目立たせたい部分は、ゴールドぽい#A0793Dを使用。この色はパッケージのゴールドに合わせた感じかな?
・Story部分とフッターのみ少し色味がかった背景があるが、薄い色なのでサイトの雰囲気を邪魔しない程度。
・店内の白く明るい雰囲気がサイトにも表現されている。
文字について
高級感やこだわっていることが感じられる明朝体を基本に使用。
デザインについて
【いいなと思った点】
・トップページで商品カテゴリ3つを表示するところで画像が重なっていく動きが面白いしおしゃれ。また、英語の上から見やすいように日本語も書かれていてわかりやすい。(下記画像参照)
![](https://assets.st-note.com/img/1711765054865-dImzbKuiJ2.png?width=1200)
・人気商品紹介の部分で、全ての商品画像の下に「全ての商品」ボタンを配置していてすぐに全商品一覧ページに飛べるように誘導できている。
・Story部分、ホバーすると写真が出てくる動きがおもしろい。元々写真を配置してしまうとシンプルさがなくなってしまうからこうしたのかな?🤔
・ヘッダーナビの商品一覧の横に「+」があって、下に詳細表示が出てくることを知らせている。あるとわかりやすいと思った!
・真ん中に写真、サイドの余白にナビとロゴ、キャッチコピーが配置されていて、商品画像がとても見やすい。ナビが縦書きで横並びになっているのは新鮮。
【気づいたこと】
・人気商品紹介部分は、インジケーターもなくスクロールができるわけでもなかったのでもしトップページでさっとみたい人はどうやって見たらいいのかわからなかった
・SNSしっかり投稿しているのにサイトではフッターの下の方にしか書かれていなかったので、もっとMVに載せたりしてアピールしたらいいのかも!
・フッター下の画像にロゴが載っているが、もう少し下のパディングあった方がロゴがしっかり見えていいのかも・・・少し窮屈に感じた。(下記画像参照)
![](https://assets.st-note.com/img/1711765364850-5cedvZ76uQ.png?width=1200)
04. 最後に
トップページ画像
![](https://assets.st-note.com/img/1711765441670-PMvSpBAF2w.jpg?width=1200)
感想
高級感もありつつ親しみやすさも感じたサイトでした!MVの写真、とっても美味しそうな写真でつい買いたくなってしまいました〜💦かりんとう好きな夫に今度プレゼントしてみようかな🤔
ということで、これにて第16回サイトレビュー終了です!
ではまた〜👋
この記事が気に入ったらサポートをしてみませんか?