サイト内検索/
プロジェクト — 02 / 05

Verticité

ジュネーブの建築事務所のサイト。プロジェクトを整理し、語らせる:モノクロ写真とカラーのレンダリングで。アワードAwwwardsNominee2023

期間2023所在ジュネーブ
役割築く公開verticite.ch
仕事インターフェース・開発
納品サイト、サイトのアートディレクション

Verticité Architecture(VJA)は2020⁠年、Knight Frank Switzerlandから生まれました。ジュネーブを拠点に建築とインテリアを手がけます。サイトに求められたのは、注釈を加えずに仕事を見せること。写真はモノクロ、レンダリングはカラー、文章は検証できることだけに絞りました。

プロジェクトを画像で ↓
築く · 01

導入

名前だけが画面を占め、スクロールとともに左へ抜けます。代わりに現れるのは、雰囲気写真ではなく現場です。

ビジュアルライトモードのトップ画面。ロゴタイプは2⁠行組み、VとAが大文字、以降は小文字:同じ字形がマークと見出しを兼ねます。
ビジュアル同じ画面のダークモード。地色が深いバーガンディに変わるだけで、グリッドもウェイトも動きません。
ビジュアルスクロールすると見出しが左へ抜け、現場写真が入れ替わります。サイト内の写真はすべてモノクロで統一されています。
ビジュアル俯瞰と最初のテキストブロック。事務所は何をするかより先に、どこから来たかを述べます。
築く · 02

事務所

事務所の出自と、誰が何に責任を持つか。チームは組織図ではなく、ポートレートで。

ビジュアルクリーム地に置かれた事務所紹介。2020⁠年にKnight Frank Switzerlandから独立、建築とインテリア、人を中心に据える設計。それだけです。
ビジュアルモノクロで広く切り取られた竣工作品。この画面に説明はありません:プロジェクトページで語られます。
ビジュアルダークモードの「About VJA」。バーガンディとスレートが地を分け合い、文字サイズはライトモードと同じです。
ビジュアルチーム。モノクロの肖像を同じベースライン、同じ縮尺で切り取る:それが全員を対等にします。
築く · 03

実績

ここで色が戻る。レンダリングはカラー、写真はモノクロのまま。

ビジュアルダークモードの実績一覧。下部のサムネイル帯が、画面を離れずに収録数の厚みを示します。
ビジュアル「Early years school」。ページはレンダリングで始まり、施主・所在・面積・年といった諸元は左の細い段に収まります。
ビジュアルダークモードの「Inclusive primary school」。レンダリングが有効幅いっぱいに広がり、地は額縁にならず後退します。
ビジュアル同じページの下部。左に本文、右にレンダリング。本文は与件(各生徒の必要に合わせたマスタープラン)を説明します。
築く · 04

ブランドを固定するもの

書体はひとつ、色は4⁠つ、そしてまずスマートフォンのために考えられたページ。

ビジュアル導線順に並べた5⁠つのスマートフォン画面。本文段は全幅になり、サムネイル帯は横スクロールに変わります。
ビジュアルタイポグラフィ版。サイト全体を1⁠書体で:Segoe UI、サンセリフ、ウェイトは2⁠つだけ。
版カラーボード。ダーク面はボルドー、ライト面はクリーム。残りはスレートとグレー。
バーガンディ
スレート
クリーム
グレー
Segoe UIサイト全体・2⁠ウェイト
Welcome to the Machine
クライアント専用 · アドレスはひとつ、パスワードはスペースごと
クライアント専用スペース↗espace.wttm.ch
WTTM Rue Jean-Gutenberg, 3bis, 1201 Genève InstagramBehanceAwwwards 法的事項・プライバシー・© 2026
サイト内検索検索/