見出し画像

WEBデザイン記録_DAY3

今回も引き続きWEB分析をしていきます!

サントリー ほろよい 商品ページLP

URL:https://www.suntory.co.jp/rtd/horoyoi/

画像1


第一パッと見印象

清潔感あっておしゃれ!かわいい!若者好きそう!

サイト構成

①MV
②NEWS
③STORY
④FILMS
⑤MUSIC
⑥PRODUCTS
⑦SNS

使用フォント

・日本語:明朝体、手書きフォント、ゴシック少し
・英語:おしゃれな手書き風なものと、太めフォント
(すべてimgのため詳細はわからず...名前気になる)
日本語英語ともに手書き風のフォントを使用しているので、親しみやすさや柔らかい感じが出ているので、ほろよいを購入するハードルが下がっているような印象を受けた。

配色

・ベースカラー:ホワイト_#FFFFFF
・メインカラー:ブルー_#1db3c6
・アクセントカラー:オレンジ_#E8C59F、グレー_#EEEEEE
・フォントカラー:ブラック_#000000
ライトトーンを中心とした配色で、軽さや楽しいイメージを連想させるカラー。お酒を飲み始める若い人にぴったりな印象。

デザインポイント

・メインビジュアル:
イラストレーター・HAIさんのイラストを使用した動画で、画面が少し掠れていたりレトロ感があって今はやりな感じ。
最近はTikTokショートムービーが流行っているので、動画の方が20代は親しみやすいのかもしれない。

・ヘッダー、フッター:
商品ページのヘッダーフッターはすべてハンバーガーメニューに入っており、PC・SP共に同じものですべてボタン風で押しやすい。しかしPCでみると少し大き印象を受ける

・背景
PC版で見ることができるほろよい缶のリアルイラストがかわいい!そして少し動きをつけているのでサイトを見ていて飽きない。そしてイラストは大小で配置されていることでサイトが3Dのような立体的に見えてくるので、見ていて引き込まれる。イラスト&配置って大事だな...。

・あしらいポイント
「#ほろよいぐあいがちょうどいい」というが、斜めになっているのがこったデザインではないけど目を引いた⇨他はすべて縦横整列された配置になっているので、斜めになっていると目を引くのかな?



感想


今回は時間をかけてやってみました!
ほろよいを久々に飲みたくなるようなかわいくさわやかなサイトでした!
まだ言語化をするのが上手くいかない部分や分析できそうなことありそうなので引き続きやっていきたいと思います。
とりあえず続けることが目標です…!!

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