見出し画像

90.アビルキャンプリゾート那須 #1日1サイトレビュー

【印象】
・可愛い、にぎやか、楽しい印象
【ファーストビュー】
・夜空をイメージし、ネイビーの背景色を使用
・写真を画面右側に表示し、切り替えの際に右から左下に流れるアニメーションを使用。写真は4枚とも夜に撮影している
・画面左側、写真に一部が被るようにキャッチコピーや説明文を表示。文章量は多めになっている
・背面にロゴが横に流れるアニメーションを表示している
【コンテンツ】
・サイト内では施設内の写真以外にも親子で写った写真を使用。ターゲットは家族連れの旅行客と思われる。そのことから、サイト全体のあしらいが可愛らしく楽しい印象のものになっている
・キャッチコピーの「見渡す限りの星空」の通り、星マークを様々な箇所で使用している。ロゴだけでなく写真やアイコンの枠線、リストマーカーにも星を使用
・コンセプトの下に「RESERVATION」セクションを配置している。フッターの上にも同じセクションをもう一度配置し、ヘッダーにも予約ページへのボタンを表示している。予約への導線を複数作っている。セクションの境界線を波線にしており、柔らかいイメージを持った
・「FACILITY GUIDE」セクションの下に下層ページへのリンクをまとめて表示するセクションを配置。アイコンを星マークの枠で囲み、ホバーで右上から左に動くアニメーションをつけている。流れ星をイメージしていると思われる
・コンセプトセクションの星の形に切り取った写真も表示の際に右上から左に流れるアニメーションを使用。ボタンに配置された星アイコンもホバーで同様の動きをする
・「INSTAGRAM」は写真を右から左に自動でスクロールしている
・ハンバーガーメニュー(2本線、「MENU」表記あり)を使用。クリックするとメニューが画面いっぱいに開く。背景色は白。右側にメニューリスト、左側に写真を表示している。写真の前面にロゴと電話番号、予約ページへのボタンを配置。メニュー部分にはFVにもあったロゴが流れるアニメーションを表示している
・ヘッダー、フッターメニュー共にリンクは日本語表記。セクションタイトルは日本語と英語両方で表記している
【カラー】
・白、灰色、ネイビー、黒
・テキストカラーは黒#000000、一部に灰色#777777を使用
【フォント】
・Sawarabi Gothic
・英字見出しにLato
【レスポンシブ】
・FVでは写真を左上に表示している
・メニュー画面は写真部分を縮小。電話番号や予約ボタンはメニューリストの下に移動している
・コンセプト文は中央揃えから左揃えに変更