見出し画像

【1日1サイトレビュー】 #11 曽我農園の越冬トマト

今回は初のECサイトです!
では早速、色んなスキルを学ばせてもらいましょ〜う🌟


01. サイト概要

フルーツトマトの通販・オンラインショップページ

構成

<Top>
MV→越冬トマトについて→お知らせ→新商品→定番商品→ブログ
<下層ページ>
・商品一覧
・越冬トマトについて
・私たちについて
・ブログ
・お知らせ
・Q&A
・直売所案内(フッターにひっそり)
・ご利用案内
・お問い合わせ

目的とゴール(予想)

・購入してもらう
・越冬トマトを知ってもらう

ターゲット(予想)

・30代〜50代の人
・ギフトや手土産を探している人

02. 客観的な目線で見てみる

もし私が、「トマト好きな友達へのプレゼントを探していたら」と言う設定で見てみます👀
・MVの白い雪の中にある真っ赤なトマトがとても可愛い!美味しそう!
・メディアにも出てて有名だから喜んでくれそう
・パッケージおしゃれでプレゼントにちょうどいい◎
・写真がいっぱいあってわかりやすい
・アマゾンpayでも払えるの楽〜!

03. デザイナー目線で考えてみる

▲配色と文字

配色について

・基本白に近い#FAF8F5がベース背景で使用されていて、文字も白と黒でシンプルな配色。
・フッターだけ黄緑色になるがあとは全てモノクロトーンで統一されている。

文字について

Font-Familyに、「YakuHanJP」とあったので何のフォントか調べてみると、約物(カギ括弧などの記号)を半角にできるのが「YakuHanJP」だそうで、これがあればカギ括弧や句読点での変なスペースがなくなり、綺麗に先頭を揃えられるそうです!!!!!初めて知った。。。
約物だけに影響するので、一番先頭に書く必要がある、フォント増えると読み込み遅くなる、、、と思ったのですが、約物だけなのでほぼ影響しないとのことです!(下記参考リンク参照)

デザインについて

・サイトではないですが、ロゴがめちゃくちゃ可愛い!!!!リボンの形で「そ」の字を描いていて、大切な人に送るのに良さそうな印象。
・PC版は、左のサイドナビと右上のハンバーガー、両方からアクセスできてわかりやすい。SPになったらハンバーガーのみ。
・下記部分、背景の枠から商品写真がはみ出ていたり、文字が背景にまたがっているのが立体感が出て目立つのでいいなと思った。

▲商品画像

・商品一覧ページは、MVの下にカテゴリに飛べるボタンが設置されていたらもっと探しやすいかもと感じた。
・セット商品は、梱包する箱も一緒に写真に写っていて、その箱に入れられてくるんだなと言うのがわかっていい。
・ページに飛ぶときに、右から左にページが映る感じが越冬しているように感じてサイトの雰囲気にあっている。
・商品購入ページは画像や情報がたくさん掲載されており、わかりやすい。(下記参照)

▲商品購入ページ

04. 最後に

トップページ画像

▲トップページ画像

感想

越冬トマト、とても美味しそうだし、こっだわりの詰まった商品でぜひ一度食べてみたいと思いました👏

高品質で丁寧、こだわり抜いたところがサイトの雰囲気にも出ていて良かったと感じました!

ということで、これにて第11回サイトレビュー終了です!
ではまた〜👋

この記事が気に入ったらサポートをしてみませんか?