暮らす宿

暮らす宿

*ポイント*

・ボタンやナビゲーションボタンの背景画像がのれんのような生地になっていてこのサイトのイメージに合っている

・各地からのアクセスや町内からのアクセスが詳しく説明されていて分かりやすい

・サイト全体が和色で統一されている

大泉自動車教習所

大泉自動車教習所

*ポイント*

・ファーストビューがグリッドレイアウトになっているが、画像と画像の余白が道路になっており車が走っているアニメーションになっていてPOPな印象を持つ

・全体的に青系統で統一されている

・グリッドレイアウトになっている画像が料金プランやキャンペーン情報のページにリンクされているのでこのサイトを見に来た人が一番知りたい情報を考えて構成されている

アマノ食堂

アマノ食堂

*ポイント*

・ファーストビューのヘッダーが屋根の背景画像が屋根のようになっており、スクロールするとナビゲーションボタンが画面上で固定され、のれんのようになっている

・ファーストビューの各コンテンツの紹介が一つ一つ形が異なっていて手書き風になっておりオシャレ

・トップページをスクロールして上下真ん中ぐらいの位置にアマノ食堂がある街並みのようなイラストが表示されており、人や犬だけが歩いているようなアニメーションになっている

・スマートフォンサイズになるとアニメーション等はないが、コンテンツ紹介も一列になり見やすい

HOTEL ANTEROOM KYOTO

HOTEL ANTEROOM KYOTO

*ポイント*

・borderで各コンテンツが分けられていて見やすい

・画面右側の予約するコンテンツとInstagramのリンクが他のページにいっても固定されている

・スマートフォンサイズになると1カラムレイアウトになっているのでスマートフォンでも見やすいデザインになっている

ワンツーレッスン

ワンツーレッスン

*ポイント*

・各コンテンツが画面いっぱいのサイズになっているのでどのサイズの画面でも分かりやすい

・SNSアイコンをhoverするとただ色が変わるだけではなく、他の色のアイコンが下から表示されてhoverしてない状態のアイコンが上に消えるようなアニメーションになっている

bar hotel箱根香山

bar hotel箱根香山

*ポイント*

・barのようなホテルというコンセプトなのでサイト自体も暗めの色を使用しており、ファーストビューの動画もあり高級感が漂っている

・スクロールするとコンテンツの画像が滝のように現れるアニメーションになっている

・予約するボタンが画面の下で固定されている