森ビル株式会社 Corporate Website

Mori Building

Service

Branding

Output

Web

森ビル株式会社が約15年ぶりにブランドサイト全体をリニューアル。都市づくりに対する森ビルの思想や、その思想を具現化した「豊かな都市生活（ヒルズライフ）」を多角的に発信するコーポレートサイトへ刷新しました。 Fabrica.では、Webサイトの制作プロデュース、デザイン、実装を担当しました。

Date

2025.09

Fabrica. Role

Produce
Project Management
Tech Direction
Design
Engineering

森ビルの想い（Our Story）

「森ビルの想い（Our Story）」では、森ビルの都市づくりの思想や熱量を、6つのテーマに分け、実際の街（ヒルズ）に宿る森ビルの思想や、街を楽しむ人々の生き生きとした様子を、様々な写真や映像で表現しています。

ユーザーのスクロールに応じてコンテンツがシームレスに展開するスクロールテリング設計を採用。6つのテーマを通じて、森ビルの思想を体感的に理解できます。各テーマをイメージしたBGMも、テーマが切り替わりに合わせて自然に変化していきます。映像・コピー・BGMが連動するインタラクティブな実装にこだわりました。

HILLS LIFE

「ヒルズ」が提案する豊かな都市生活「ヒルズライフ」を、住む・働く・学ぶ・遊ぶ・交流する・憩うといった生活者の営みを起点に紹介するページです。ヒルズの多様な都市機能がシームレスに繋がり、融合する様子を「バブル」として表現し、営みが交差することで生まれる新しい価値や魅力を、インタラクティブに体感できます。

それぞれの営みを代表するヒルズの施設やイベントを写真で並べるのではなく、バブルで直感的に巡れるビジュアル導線に変換し、操作に応じて理解が深まるインタラクティブ体験として設計しました。6つの営みの関係性をたどりながら、ヒルズが目指す街の姿、そこから生まれる多様な豊かさを伝えています。

プロジェクト・企業情報コンテンツ

サイト全体として、グリッドベースで緻密にレイアウトを設計し、すべてのページで構造が破綻しないよう統一されたデザインとしています。さらに、複数のコンテンツモジュールを柔軟に組み合わせられる設計とすることで、情報の特性や内容に応じた最適なフォーマットでの表示を可能にしました。複雑な情報構成やボリュームのあるコンテンツに対しても、ユーザーが迷うことなく、直感的かつ快適に閲覧できる体験を実現しています。

ヘッドレスCMSとコンポーネント設計による大規模サイト構築

70種類超のカスタムフィールドによるコンポーネント設計で、見出し・画像・表・ボタンなどの部品をレイアウトパターンに配置していく方式を採用。書体・文字サイズ・余白・配色まで緻密に定義したデザイントークンと連動し、コンテンツの内容は自由に構成しながらも、アウトプットの品質が担保される仕組みを実現しています。ページの生成にはSSRとCDNキャッシュの組み合わせを採用し、CMS更新時には該当ページのキャッシュのみを自動で入れ替えることで即時反映を実現。サイト内検索はブラウザ上で完結する方式とし、CMS画像は自社ドメインからのプロキシ配信で外部障害時にも表示を継続できる構成としています。