11.京都クラフトビール応援隊 #1日1サイトレビュー
【目的】
各店舗への集客
1店だけでなくはしごしてもらう
⇒そのために、スタンプラリーをしてほしい、LINEの登録もしてほしい
⇒地酒だから観光客は好きそうだけど、スタンプラリーは地元民じゃないとできなそう
【ターゲット】
ビール好きな地元に住む人
ビール好きな観光客
【フォント】
system-ui
【配色】
ベース：#ffffff
背景・フォント色：231815 / 47270d / 444444
LINE背景：2aa738
茶色中心で大人っぽさもあり、優しい配色
【印象】
イラストがポップで楽しそうな感じ
シンプルですっきりとしている
【メインビジュアル】
・まずサイトのロゴが中心に表示されて、上部へ画面が動くアニメーション
同時に、サイトタイトルがくるっとまわる
・イラストがでポップな印象
画面左側に配置され、右側に余白。サイトタイトルが表示（2：3くらいの割合？）
真ん中に大きくビールが描かれ、バックは京都のイベントや建造物を表す絵柄となっている
・右側に小さく、スクロールを促す表示
【グローバル・ナビゲーション】
・ハンバーガーメニューでの表示
多くの飲食店を載せているサイトなので情報量が多くなるため、ハンバーガーメニューでの表示にしてのでは
・クリックすると、背景が透過されたメニューが開く
【コンテンツ】
・スクロールすると、スライドで表示されるアニメーション
・マップ以下はふわっと下から表示
・まずお店のマップが表示されており、位置関係がわかりやすい
・番号をクリックするとそのお店の詳細へ飛ぶようになっている
・その下にお店の詳細情報が並べてあり、ホバーすると背景色が変わり写真がアップになるアニメーション
・お店紹介のコンテンツは余白なしで画面いっぱいを使っている
・お店の詳細情報をみた後、ブラウザの戻るボタンを押して戻っても、最初サイトを開いたときの様に「毎回ロゴが表示されて画面がスライドするアニメーション」がはいる
⇒毎回あるとちょっと、もういい！となるかも
他のお店はもう見るのやめようかなとなるかも…
・マップとお店詳細の間に、スタンプラリーのバナー
最初ぱーっとサイトを見たときにわたしはこれに気づかなかった。
あとからハンバーガーメニューを開いてみたときに、「スタンプラリーってなんだ？」と思って戻ってみてはじめてここにあることに気づいた。
マップもお店も画像だから、画像ばかりで見落としてしまったのか。
ぱっと見よくある広告みたい。サイトのコンテンツだと気づかない。
⇒スタンプラリーをやってもらうことでいろいろなお店に行ってもらおうという取組だと思うので、もっと大きくスペースをとってわかりやすいほうがいいのではないか
（これはWEBデザイン関係ないけど、スタンプラリーを集めて缶バッチがほしい人はどれくらいいるのだろうか…？
わたしは酒好きなのでいろんなお店をまわってスタンプが増えていくのは嬉しいと思うけど、缶バッチはいらないかな。値引きとかビール1杯無料とかのほうが嬉しい笑
グッズにした意図があるのだと思うけれど…）
・一番下のコンテンツ、「オリジナルクラフトビールの開発お任せください」と「見学ツアー」サイト内のほかのページに遷移するのかと思ったらそのままメール送信画面が起動された。
メール画面になるとは思っていなかった。「お問い合わせ」というコンテンツタイトルをつくるとか、「問合せはこちら→」みたいな表示があったほうがわかりやすい。
【レスポンシブ表示】
・メインビジュアルのイラストの上にサイトタイトルが表示
・パソコンの検証機能のスマホ表示にするとイラストは下の人間の絵の体全体まで全て見えたが、実際にスマホで見てみたらファーストビューで見えるのは顔の部分までで体は見えない。
しかしスクロールしたら体の部分はそもそも表示がなく、イラストはファーストビューでおさまるサイズまでになっていた。
そういう実装ができるのか？やり方は？
・パソコンのような地図表示はなし。
ボタン表示に変わりPDFの地図が新しいページで開かれる。
⇒いろんなお店を何件もはしごしてもらうことが目的なのであれば、PDFではなく、GoogleMapをそのまま起動できて道案内してもらえるようにした方がいいのではないか？
・そもそもきっとこのサイトを見る人はパソコンではなくスマホで見る人が大半だと思う。スマホで場所を確認しながらお店を訪れ、飲みながら次はどこのお店に行こうかなと探すと思う。
【その他】
・ファビコンがワードプレスのマーク？
・Googleで「京都」「クラフトビール」で検索して3ページくらいまで見てみたがこのサイトは検索結果にでてこなかった。せっかくいろんなお店が載っていて飲み歩きできて楽しそうなサイトなのでもっと目につくといいな…
・掲載されているお店のサイトも3店舗くらい見てみたが、このサイトへのリンクは貼られていなかった。全店舗あげてのプロジェクトというわけではないのかもしれないけれど、せっかくだから各店舗のサイトにもこのサイトへの遷移バナーがあればいいなと思った。
この記事が気に入ったらサポートをしてみませんか？