見出し画像

#07 サイトレビュー 〜鯛のないたい焼き屋 OYOGE〜

サイト名
鯛のないたい焼き屋 OYOGE

カテゴリー
カフェ・レストラン・飲食店・居酒屋・食品製造

概要
たい焼き屋さんのプロモーションサイト、ブランディング

ターゲット
たい焼きや和菓子、お菓子のトレンドや情報に敏感な人
OYOGEのファンの人

目的
お店や取扱商品のプロモーション、集客
お店のこだわりや歴史の紹介
新商品の案内

印象
シンプル。暖かさ。安心感。親しみやすさ。

ファーストビュー
▷ メインビジュアル
 白地にオレンジの文字や線画のとてもシンプルなMV。
ど真ん中にある魚の線画がちょこちょこ動くのでシンプルだけど印象が残る。MVの端にキャッチコピーやハンバーガーメニュー、SNSのリンクボタンを配置している。MV下部の真ん中にスクロールボタンを配置することでスクロールを促している。

画像1

▷ グローバルナビ:右上のハンバーガーメニューに格納
[TOP:OYOGEについて,商品のご紹介,季節限定商品,店舗情報,NEWS]
[OYOGE's story]
[contact]
[media kit]
[Instagram]
[Twitter]

画像2

コンテンツ
・ 使用色が基本、白とオレンジのみだがとてもキャッチーで視認性もよく読みやすい。
・ 余白を多めにとりテキストも多いわけではないが、画像が多いのでユーザーにとってはワクワク感やこだわりを直感的に感じ取れるサイトになっている。
・ [about]
MVから雰囲気がガラッと変わってオレンジ背景に白文字なのでインパクトが大きい。
「鯛のないたい焼き屋」の意味を伝えるのに、うまいキャッチコピー(「鯛じゃなくてもいいじゃん。俺たちだって焼かれたい。」)と説明文、画像でうまく表現できている。
・ [taiyaki]
3つのこだわりポイントを画像とテキストで説明。
・ [menu]
メニューコンテンツの上にお店の暖簾のようなあしらいが”屋台”を連想することができる(たい焼き=屋台 のイメージ)。
暖簾の下に商品の画像と値段を載せることで実際にお店に訪れたようなサイトになって面白い。
・ リンクボタン
ホバー後の色を補色の青色にすることで目立つしホバーされていることが明確になる。

ボタン

カラー

画像4

フォント
▷ 本文:"A1ゴシック R JIS2004" 16px
▷ 英タイトル:Montserrat 64px
▷ gNav:"A1ゴシック M JIS2004" 36px

レスポンシブ
・ ヘッダーは上部に配置して固定。左に「鯛のないたい焼き屋」、右にハンバーガーメニュー。MVのレイアウトはPC版と特に変化なし。
・ PC版では横並びのレイアウトを多く採用しているが、SP版では全部縦並びに変更されている。それ以外は大きくレイアウトに変化はない。
・ グローバルナビはハンバーガーメニューに格納されており、以下のように展開する。

画像5


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