マンションデータベースを"ど"わかりやすく

がんばるマーキュリー 薩摩だワン
6896

マンションに関わることを"ど"わかりやすく紹介

ビジネスハック

2018.6.19

【マンション】最新でかっこいいデザインの物件サイトまとめ

物件紹介のアイキャッチ

こんにちは!最近仕事で物件サイトを作っているタマです。
 
私が物件サイトを作るときは、いろんな物件サイトを見て参考にしています。
色々見ているからこそ思ってしまうのですが…
似たような物件サイトが多いな〜( ゚д゚)ポカーン
 
みなさんもそう思いませんか??
 
私がそう思った理由は、物件サイトのレイアウトがどのサイトを見ても一緒じゃないか!と思ったからです。
物件サイトの定番レイアウト
左上に物件名、右上に資料請求、来場予約ボタンが配置され、その下には「ロケーション」、「アクセス」などのリンクが貼られているグローバルナビが設置されています。
そして大きく主張するのがマンションや空撮などの物件サイトに関する画像。
それに加えて「駅徒歩何分」、「全戸南向き」などの訴求文言が大体決まって並んでいます。
 
この形がいわゆる物件サイトの定番レイアウトなんじゃないかな?と、私は思います!
大手デベロッパーの住友不動産さんや東急不動産さんの物件サイトも、この定番レイアウトに乗っ取って作られているので、一般的に見ても馴染みのあるものだと思います。
 
こんなありきたりな物件サイトが溢れる中、定番レイアウトを覆すようなかっこいい物件サイトもありました!
なので、今回は「これって物件サイトなの!?」と驚くくらいかっこいいサイトを、タマの独断と偏見で紹介していきたいと思います。
 
最初にご紹介するのは、元住吉にある物件サイトです。

パズルのように要素が並べられた物件サイト

ガーラレジデンス元住吉
東急東横線・目黒線「元住吉」駅の他、3駅4路線が利用可能な落ち着いた住宅エリアに建てられる予定のマンションです。
 
スマホで見ると全体的なレイアウトは四角いブロックが積まれている印象ですが、パソコンで見ると、画面の左側は動画が固定されて物件に関するイメージ動画が流れています。
スマホ時とは違い、パソコンではサイトの幅を変えると四角いブロックまでスムーズにサイズが変わっていきます。
 
パソコンのファーストビューでは、大半の訴求文言が出ているので、スクロールせずに物件の詳細が把握できる物件サイトは珍しいと思います!
 
そしてサイトコンテンツのありとあらゆる箇所でモチーフとして使われているタイルのように並んだ四角の柄が可愛いです。
カラフルなモチーフ
次は渋谷にある物件サイトです。

一見普通の物件サイトだけども


デュフレ渋谷本町
渋谷区だけど「新宿」から2km圏の、落ち着いた住宅エリアに建てられるマンションです。
 
スマホでは何の変哲も無い物件サイトに見えます。スマホ&パソコンで見た時のファーストビューは西新宿の高層ビル軍から渋谷方面まで写された空撮上に、デュフレ渋谷本町のマンションが建つ場所に光の柱が立っています。
 
パソコンで見ると、定番レイアウトのグローバルナビはスマホでお馴染みのハンバーガーメニューとして左側に集約されていますが、一見普通のマンションサイトに見えます。
 
ですが、下にスクロールしていくと、右から左にコンテンツがスライドで切り替わる動きになっていて、まるで紙芝居のように絵柄が変わっていきます。
本来、下にスクロールしていくと、下から上へとコンテンツが順次に見えてきますよね?
なのに、右から左にコンテンツがスライドで切り替わるという挙動が珍しく、一瞬どうやって動くものなんだろう?と考えてしまったくらいです。
 
おまけに、パソコンキーボードの「→」を押しても右から左にコンテンツがスライドで切り替わるようになっているので、こちらのサイトはキーボード操作のことも考えながら制作しているんだなと思いました。
 
最後は武蔵小杉にある物件サイトです。

まるで一つのドラマが出来上がりそうな物件サイト


コスギサードアベニュー
東急東横線「武蔵小杉」駅前に複合施設として建てられる予定のマンションです。
 
