阿蘇くまもと空港

阿蘇くまもと空港

*ポイント*

・ヘッダーの背景画像が雲になっていて空港のサイトに合っている

・背景色や文字サイズを変えることができる

・ナビゲーションメニューの一番左が「空港サプライズ」というリンクになっており興味が沸くような項目が一番左にくるようにしている

・空港内の飲食店情報では各店舗が何の電子マネーを使用できるかロゴが貼ってあり分かりやすい

minico

minico

*ポイント*

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

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

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

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

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

*ポイント*

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

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

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

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

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

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

*ポイント*

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

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

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

そば処 庄司屋

そば処 庄司屋

*ポイント*

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

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

ぷんぷく堂

ぷんぷく堂

*ポイント*

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

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

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

やざわ虎クリニック

やざわ虎クリニック

*ポイント*

・ヘッダー画像のテキストに背景色があり見やすい

・ヘッダーのナビゲーションボタンやコンテンツの画像にhoverすると虎が覗くように現れ虎の上にメニューバーが表示される

・クリニックからのお知らせのところではボックス一つ一つの背景がノートのようになっておりノートの上に文字が記入されているように見える

・スマートフォンサイズになるとハンバーガーメニューになりクリックすると画面いっぱいにメニューバーが表示され、+を押すとそれぞれの細かいメニューに飛ぶことができる

照恩寺

照恩寺

*ポイント*

・ヘッダーのタイトルのテキストがメルヘンでオシャレに見える

・スクロールしても次のコンテンツは見れず、矢印をクリックしないと次のコンテンツが表示されないようになっている、矢印をクリックするとコンテンツが見れるだけではなく左下に四角■がたまっていく

・メニューバーをクリックすると画面全体がメニューバーになる

覚王寺

覚王寺

*ポイント*

・ヒーローヘッダーになっていて迫力があり、画像がアニメーションで切り替わる時音が響いているように切り替わっている

・スクロールするとコンテンツのテキストがアニメーションで表示されるようになっており、文字を書いているような表示をさせている

・スクロールすると右側に固定されている漢数字が今いるコンテンツの数字になる

marchily

marchily

*ポイント*

・body全体に犬の足跡が右下から左上に流れる背景になっている

・ファーストビューのnewsには一番最新の記事だけ載せ、+をクリックすると過去の内容も見れるようになっている

・スクロールするとコンテンツがアニメーションで表示される、アバター紹介のところでは様々なアバターが揺れるように右から左に流れていく

・サイト全体が写真よりイラストを使用しておりPOPな印象を持つ