その他

2022.07.27

【勝手にWEBサイトレビュー #05】オーストラリアにあるインテリアデザイン会社のサイト

こんにちは。

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

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

ご紹介Webサイト「Polygon Design」

https://polygondesign.com.au/

今回ご紹介するのは、オーストラリアのインテリアデザイン会社「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サイト制作の参考にどうぞ!

この記事をシェアする

関連記事

  • 2024.03.22

    Webデザインにおけるアニメーションについて考えてみた〜実例編〜

    その他

  • 2024.03.12

    Webデザインにおけるアニメーションについて考えてみた〜メリット・デメリット編〜

    その他

  • 2023.12.30

    案件を切り替える拡張機能「Project Manager」が便利!

    その他

おすすめ記事

  • 2021.02.23

    CSSだけで三角形の装飾を作ってコンテンツの境界を区切る方法【コピペで簡単実装】

    その他

  • 2022.01.25

    HTMLでtableタグのセルを結合する方法

    その他

  • 2021.02.16

    【WordPress】カテゴリーやタグの一覧の表示方法まとめ【カスタムタクソノミーの場合も紹介】

    その他

TAG

×