Chercher une page/
Projets — 02 / 05

Verticité

Le site d’un cabinet d’architecture genevois : ses projets mis en ordre et laissés parler : photographies en noir et blanc, rendus en couleur.DistinctionAwwwardsNominee2023

Période2023LieuGenève
RôleConstruitEn ligneverticite.ch
MétiersInterface · Développement
LivréSite, direction artistique du site

Verticité Architecture — VJA — est né de Knight Frank Switzerland en 2020. Le cabinet travaille l’architecture et l’architecture d’intérieur depuis Genève. Le site devait montrer les projets sans les commenter : les images en noir et blanc, les rendus en couleur, et le texte réduit à ce qui se vérifie.

Le projet, en images ↓
Construit · 01

L’ouverture

Le nom tient l’écran seul, puis sort par la gauche quand on descend. Ce qui le remplace est un chantier, pas une photographie d’ambiance.

VisuelL’accueil en face claire. Le logotype est composé sur deux lignes, le V et le A en capitales, le reste en bas de casse : la même lettre sert de marque et de titre.
VisuelLe même écran en face sombre. Le fond passe au bordeaux profond ; rien d’autre ne bouge, ni la grille ni la graisse.
VisuelAu défilement, le titre sort par la gauche et une photographie de chantier prend sa place. Le noir et blanc est tenu sur toute la photographie du site.
VisuelVue aérienne et premier bloc de texte. Le cabinet dit d’où il vient avant de dire ce qu’il fait.
Construit · 02

Le cabinet

D’où vient le cabinet, et qui répond de quoi. L’équipe est montrée en portraits, pas en organigramme.

VisuelLe texte du cabinet, seul sur fond crème : né de Knight Frank Switzerland en 2020, architecture et architecture d’intérieur, l’usager au centre. Rien de plus.
VisuelUne réalisation cadrée large, en noir et blanc. La photographie ne porte aucune légende sur cet écran : elle attend la fiche projet.
Visuel« About VJA » en face sombre. Le bordeaux et l’ardoise se partagent le fond ; le texte reste au même corps qu’en face claire.
VisuelL’équipe. Portraits en noir et blanc, alignés sur la même ligne de base, cadrés à la même échelle : c’est ce qui les met à égalité.
Construit · 03

Les réalisations

C’est là que la couleur revient : les rendus sont en couleur, les photographies restent en noir et blanc.

VisuelL’index des réalisations, face sombre. La bande de vignettes en bas donne la profondeur du portfolio sans faire quitter l’écran.
Visuel« Early years school ». La fiche ouvre sur le rendu ; les données du projet : maître d’ouvrage, lieu, surface, année, tiennent dans une colonne étroite à gauche.
Visuel« Inclusive primary school » en face sombre. Le rendu occupe la largeur utile ; le fond ne l’encadre pas, il s’efface.
VisuelLa même fiche, plus bas : le texte long à gauche, le rendu à droite. Le texte explique le programme : un plan-cadre adapté aux besoins de chaque élève.
Construit · 04

Ce qui fixe la marque

Une seule police, quatre couleurs, et des pages pensées d’abord pour le téléphone.

VisuelCinq écrans de téléphone, dans l’ordre du parcours. La colonne de texte passe en pleine largeur et la bande de vignettes devient un défilement horizontal.
VisuelLa planche typographique. Une seule famille tient le site : Segoe UI, sans-serif, en deux graisses seulement.
PlancheLa planche de couleurs. Le bordeaux pour la face sombre, le crème pour la claire ; l’ardoise et le gris font le reste.
le bordeaux
l’ardoise
le crème
le gris
Segoe UItout le site · deux graisses
Welcome to the Machine
Accès clients · une adresse, un mot de passe par espace
Votre espace client↗espace.wttm.ch
WTTM Rue Jean-Gutenberg, 3bis, 1201 Genève InstagramBehanceAwwwards Mentions · Confidentialité · © 2026
Chercher une pageChercher/