見出し画像

48. ミニフジコ#1日1サイトレビュー

【ターゲット】
・甘くて美味しいりんごが好きな人
・小さめのりんごを探している人
・りんごを美味しく長期保存したい人

【印象】
・明るい水色とピンクの配色で、所々にりんごの写真と女性の写真があり、ポップで可愛らしく親しみやすい

【カラー】
ベース:ライトブルー#CEE4E7とピンク#F3E6E7
テキストカラー:ピンク#E07D8A、黒#000000、白#FFFFFF

【フォント】
本文:Lato
英字:Montserrat

【アニメーション】
・サイトを開くと、水色とピンクのグラデーション背景に富士山を被ったりんごのキャラクターがくるくる回っている
 →TOPの写真とロゴ→キャッチフレーズ→キャラクターの順で表示される
・BUYボタンがくるくる回っている
 またマウスオンすると、少し大きくなる
 また右下で固定になった際、りんごを見つめる女性が動いている
・TOP下のキャラクターの顔と吹き出しが順に変わる
・向かれるりんごの写真がコンテンツの右側に
・「PROFILE」コンテンツで目を輝かせたりんごが顔を出したりしまったりしている
・スクロールするとコンテンツが左からスライドしてくる
・コンテンツの要素が上下にふわふわ揺れている
・「HISTORY」で、りんごを頭の上に乗せた女性が上下に出たり入ったりしている
・「INTERIOR」コンテンツの写真が右から左へ流れている
・ボタンにマウスオンすると、ボタンを押したようにへこむアニメーション
・SNSのボタンにマウスオンすると青色が少し暗くなる

【あしらい】
・ヘッダーはなし
・キャッチフレーズの色が、水色とピンクのグラデーション
・ロゴの「U」から芽が生えている
・TOPの背景が水色とピンクのグラデーション
・BUYマークが丸めのギザギザ◯
 また、TOPを過ぎると右下で固定され、女性の写真と「購入はこちら」の吹き出しが表示される
・りんごが富士山を被ったようなキャラクター
・TOP下のキャラクターの横に「まるで富士山の日の出みたいに堂々登場しちゃいます!」のテキスト
 またキャラクターの顔は四種あり、吹き出しのセリフとともに変わる
・背景はラインが斜めに区切られている
・テキストやコンテンツは黒線で縁取られている
・フッター上に、ドリンクのバナー
・写真は白く縁取られている
・ボタンは縦69px、横468px

【サイト全体の構成】
・TOP画像
・ABOUT
・RECIPE
・INTERIOR
・PRODUCT
・Instagram
・フッター

【ファーストビューの構成】
・ロゴ
・TOPの写真
・キャッチフレーズ「やっと、あなたに逢えた。」
・BUYボタン
・SCROLLマーク

画像1


【フッターの構成】
・ロゴ
・販売元情報
・メールマーク
・SNSマーク(Instagram)

画像2


【レスポンシブ】
・ヘッダーなし
・BUYボタンは画面中央下に移動
 TOPを過ぎると右下に固定
・全てのコンテンツが1カラム構成
・ロゴは、縦71px、横150px(ヘッダー)
     縦28px、横227px(フッター)

画像3


【気づき・分析】
・女性がりんごを持った写真を載せることでサイズ感が分かりやすい
・「富士」をモチーフにした背景やイラスト・配色になっている
・女性の写真やりんごの写真が多く用いられており、親しみやすい
・コンテンツがふわふわ上下に揺れていて目が引かれる
・目立たせたいテキストは、ぼやけてない水色のシャドウがつけられている
・ボタンがマウスオンの仕方によって凹み具合が変わる
・影付きの切り抜かれたりんごの写真で境界を作っている

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