パソコンで見ても、スマホで見ても、もはやファーストビューを見ただけでは物件サイトかなんなのかわかりません!!
ファーストビューの下の方には「スクロール」の文字と、下へ向かって伸びる矢印が表示されています。これはスクロールするしかありませんね!
 
スマイルでいこう

権利権限関係に引っかかりそうなのでイラストで。Smileでいこう。


スクロールすると、コスギサードアベニューのロゴマークが大きくなるスクロールエフェクトがつけられており、スクロールしながらロゴマークが全画面の大きさになると、オシャレな住人と思われる方々とマンション完成予定外観CGが登場します。
オシャレ住人の中には何故だかチラホラ外国の方もいます。
 
もう外国人のモデル使っているだけでかっこいい…
 
さらにスクロールしていくと、キャッチコピーと共に動画が次々と流れていきます。
とにかくかっこいいのですが、全部キャプチャして紹介すると権利権限に引っかかり訴えられるかもしれないと思ったので、動画内容を絵にて紹介します。
ロスタイム知らず。
Quality of 朝。
森さんのたまご。
ほぼ自宅。
先輩直伝。
DJデビュー。
大空のある駅前。
動画についているキャッチコピーもよくわからない珍しいものばかりでかっこいい。
おじいさんがDJデビューしてしまうケースなんて、滅多にないことなんでとにかくかっこよすぎます。
 
物件サイトでスクロールなどの動作に応じて立体感や奥行きを演出するパララックス効果を使用したり、流れ(ストーリー)が感じられるような動画を盛り込むことによって、私たちに生活の利便性などを視覚的に訴えてきます!
 
最下部には動画で出演されていた住民のモデルが並んでいて、これまた珍しいものだなと思いました。
パソコンではマウスのカーソルの動きと連動して、住民のモデルが動きますが、スマホでは(iphone)、スマホを傾ける動作によって住民のモデルも連動して動きます。
 
最近では、こんな動きがあって住民のモデルを生かしたかっこいい物件サイトは、本当に珍しいケースだと思います。
 
TOPページで起用されているモデルさんの大半が外国の方で、あれ?ここって日本の武蔵小杉だっけ?と忘れてしまうくらい、外国人をたくさん起用することでスタイリッシュに演出しているのではないでしょうか。
私もこのマンションの一室を購入すれば、オシャレな住民の一員になれる筈です!!
 
別コンテンツとして一番下のページに盛り込まれている再開発事業のコンセプトと概要ページまで、スクロールしていくとイラストが流れるように出てくるパララックス効果を使って作られているのでとてもかっこいいです。
 
感想:何から何まで全てがかっこいい。
 

番外編:イラストがかっこいい物件サイト


メイツ深川住吉
東京メトロ半蔵門線「住吉」駅から徒歩7分の立地で建てられる予定の大規模マンションです。
 
冒頭で紹介したような定番のレイアウトですが、まずトップページのスライドで使用されているイラストが特徴的でオシャレです!!!
赤系と青系と白の色を使ってイラストは描かれています。
 
赤と青は、光・色の三原色の両方に含まれている基本的な色で、単独でも視覚に強い印象を与えることができます。
その両者を組み合わせることでいちだんと強い視覚効果を示すので、とにかく奇抜で印象に残る物件サイトだと思いました。
メイツ深川住吉のキャプチャ

この色使いでイラストを描くとなんでもかっこよく見えてしまうのは私だけでしょうか。


 

いかがでしたか?

今回私が紹介したかっこいい物件サイトは、大体が渋谷から西方面に建てられる予定のマンションでした。
建設予定のマンションが近隣に多いと、ありきたりな定番レイアウトの物件サイトではインパクトが足りず、主張しにくくなってくると思います。
だから、少しでも定番レイアウトと違うデザインにして、購入検討者の目に止まるようにしているのかもしれません。
 
広告費の予算やサイト制作の時間が足りない時や、サイト制作のレギュレーションがあって定番レイアウトになってしまう物件もあるかと思いますが、かっこよくて動きのあるデザインで作られた物件サイトが世に溢れるようになるといいな〜と思いました!
 

この記事をSNSでシェアする