*ポイント*
・トップの画像が時系列に沿ってスライドで表示されていて面白い
・所々フォントではなく手書きの見出しを使用している
・ナビゲーションボタンを横の扇形にしている
・スクロールすると左上にドーナツだけが固定されていてドーナツをhoverするとナビゲーションメニューが表示されるようになっている
色々なサイトを調べ、デザインが気に入ったサイトを100個選びまとめました。
*ポイント*
・トップの画像が時系列に沿ってスライドで表示されていて面白い
・所々フォントではなく手書きの見出しを使用している
・ナビゲーションボタンを横の扇形にしている
・スクロールすると左上にドーナツだけが固定されていてドーナツをhoverするとナビゲーションメニューが表示されるようになっている
*ポイント*
・見出しと説明文のフォントが統一されているので全体的に統一感があるサイトになっている
・吹き出しで一言説明文が所々に入っていて可愛くてPOPなイメージを持つ
・ヘッダー画像の上に今月のイチオシ商品がリンクされていてついクリックしてしまう
・スマートフォンサイズになるとヘッダーのデザインが変わる
・ナビゲーションメニューに生産者紹介があり消費者にとって安心して購入できるよう工夫がされている
*ポイント*
・サンタのいるケーキ屋さんと紹介していることからサンタを思い浮かべる赤を全体に使用している
・商品一覧や店舗紹介の画像付きのリンクが全て同じサイズではなく若干サイズが異なっているが余白を使用し、サイドにあるお知らせと高さを合わせていることから統一感がある
・画像に斜線の影をつけており少しPOP感がでている
*ポイント*
・ヘッダー画像の上にナビゲーションボタンがある
・ヘッダーとフッターの間にあるコンテンツは全て同じ横幅になっているのでスッキリしている
・サイト全体の色合いが緑になっているのでお茶の雰囲気が表されている
*ポイント*
・トップの画像がどんどん切り替わるようになっており、どんぐりの形に切り取っている、一つ一つの画像に吹き出しでコメントを記入しており可愛らしい印象を持つ
・商品紹介の一つ一つの商品が画像ではなくイラストで紹介されている
・商品のカロリー表があり、お客さんには嬉しい表示だと思うので需要を捉えている
・スマートフォンサイズでも見やすい
*ポイント*
・ヘッダー部分にメディア掲載情報や口コミのリンクがあり、行くかどうか迷っている人の後押しになっている
・メニューも一つ一つ値段が書いてあり分かりやすい
・スマートフォンサイズになるとハンバーガーアイコンの隣にメールのアイコンが固定されていて見ている人がすぐメールを送れるようになっている
*ポイント*
・ヘッダー、メインコンテンツ、サブコンテンツ、ナビボタンが全て横並びになっている
・スマートフォンサイズになると見やすいように縦並びになっており、ナビボタンがスクロールすると固定ではなくトップに戻る矢印だけが固定されていて邪魔じゃない
・ファーストビューに新メニューの画像が大きく表示されているので新メニューに興味を持つ
*ポイント*
・パソコン、タブレットサイズだと画面を半分にわけて右側に商品の紹介で左側にyoutubeが流れるようになっている
・商品紹介は2種類のラーメンの味を選べ、商品が360度回転するようになっていてどんな商品なのか分かりやすい
・スマートフォンサイズになると右側だけが表示されるようになっている
・真ん中にナビボタンがあり、キャンペーンも分かりやすい
*ポイント*
・どの画面サイズになっても見やすい(レシポンシブ対応がしっかりしている)
・スマートフォンサイズになるとギャラリーの写真のサイズが大きくなり見やすい
・サイト全体の色合いもレトロを感じる色合いになっておりお店のイメージに合っている
*ポイント*
・ロゴがナビボタンの真ん中にあり、立体的になっている
・トップページ下部にある家の画像の煙突部分にだけアニメーションがかかっていて煙が出るようになっている