2024.07.23
AIにワイヤーフレームをつくってもらった！
- その他
WEB制作のあれこれがわかる！
WEB制作のあれこれがわかる！
こんにちは。
Webデザインアワードで入賞をしているWebサイトのご紹介第5回です！
「CSS Design Awards」または「Awwwards」の中から特に目に留まったWebサイトをご紹介していきます！
目次
今回ご紹介するのは、オーストラリアのインテリアデザイン会社「Polygon Design」さんのコーポレートサイトです。
アクセスしてみると、右と左にスクロールできるという案内が出ます。
左側は「Product」エリアになり、建築デザインの実績を見ることができます。
右側は「Design」エリアになり、デザインした家具・インテリアが配置してあり、商品として見ることができます。
▼CSS Design Awards掲載ページ
https://www.cssdesignawards.com/sites/polygon/38360/
▼Awwwards掲載ページ
https://www.awwwards.com/sites/polygon-design
このWebサイトを見て、真似したいと思ったポイントをご紹介します。
水平スクロールによって横長のWebサイトになっていますが、まるで本当の家を探索しているかのような感覚になります。
インテリア・空間デザイン業界では、Webでもできる限りリアルにイメージを伝えたいと思いますが、このデザインならバッチリ伝わりますね。
通常、「実際にインテリアを配置した参考画像」は、各商品ページに移動して、商品画像リストの中に載っていることが多いと思います。
しかし、トップページの3D空間にインテリア商品を配置することで、すぐにインテリアを置いた時のイメージをすることができますね。
また、商品名がリンクになっていて、クリックすることですぐに詳細ページにアクセスできるので、気になった商品をノンストレスで調べることができます。
ユーザーに親切なデザインで、コンバージョン率もアップしそうです！
続いて、ここはすごい！と思ったポイントをご紹介します。
スクロールする方向によって、配置してあるテキストやインテリアを指している線が流れていく方向が異なります。
こうした奥行きを感じさせるデザイン・工夫の1つ1つがリアルを感じる理由ですね。
スクロールした時の景色の移り変わりも、実際に走っている時の景色のようにリアルです。
インテリア商品の各リンクにホバーさせると、波動のような動きが起きます。
ホバーの動作でこの動きは斬新ですね！
インテリアデザインの魅力をダイレクトに感じるデザインのWebサイトでした。
水平スクロールのWebサイト制作の参考にどうぞ！
株式会社スピカデザイン
渋谷のWEB制作会社「スピカデザイン」の現役コーダー達が、WEB制作のヒントになるような情報をお届けします。
© 2020 spiqa design
https://spiqa.design/