44. ADJUVANT CLEAR GEL#1日1サイトレビュー
【ターゲット】
・肌の不調を感じる人
・美容トレンドに敏感な人
【印象】
・白・青の配色で清潔感があり、体に優しい安心できる商品を売っている印象
【カラー】
ベース：白
テキストカラー：青#71AFD0、グレー#8E96A3、黒#444849、白#FFFFFF
【フォント】
本文：ヒラギノ角ゴ ProN
英字：quasimoda
【アニメーション】
・サイトを開くと、白いカーテンが揺れるような背景に商品写真が出てきて、その他の要素が出てくる
・ヘッダーのテキストにマウスオンすると、色が黒から青に変わる
・TOP右下の最新記事にマウスオンするとテキストに下線が引かれる
・スクロールすると、ヘッダーにロゴが出てくる
またゆっくりコンテンツが浮かび上がる
・「HOW TO」コンテンツで洗顔方法が右から左に切り替わる
・記事にマウスオンすると、写真が少し拡大されテキストに下線がかかる
・最下部の写真が、女性に当たる光がゆらゆら揺れる
【あしらい】
・ヘッダー：正規取扱店舗のボタンがある
固定
・ロゴが笑顔をモチーフにしたような形をしている
・右下に最新の記事がある
・「ABOUT」コンテンツは、ピントが合っていないようなボケている写真がある
また写真が角丸
・各コンテンツのタイトルはキャッチフレーズ
・「HOW TO」コンテンツでは、3つの円で商品の性質を紹介している
・女性のイラストで洗顔方法の説明
・「PRODUCT」コンテンツで、「値段」と「主な成分」だけ青色
・タイトル横に途切れた円のようなあしらい
・ボタンは、縦80px、横335px(ヘッダーのボタンは縦70px、横200px)
【サイト全体の構成】
・ヘッダー
・TOP画像
・ABOUT
・HOW TO
・PRODUCT
・TOPICS
・フッター
【ファーストビューの構成】
・ヘッダー（・ABOUT・HOW TO・PRODUCT・TOPICS、ADJUVANTボタン)
・ロゴ
・商品写真
・最新記事
【フッターの構成】
・ロゴ
・CORPORATE SITE
・PRIVACY POLICY
・CONTACT
【レスポンシブ】
・ヘッダー（ハンバーガーメニュー）
ハンバーガーメニューは2本線
ハンバーガーメニューを押すと、線がクロスし、画面全体にメニューが出てくる
・全てのコンテンツが1カラム構成
・ロゴは、縦100px、横90px(ヘッダー)
・ボタンは、縦60px、横335px
【気づき・分析】
・真っ白な配色のサイトで清潔感があり、化粧品に合っている
・白と青の配色で爽やかさも感じる
・TOP画面は商品とロゴだけのシンプルな配置で、商品がしっかり目立っている
・ロゴが笑顔の口をモチーフにしており、使用することで笑顔になることを伝えている？
・「HOW TO」コンテンツでは、3つの円で商品の性質を紹介しており分かりやすい
・テキストのジャンプ率が高い
・組み合わせると良い化粧品がメインの商品の下に紹介されていて、一緒に買ってもらえる可能性が高い
・いくつかの写真がピントが合っておらずぼやけたような加工になっており、写真が目立ちすぎないようになっている
・写真は白く明るいもの・光が当たったようなものが多い
この記事が気に入ったらサポートをしてみませんか？