Skip to content

CasesArchitecture studioConcept build

Foss & Gray

Nine architects in Oslo who say the plot decides the building. Their homepage is their drawing set: every building on it appears first as a drawing traced from its own photograph, then a section line cuts the plate open and the photograph develops behind it.

What we build for architecture practices, and what it costs.

Sector
Architecture studio, Oslo
Signature
The drafted line · every building drawn, then cut open to its photograph
Conversion
Annex A, a title-block enquiry: the site, the budget, the brief
01

The brief

Foss & Gray are nine architects in Oslo. Houses, cabins and small public buildings: 43 of them since 2014, from Agder to Troms, none of them large. Their claim is five words long and it is the first thing on the page: the site designs the building.

It is easy to say on a slope, pointing at where the snow drifts, and hard to prove on a website, where every studio says something close to it. These visitors read drawings for a living and will judge the site the way they judge a building: by its junctions.

02

The idea

So the page is a drawing set: five sheets and an annex. Sheet 01 is a site section, 02 the studio's method, 03 the works, 04 one building through four stages, 05 the people, Annex A the enquiry, and the footer is the set's title block.

Behind it runs the page's own grid, hairlines on the twelve columns the layout uses, four on a phone, broken wherever a paragraph sits on it, the way a draughtsman breaks a line for text.

Every fact wears IBM Plex Mono at 11px: site, year, area, status, the bearing and month under each photograph, which has no scale to print. Timber marks where a decision lives: one word in the headline, the job still on the board, the nodes where leaders land.

03

The signature move

The drafted line, registered to the photograph. The hero opens as a site section of Birkelia Annex, a 41 m² cabin on four pins, inking in drawing order. Section line A–A draws down the sheet and the photograph floods in from the cut: the drawn crest carries on as the photographed crest, and four leaders pin their claims to real pixels.

Selected works does it three more times, under the reader's thumb. On a desktop the stage holds still for three sheets, each laid on the last. Vindsletta House appears first as a drawing: the far hills, the forest edge, the shore, the long roof parallel to its ground. A section line crosses the plate and the photograph develops behind a one-pixel sweep, so the drawn half and the photographed half meet at the cut; then the photograph takes the plate and the leaders draw to the ridge and the fjord. Fjellrev Cabin follows on its steel points, and Sørenga Harbour Sauna keeps its tide range of ± 0.4 m dimensioned on the water, paper-cased, over the photograph. On a phone each sheet plays once as it arrives.

The same pen draws the rest: a diagram for each of the studio's four instructions, a 1:5 section through a footing, the 4.8-metre table at 1:50 with nine chairs numbered in the order the nine joined, and register bars that set a 28 m² shelter beside a 410 m² hall at their real ratio.

If it is a fact, it is mono.

04

Why it converts

Architecture sites fail in one predictable way: a slideshow of hero shots, project names with a year attached, a paragraph about light that would sit on four hundred other sites, and nothing to show that a person made a decision.

This page shows the decisions and where they are: the roofline follows the ridge, the footings went in without blasting, and each claim ends on the pixel it describes. The numbers are plain: 187 m², 64 m², 92 m², eight or ten projects a year for nine people.

Then Annex A asks what the studio would ask first, laid out as a drawing's title block: project type, site, a budget scale bar in MNOK, a start on a datum, the brief. The first meeting is a walk on the plot with no fee, and every link on the page leads to that one form.

05

How it is built

React, GSAP and ScrollTrigger, in the repo, running. Each drawing sits in an SVG whose viewBox is its photograph's own size (1672 by 941, 1536 by 1024, 1024 by 1536), so one drawn unit is one pixel and the seam at the cut is true by construction.

The hero's cabin and the three works were traced by a script: per-column transitions for grounds and skylines, connected dark regions for roofs and volumes, fitted lines for the edges. Only its output ships, and a test holds each drawing to edges measured in its photograph by a second method.

Each stroke follows its drawing's scale, so lines stay one pixel wide at any size. The headline is on screen with the first paint; a script that runs before paint holds back only the drawing and the photograph for the pen. With reduced motion or without JavaScript, the finished set is the page.

Foss & Gray is a fictional studio, invented so we could build the site it would need. The practice is not real. The build is: every plate, every annotation, every line of code.

Let’s make your digital work compound.

Choose a time on Gabriel’s calendar. We’ll go through where you are today, what’s slowing growth, and what’s worth doing first, whether or not we work together.

Gabriel Espinheira

Gabriel Espinheira

Senior software engineer · English or Portuguese

A focused 30 minutes, not a sales pitch.