■ 概要 Overview
PRESS BUTTER SANDのバターサンド各種の紹介と価格表示、原材料の表記や販売店舗の案内、オンラインショップなどの各リンクとの入り口になっている公式Webサイト
■ ファーストビュー Above the fold
ハンバーガーメニュー
ロゴ
ソーシャルネットワークへのリンクボタン
オンラインショップのリンクボタン
Product・Shopのジャンプボタン
ニュース一覧のサムネイル
■ ターゲット Target
30代から40代の男性
洋菓子好き全般
■ フォント Font
Libre Baskerville 11px,18px,28px,45px
serif 14px
■ カラー Color
<B>#A5A5A5
<M>#FFFFFF
<A>#FC3500
■ デザインの特徴 Design features
プロダクトは正方形の中央にダイヤのようなモチーフがデザインされたバターサンドだが、そのデザインとリンクするように中心にロゴ、それを軸に中央上部にグローバルナビゲーションが隠れているハンバーガーメニュー、左右中央、中央下にそれぞれジャンプボタンなどが配置されるなど、かなり変わった配置になっている
キービジュアルは動画が埋め込まれ、ルーツになっている東京駅や粉糖を思わせる白い粉雪、デザイン段階でのスケッチや、制作過程の動画をループさせている
品質の高さやブランドイメージが明確に伝わり、知りたい商品のラインナップや価格に関しても、早くたどり着くことができる構成になっている
ブランドカラーのグレーとオレンジを背景色とアクセントカラーに、文字色はホワイトにし、パッケージや店舗デザインカラーと同じ配色、フォントタイプを利用しトンマナが徹底しているデザインになっている
https://buttersand.com/