【Webレビュー】No.24 不二家

URL

ケーキ・洋菓子ブランドサイト｜不二家

参考

不二家洋菓子店の新しいロゴデザインが誕生！ そこに込められた願いとは？｜不二家洋菓子

第一印象

ロゴアニメーションめっかわ。
作り上げてきたペコちゃんのイメージをMAXに活用した素晴らしいロゴ。
全体的に優しくて暖かいデザイン→家庭的
見ているだけで食べた〜い！ってなる
フッターが特徴的。

ターゲット

家族向け👨‍👩‍👦

使用フォント

メイン…ゴシック ミディアム BBB
英数字…crimson text

配色

白と赤がベース→ショートケーキ・不二家のCI
文字は赤茶 ↑に合わせて落ち着いた感じ
#280901

サイト構成

home
不二家の想い
商品一覧
美味しさのこだわり（外部リンク）
店舗情報
会社情報

トップページ構成

→ナビゲーションの役割
トップビュー
メッセージ
商品写真3枚
商品情報
記事一覧
関連リンク
フッター

デザインポイント

• 不二家のCIを最大限に活用した不二家らしいデザイン。

• コンテンツ幅→91.17647vw（デスクトップの時）

• 文字間、行間広め→ふんわり穏やかな印象

• ロゴ活用の最適解。あらゆる所に細かくロゴアニメーションが仕込んであって、印象づけにもなる。

• リンクをセクション上部に配置している

  1. →見たい情報にすぐにアクセスできる？回遊率の向上？

• noteをメインSNSにしている場合の見せ方。ロゴの入れ方も世界観を崩してなくてオシャレ。

• トップビューの右下に新商品を置くアピール。

実装ポイント

見せる文字は画像で表示
→画面幅で崩れない
とめどないスクロールアニメーションで、次々スクロールしたくなる