Atelier Grain.
Warm architectural portfolio with full-bleed mask reveals, three typographic voices, and a quiet luxury pace.
A contemporary architecture studio's portfolio. Restraint is the brand — the architecture has to speak, the site has to hold space. Every design decision filtered through a single question: does this compete with the photography?
Brand direction, art direction, and implementation. Photography direction in collaboration with the studio's archivist.
- 01. Brand direction
- 02. Art direction
- 03. Motion design
- 04. Implementation
Research
Studied Swiss architectural monographs, print-first publishing from ABC Architecture and 2G. Restraint over ornament, always.
Typography
Three voices. Serif display for project names. Grotesque body for briefs. Monospace for project metadata. All three quiet — none competing with the imagery.
Motion language
Full-bleed clip-path mask reveals on architectural photography. Everything fades up with generous power-easing — no sharp transitions, no performative pinned hero scene. The work is the moment.
Build
Next.js + GSAP + Lenis. Images optimized via next/image AVIF. LCP under 1.8s on 4G. Accessibility treated as a design constraint, not an afterthought.
Homepage
A single photograph and project name. The work introduces itself before any navigation surfaces. Restraint as greeting.
Projects grid
Hybrid grid + list layout. Study phase uses grid view; deep-reading switches to list. Toggle is a single mono-typed button.
Project detail
Chapters of architectural photography with minimal captions. Typographic dividers between design phases — research, concept, construction.
About
Long-form studio philosophy with a print-serial feel. Pull-quotes, running heads, page-number glyphs in the margins.
Contact
A single line, a single form field. Restraint carried through to the last interaction — the closing note of the visit.
Warm editorial restraint — architectural photography let to speak for itself, typography in service of the work. A portfolio that feels more like a quarterly journal than a website.
Studio Noctis
→Brand · Skincare