積水ハウスの賃貸住宅「シャーメゾン」ブランド・物件検索サイト

Creative Direction

「シャーメゾンブランドを伝えるという機能」と「シャーメゾン物件を検索できる機能」をあわせもち過不足なく両立させるサイトへ

2024年7月頃に積水ハウス不動産ホールディングスさまよりシャーメゾンサイトリニューアルのご提案のご依頼がありました。まさか直接ご連絡が来るのかとも思えないほどの企業さんからの連絡でしたのでメンバーみんなで驚いていたのを今も覚えています。ご依頼から1ヶ月後の8月に125Pの資料と大量の動画とともにFigmaを利用してプレゼンテーションを行いました。ご提案を採択いただいて要件定義、情報設計、ワイヤーフレーム、デザインと進行していきました。

「シャーメゾンブランドを伝えるという機能」と「シャーメゾン物件を検索できる機能」をあわせもちどちらも過不足なく両立させるサイトを目指し、シャーメゾンの理解を促進し上質さを伝え、かつ物件の問い合わせ率や数を向上することを目的にリニューアルを行うプロジェクトでした。

不動産売買営業や賃貸仲介、ホテルやレンタルオフィスの事業会社での経験を活かし、物件検索や物件一覧、詳細などの設計やデザイン進行の基盤をつくり、メンバーと一丸となって大規模サイトのリニューアルデザインを行いました。

また、デザインはneccoに加え、フロントエンド実装やバックエンド実装はトランスコスモスさま、SEO対策の専門家としてデジタルアイデンティティさまと大規模なチームでプロジェクトを進行し約1年を経て完成しました。

「賃貸住宅にも、戸建てレベルの品質と住み心地。」をコンセプトに高品質な賃貸住宅のシャーメゾンがこれからもさらに多くの方に認知され、シャーメゾン住宅で快適な暮らしを実現する基盤をとなるウェブサイトを目指しました。

Direction & Contents Design

シャーメゾンの価値と魅力が伝わり、使いやすさにもこだわった約200ページのサイトリニューアル

今回のリニューアルでは、シャーメゾンの魅力と確かな価値を届けること、物件を探す人にとって使いやすく、行動につながるサイトにすること、そして、シャーメゾンを好きになってもらうことを目指しました。

お客さまと共に課題や理想を整理しながら、「シャーメゾンらしさをどう表現するか」「検索のしやすさ」「物件の魅力を最大限に伝えるには」を何度も話し合い、体験と利便性を両立する情報設計を丁寧に行いました。

トップページでは、実在する物件や記事・動画コンテンツを通じて“シャーメゾンでの暮らし”の魅力を伝え、検索導線では使いやすさを追求してUIを再設計しています。アイコンや物件の種類ごとに異なるテンプレートの工夫により、見ている物件の特徴が直感的に伝わるようにしています。

約200ページにわたる大規模なリニューアルでは、デザインと情報の整合性を保ちながら全体を統一し、「一般的な検索サイト」ではなく「シャーメゾンらしい体験」をつくることを一貫して意識しました。新しくなったサイトが、シャーメゾンの上質さや高い機能性をより多くの人に伝えるきっかけになればうれしいです。

Web Design

シャーメゾンの戸建品質の上質さや充実の機能性・利便性を体験できるデザイン

賃貸でありながら、充実した室内設備や高い性能をもつシャーメゾンシリーズ物件の、従来の賃貸とは異なる上質さや快適さが伝わるデザインを目指しました。
デザイン面では上質な物件のビジュアルを押し出し、機能面では物件を探しているユーザーがほしい情報にすぐアクセスできる見やすさや利便性を追求することで、デザインと機能の両軸からシャーメゾンらしさを体験できるデザインとしました。

物件ごとに異なる充実の機能・設備面の魅力をわかりやすく簡潔に伝えるために、オリジナルアイコンを作成。トップページや物件詳細ページで、シャーメゾンならではの機能・設備の魅力を伝える箇所を設けています。
また、各物件シリーズ（シャーメゾンプレミア、シャーメゾンセレクション、シャーメゾンZEH、シャーメゾンR）の詳細ページは、特徴に合わせてデザイントーンを変えることでサイト内の他物件との差別化を図りました。
物件詳細ページでは、サイドバーで写真・動画・間取り図などを選択することができ、あらゆる方向からユーザーが物件の特徴を理解できるようにしています。

UI Design

多様な条件から快適に検索できる操作性と、シャーメゾンらしさを両立したUI

多様な条件から希望の物件をすぐ探すことができる操作性と、直感的に理解しやすい画面設計を意識しました。
PCやスマートフォンなど利用環境に応じて、検索条件やボタン配置、物件の表示方法に変化をつけ、どのデバイスからでも快適に利用できるよう工夫しています。
また、情報量の多い物件でも比較・検討がしやすく、違いや魅力が伝わるように、情報の優先度を整理したりアイコンを用いた表現を取り入れました。
ユーザーが理想の物件をストレスなく探せる体験を提供できるようデザインしました。

Web Development

Rtoasterを活用した物件のレコメンドを、より魅力的に

各ページに表示されるおすすめ物件のレコメンドには、リニューアル以前から Rtoaster action+を利用しており、リニューアル後も同じ仕組みをそのまま活用されることになりました。
リニューアル前は、比較的、簡素なデザインとなっていましたが、機能面での制約も考慮に入れつつ、新しいデザインにフィットするように調整しました。
今回の実装にあたっては、積水ハウス不動産ホールディングスさまのパートナーであるトランスコスモス株式会社さまと連携をとり、進めました。

Client Voice

デザインでここまで変わるのかと、
期待値を大幅に超えました。

従前のお部屋探しサイトを「ブランド価値が伝わるお部屋探しサイト」にしたいという想いを叶えてくださいました。

デザインのみの依頼にも関わらず、公開後のコーディング課題も指摘・改善くださるなど、まさにプロジェクト完遂までのパートナーでいてくださったことが印象的で、非常に感謝しています。

ここがゴールではなくスタートとしてこれからもよろしくお願いいたします！

積水ハウス不動産ホールディングス株式会社
経営企画部
上遠野 智衿