#1日1サイトレビュー【035】MARRIOTT STYLE IN SEASON 文月さん
今日は面白いサイトを見つけました！
トップページの表示範囲はファーストビューの部分だけ、スクロールすると次のコンテンツがファーストビュー部分に表示されます✨
ごちゃごちゃとせずアニメーションも重くなくて見ていて気持ちが良かったです。
個人的にかなり好きなwebサイトでした✨PCもスマホもどちらも好き！
【概要】
ホテルレストラン＆バーのwebサイト
【ターゲット】
イベントや記念日等で良いレストランを利用したい方
接待で利用したい方
【目的】
高級感、ラグジュアリー感を知ってもらい、利用につなげる
【印象】
高級感、ラグジュアリー感
【メインビジュアル】
・画面いっぱいに動画が広がる。中央にホテルのロゴのMを大きく配置、透過しているので背景の動画も透けて見えている。左上にレストラン名、右上にメニューボタン、左下にホテルロゴ。背景の動画の明度を下げているので文字の白色の視認性が高まっている。
こちらの記事は、ラグジュアリーと明かりの関係について書かれていて、面白かったです✨”暗ければ暗いほど、高級とされるレストラン”！
webデザインにもこの知識は使えそうです✨
・マウスストーカーがあり、リンクの部分になると円が大きくなる。右上のメニューの円にカーソルを合わせると、マウスストーカーの円が吸い付くようなアニメーションになるのが面白い。何回も合わせたくなる。
【コンテンツ】
・scrollをクリックすると波打つ紺色の背景が左から現われ、ファーストビュー部分に次のコンテンツが表示される。
左側にレストラン名など文章、右側に料理の画像。背景は左側に波打つ画像、右側に明度を下げた料理の画像。手書き風の文字が置いてあり、多分この文字がなかったら文章と料理が不安定に思えるかも。
これはなんとなくの想像ですが、手書きの文字と右の料理の画像の下部分のラインを合わせてるので、全体で見てまとまりがでているのかな…？
・左側の文章にカーソルを合わせると文字が金色になる。高級感出すときの定番色。
・右下に01/09とコンテンツ数が表示されているので、まだ続きがあるということが分かる。左右端中央に前、後のコンテンツ名（レストラン名）が表示されていて、クリックすることでコンテンツを移動できる。
・MENUを押したときのレストラン名が表示されるときのアニメーションが優雅で好き。余裕を感じさせる。
【カラー】
ベースカラー：黒、ネイビー
アクセントカラー：金#a8a36d
文字：白、金
【フォント】
ほとんどセリフ体！ラグジュアリー感を出したいので、サンセリフ体はホテルの名前以外使ってないみたい。OrpheusProはセリフ体だけど太目な部分があるので視認性が良いなと思いました✨
レストラン名など英字：OrpheusPro
レストラン名日本語やテキスト：ShipporiMincho
これが噂のしっぽり明朝か…！ウェビナーを最近よく聞くのですが、このフォント好きなデザイナーさん多い印象です✨セリフ体で高級感がある！
右下数字：sainte colombe
【レスポンシブ】
・メインビジュアル まるでこのまま名刺のような…！文字が多めなのにごちゃごちゃしていない。グループ化や、文字の大きさでのコントラストをつけるってこういうことかあ…
・下にスワイプするとレストランのコンテンツへ移動。下にスワイプでも、横にスワイプでも次のコンテンツへ移動できるようになっている。
この記事が気に入ったらサポートをしてみませんか？