Brand Sites
Halden & Co
Architecture practice brand site
A restrained brand site for a practice whose work should carry the page, with a project archive that grows without a redesign.
- Client
- Halden & Co
- Industry
- Architecture
- Category
- Brand Sites
- Year
- 2025
- Project archive the studio adds to unassisted
- Full-bleed imagery without a slow first load
- Launched on the date agreed at the audit
01Client goal
What they came to us with
Halden had a strong identity and a stronger portfolio, presented on a site that undercut both. The brief was restraint: let the drawings and photography carry the page, keep the interface almost invisible, and make adding a completed project a task the studio does itself in twenty minutes rather than a job that waits for an annual redesign.
02Scope
What we agreed to build
- 01Design-to-Webflow build from a supplied Figma file
- 02Project collection with flexible gallery layouts
- 03Practice, approach and contact pages
- 04Typography and grid system built to the design
03Delivery
What maztech delivered
The design, built exactly
The Figma file used a strict baseline grid and an unusual asymmetric column split. Both were rebuilt as real layout rules rather than approximated with margins, so the grid holds at every breakpoint instead of only at the width the design was drawn at.
Projects that vary without breaking
Each project chooses its own gallery rhythm from a small set of block types: full bleed, paired, offset and drawing. The studio composes a project page from those blocks, so no two read identically and none of them can produce a broken layout.
Typography as the interface
Two weights, a tight display scale and generous margins carry the hierarchy. There are almost no boxes, borders or buttons in the design, so spacing and type size do the work that decoration usually does.
Motion kept to almost nothing
Images fade in as they enter, the header thins on scroll and nothing else moves. On a practice site, restraint is the brand, and every animation considered was tested against whether it made the work easier to look at.
04CMS setup
How the content model was built
A single project collection with a flexible gallery, plus a small collection for practice news. Deliberately minimal, because the studio adds a handful of entries a year and every extra field is a decision they would have to make each time.
Projects
Collection- Fields
- Title, slug, location, year, status, client type, summary, description, cover image, gallery blocks, drawings, credits
- Why
- Gallery blocks let each project set its own rhythm while staying inside the grid.
Practice notes
Collection- Fields
- Title, slug, date, body, image
- Why
- Short studio updates. One field set, no categories, nothing to decide before publishing.
05Components
Components used
- Asymmetric project index
- Full-bleed figure block
- Paired image block with caption column
- Drawing block on a light ground
- Project metadata table
- Thin header that reduces on scroll
- Next project footer link
Each one is a named, reusable component in the project, not a one-off section. That is what lets the team add pages later without the design drifting.
06Performance
Performance notes
Heavy imagery, light pages
Photography is served responsively with per-slot crops and modern formats, and only the cover image is eager. A project page with twenty images loads its first screen in about the weight of a single unoptimised photograph.
Grid held by layout, not by scripts
The asymmetric grid is pure CSS. Nothing measures the viewport in JavaScript, so there is no reflow after paint and no dependency on a script running before the page looks right.
Print-considered
Project pages carry a print stylesheet, because practices still send project sheets to planning committees on paper.
07Gallery
Screens from the build
Clear weekly walkthroughs, no vanishing for two weeks, and an honest answer when something we asked for was a bad idea. The site launched on the date we agreed in the first call.
Next step
Want a build like this one?
Tell us about the project and we will come back with a scope, a timeline and a price, plus an honest note on anything we think should change.
Or reach us directly
Studio hours are 9am to 6pm across US and EU time zones, Monday to Friday.
