ブログページ

etc.JOURNAL STANDARD

＊ポイント＊

・ファーストビューの画像がだんだん縮小していくアニメーションになっている

・スクロールすると各コンテンツの見出しのテキストの枠だけ最初に表示され徐々に中の色が黒く塗られるようになっている、見出しの下に最初にイラストだけ表示されそのあと背景画像が出てきてイラストと背景画像がうまく重なるようになっている

・ハンバーガーメニューをクリックすると画面いっぱいにメニュー一覧のページになる

・フードのページにいくとサイズの異なる画像が並んでいる

ウフフドーナチュ

＊ポイント＊

・アイコンや見出しが手書きのデザインになっている

・トップのキャラクターの画像をhoverするとウインクするようになっている

・他のページへ飛ぶリンクも楕円形だけど手書きで書いた風に見えるデザインでかわいらしい印象を持つ

・商品一つ一つの画像も同じ角度の画像なので統一感がある

SUASI

＊ポイント＊

・サイト全体がピンクで統一されており、背景にボーダー画像を使用しているので女子が好みそうなデザインになっている

・画面の枠にborderの設定をしており、角は丸くなっている

・スクロールすると白黒のイラストにカラーがはいる（スマートフォンサイズだと最初からカラーで表示されている）

minico

＊ポイント＊

・画面の半分でコンテンツを分けており右側はスクロールするといくつか商品が見れるようになっている

・紙と印刷が大好きな店主のお店ということもあり左側のメニューバがあるコンテンツ部分の背景が紙のようになっている、メニューバーからリンク先に飛ぶと各ページの背景も同じ背景になっている

・商品紹介の商品の画像をhoverすると影と位置を変えて少し浮き出るようなアニメーションで表示させている

北海道エコ・動物自然専門学校

＊ポイント＊

・動画のヒーローヘッダーになっており、どのようなことを行っている学校なのか一目で分かる

・ファーストビューではハンバーガーメニューになっているがスクロールすると左側にメニューが表示されるようになっている（スマートフォンサイズでは右上にハンバーガーメニューが固定されている）

・画像をhoverすると少し拡大になるアニメーションになっている（スマートフォンサイズになるとhoverの指定がなくなる）

・footerの上がグリッドレイアウトの画像一覧になっている

マーレマーレ デイリーマーケット

＊ポイント＊

・ヘッダー画像がお店の屋根になっていて立体的に見えるようにしている

・ファーストビューにある動画とグリッドレイアウトの画像がうまく合わさっていて統一感がある、またグリッドレイアウトの画像はhoverすると値段が表記さて分かりやすい

・コンテンツ画像の縁に手書き風の二重線で丸や四角で囲ってありPOP

そば処 庄司屋

＊ポイント＊

・シンプルなデザインだが、太い枠線で囲まれていて雑誌の記事を読んでいるように見える、レシポンシブになっても見やすい

・一番上に店舗と店舗の休業日が表示されていてこのお店に行きたくて検索した人には一番知りたい情報だと思うので分かりやすい

ぷんぷく堂

＊ポイント＊

・サイトの入り口のページでは夕日で鳥が一羽右から左に飛んでいったら自動的にスクロールされ家のドアをクリックすると中に入れるようになっている

・ヘッダーがイラストになっており、イラストの所々にリンクがありhoverするとリンクされた部分のイラストだけ動き他のページに飛べるようになっている

・ヘッダーの黒板がメニューバーになっており手書きのフォントで可愛い印象、スマートフォンサイズになると黒板に手書きのハンバーガーメニューが表示される