【サイトレビュー#47】デザイナーらしいこだわりが満載のデザイナー紹介サイト

その他

こんにちは！

Webデザインアワードで入賞しているWebサイトのご紹介第47回です。

今回も引き続き「CSS Design Awards」または「Awwwards」の中から特に目に留まったWebサイトをご紹介していきます！

ご紹介Webサイト「Madame Chantal Thomass」

https://www.madamechantalthomass.com/

今回ご紹介するWebサイトは、フランスのファッションデザイナー、シャンタルトーマスの紹介サイト「Madame Chantal Thomass」です。
こちらのWebサイトは、CSS Design AwardsとAwwwardsどちらも入賞しています。

▼CSS Design Awards掲載ページ
https://www.cssdesignawards.com/sites/madame-chantal-thomass/39276/

▼Awwwards掲載ページ
https://www.awwwards.com/sites/madame-chantal-thomass

各項目の得点を見てみると、UIデザインに関する項目が特に高く評価されています！

真似したいポイント

こだわりを感じるカーソルデザイン

通常は二重の丸、トップやメニューでコンテンツにホバーした時には唇の形、下層ページでコンテンツをホバーした時には目の形にカーソルが変わるようになっています。
カーソルデザインをいくつも取り入れ、細かい部分までこだわっているのは、さすがデザイナーさん！すごい！と思うと同時に、真似してみたいと思いました。

すごい！と思ったポイント

他では見ないアクセスからトップまでの動き

サイトにアクセスすると、まず黒い画面の中央に唇が縁取られたモチーフが置いてあるページが開かれます。
その時のカーソルは唇の形になっており、中央の縁取られたモチーフにカーソルを合わせてクリックをすることでトップページを開くことができるようになっています。
クリックをしないと入れないような仕掛けになっているサイトはあまり見たことがなく、すごいと感じました！

斬新な動きが入ったメニュー

メニューのコンテンツ部分をホバーすると、カーソルが唇の形に変わり、テキストの後ろに丸い形で動画が表示されます。
コンテンツをクリックすると丸い形だった動画が全画面に拡大され、読み込みが終わるとフェードアウトで消えて次のページに切り替わるようになっています。
こちらの部分も他ではあまり見たことのない見せ方で、面白いと思いました！
また、メニューの背景は常に動くようになっており、私たちも取り入れていきたいと思いました！