【2021年】デザインの参考にしたい素敵なWebサイト5選 #10

毎週私が見つけたデザインの参考にしたい素晴らしきWebサイトをまとめ、発信して行く予定です。
今週も魅力的なWebサイトは数多くありましが、その中から5つのサイトを厳選してお届けします。

個人的な感想も交えながらピックアップしていきますので、Webサイトの提案やデザインの実制作に役立ててください。

1. Mrs&Mr(クリエイティブエージェンシー)

ニューヨークのクリエイティブエージェンシーであるMrs&Mrの公式サイトです。

コーポレートメッセージでぎっしりと埋め尽くされたファーストビューから始まり、スクロールしていくとアニメーションが展開され、多くの制作実績が多様なカラーバリエーションやタイポグラフィなどで表現されていくユニークなデザインになっています。

カーソル位置に応じて追従してくる作品たちのアニメーションや、「meet mr.」というテキストを押すと、画面全体にコラージュ写真が出現する演出など、遊び心を随所に感じさせてくれます。

見ていて楽しいサイトなので、気になった方はぜひチェックしてみてください。

ビジュアル：⭐️⭐️⭐️⭐️⭐️ 
話題性　　：⭐️⭐️⭐️⭐️ 
最先端　　：⭐️⭐️⭐️⭐️

1976年創業のラルチザンパフュームが打ち出した「6つのオードパルファム(香水)」の公式ブランドサイトです。

幻想的なBGMと、ロンドンを拠点に活動するケイティ・スコットの描く繊細な水彩画のイラストが織りなすハーモニーが圧倒的な没入感を演出し、商品を際立たせています。

突出したトランジションやインタラクションがあるというわけではありませんが、なんと言ってもイラストの品質が高く、ゆらゆらとアニメーションする様は、見ているだけで心地よくなること間違いなしです。

ビジュアル：⭐️⭐️⭐️⭐️⭐️ 
話題性　　：⭐️⭐️⭐️⭐️
最先端　　：⭐️⭐️⭐️

渋谷区神南にあるコワーキングサロン「SLOTH」の公式サイトです。

ファーストビューではヒーローイメージにてスプリットスクリーンを採用し、同じ場所での別々のシーンやダイナミックなワンシーンを演出しており、お洒落な雰囲気がただよっています。

ミニマルデザインのためテキストは必要最低限に収まっており、フォントサイズも全体的に小さめで写真が際立つ繊細で大人の空間が演出されているのも良いですね。

渋谷での人混みに疲れた方が、ふらっと立ち寄る場所としてピッタリではないでしょうか。

ビジュアル：⭐️⭐️⭐️⭐️⭐️ 
話題性　　：⭐️⭐️⭐️⭐️⭐️ 
最先端　　：⭐️⭐️⭐️

「パーソナライズ×D2C」を基軸とした事業を展開しているSpartyのパーソナライズビューティケアサービスのブランドポータルサイトです。

ファーストコンタクトとして、パーソナルエージェントによる美容に関するお悩み診断が開始され、悩みに応じて「Hair」「Skin」「Inner」と3つのケアブランドへと遷移する構成となっています。

各種ブランドごとにも細かい悩みが可視化できる「パーソナル診断」があるので、美容意識の高い方にとっては先進的でありがたいサービスになっています。

サイト全体の雰囲気としては、ミニマルで繊細なタッチの中に、ダイナミックなタイポグラフィやフォトグラフが織り交ぜられ、随所にユーザーへ寄り添うメッセージが流れるなど、ユーザーファーストでパーソナライズを意識した作りになっているのが特徴的です。

ビジュアル：⭐️⭐️⭐️⭐️⭐️ 
話題性　　：⭐️⭐️⭐️⭐️
最先端　　：⭐️⭐️⭐️⭐️⭐️

マイリー・サイラスを起用し、アーティストのペトラ・コリンズが監督と撮影を手がけた#FloraFantasyキャンペーンの題材である「GUCCI FLORA(香水)」の公式ブランドサイトです。

日本アニメを思わせるポップなキャンディピンクの世界を旅するサイトとなっており、アニメーションもさることながら、随所に見られる仕掛けがとてもユニークで、マイリー・サイラスのキャンペーンPVも鑑賞できます。

さらにQRを読み込むとGUCCI FLORA(香水)がモチーフのプリクラを自分のスマホで撮影できる機能が搭載されており、その撮影方法が斬新なので、ぜひ試してみてほしいです。

ビジュアル：⭐️⭐️⭐️⭐️
話題性　　：⭐️⭐️⭐️⭐️⭐️ 
最先端　　：⭐️⭐️⭐️⭐️⭐️

リンク