Case Study
Trygve Studio
A refined, high-performance portfolio for an architecture and interior design studio — crafted with editorial elegance to showcase work cinematically and convert visitors into qualified inquiries.
Architectural vision deserves architectural presentation
Trygve Studio, led by architect Faisal Saif, creates residential, commercial, and interior design projects. Their architectural work is refined and thoughtful — but their online presence didn't match. The previous website couldn't do justice to their project photography or communicate the studio's design sensibility.
For architecture firms, the website IS the first project a client evaluates. A generic template portfolio signals "we use templates" — the opposite of what an architecture studio should project. Potential clients browsing for architects expect the website itself to demonstrate design capability.
They needed a portfolio that would let the work breathe: cinematic project showcases with editorial layout, fast-loading imagery that preserves photographic quality, and a clear inquiry flow that converts browsers into consultation requests.
Goals
- Elevate brand presence with refined, editorial portfolio design
- Showcase projects cinematically on any device with fast load times
- Drive qualified inquiries through clear CTAs and consultation flow
- Support content growth with scalable blog and project structure
- Improve time-on-page for deeper project engagement
Constraints
- Large, image-heavy layouts without compromising performance
- Consistent art direction across mixed project photography
- Navigation must scale as more case studies are added
- 4-6 week timeline for full design and development
Measurable impact after launch
Performance metrics comparing the new portfolio against the previous website.
What we built and why
Cinematic Project Showcases
Each project gets a full-width, image-first presentation with generous whitespace and considered typography. The layout lets architecture photography breathe — no cramped grids or competing elements. LQIP blur placeholders make images feel like they load instantly, even on slower connections.
Editorial Navigation
The navigation scales with the studio's growing body of work. Project categories, blog articles, career listings, and contact flow are accessible without overwhelming the interface. The dark ambient theme with subtle gradient accents positions the studio as contemporary and sophisticated.
Consultation-Focused Contact Flow
The contact page captures project type (residential, commercial, interior), budget range, timeline, and location — pre-qualifying inquiries before the studio responds. Placed after high-impact project showcases throughout the site, these CTAs convert engagement into consultation requests. +46% form submissions.
Content-Ready Architecture
Blog for thought leadership articles, careers page for studio culture and open positions, and a project grid that scales to 50+ entries. Content sections use consistent data structures so the studio team can add new content without structural changes.
Screens that tell the story
Why we chose each tool
Next.js + SSR
Server-rendered portfolio pages for architecture search queries. When potential clients search 'architecture firm [city]' or 'interior design studio,' they need to find Trygve Studio — SSR ensures every project page is indexed and ranks.
Next/Image Pipeline
Architecture photography is the product. Original images can be 8-15MB. Next/Image serves responsive widths with WebP/AVIF, LQIP blur placeholders for perceived instant loading, and priority loading for above-fold images. Maintains visual quality while keeping LCP at 1.9s.
Grid-First Layout System
Architecture portfolios need generous whitespace and typographic rhythm. The grid system with CSS gap controls spacing consistently, preventing the layout from feeling cluttered as the project count grows.
Semantic HTML + SEO
Proper heading hierarchy, alt text on project imagery, and structured data for the studio profile. Architecture clients searching for design services expect to find professional, well-structured websites — semantic HTML delivers both SEO and accessibility.
Performance Engineering
LQIP blur placeholders, critical CSS extraction, deferred non-essential JS, and responsive image sources. 1.9s LCP on 4G — fast enough that architects can pull up the portfolio during client meetings without waiting.
4-6 week portfolio build
Discovery & Art Direction
Week 1
Studied the studio's architectural work, defined visual language (editorial elegance with cinematic project presentation), and planned the content structure.
Design System
Week 2
Created the grid-first layout system with generous whitespace, typographic rhythm, dark ambient theme, and responsive image components.
Development
Week 3-4
Built Next.js frontend with LQIP image pipeline, project grid with filtering, blog section, careers page, and consultation-focused contact flow.
Optimization & Launch
Week 5-6
Performance optimization (critical CSS, lazy loading, responsive sources), SEO implementation, cross-device testing, and production deployment.
"As an architect, presentation is everything. GenForge designed a stunning portfolio site that reflects our vision and attracts the right clients. The website itself demonstrates the design quality we bring to our architectural work.
Questions about this project
Why does an architecture firm need a custom website instead of a template?+
How did you handle the image-heavy portfolio without killing performance?+
How does the contact flow drive qualified inquiries?+
How does the portfolio scale as the studio completes more projects?+
Can you build a similar portfolio website for our design studio?+
Similar projects
StrucAxis
Professional construction website built in 15 days with mobile-first design.
Fiable Building Solutions
Corporate platform with custom CMS and lead capture for civil engineering.
SA Associate
Trust-first CA firm website with 14 service verticals and lead automation.
Need a portfolio that matches your vision?
We build editorial portfolio websites for architecture, design, and creative studios.