Project Overview
FORMA is an internal H Product Studio concept build — a structural study for an architecture-studio site, not client work, and not associated with any real practice of that name. Brand, photography and visuals are illustrative.
The fictional studio behind it is imagined as an international design practice spanning residential architecture, boutique hospitality, cultural buildings and urban planning.
The build answers one question: what content architecture lets a practice like that grow internationally and get found organically? The working scenario assumes a portfolio of roughly 127 projects across 23 countries and designs the structure to carry it.
Scenario Framing
The scenario borrows the pain points we see in most mid-to-large design practices' websites.
Fragmented portfolio structure
Projects pile up over the years until nobody can navigate them, and each one loses its story.
No editorial content architecture
Research and insight exist in the practice — but there is no publishing system to turn them into essays, articles and guides.
Limited SEO visibility
In the starting state, searches around luxury villas, hospitality architecture or tropical design surface competitors instead.
International audience
The platform has to read as credible to clients on three continents, not just the home market.
The Concept Direction
The answer is a three-layer platform where portfolio, editorial and search-focused expertise pages reinforce each other.
Portfolio Layer
Structured project pages spanning regions and building typologies.
Editorial Layer
A journal carrying essays, field notes and studio thinking.
Expertise Layer
Search-led pages owning topics like luxury villas, hospitality architecture and tropical design.
Platform Architecture
The prototype is assembled in Next.js and TypeScript on modular components, with an editorial architecture pattern designed to scale.
- Component-based UI architecture
- Centralized design tokens system
- Dynamic content routing for projects and articles
- Scalable SEO page structure
- Performance-optimized media loading
In practice the study resolves into roughly 20 reference routes covering portfolio navigation, editorial publishing and specialized landing pages.
Information Architecture
The structure is built to do two jobs at once: help visitors discover, and give each project room to tell its story.
Core Pages
- Home
- Work
- All Projects
- Services
- Studio
- Contact
SEO Expertise Pages
- Architecture
- Luxury Villas
- Hospitality Architecture
- Tropical Architecture
- Landscape Design
- Materials & Craft
- Sustainability
- Interiors
- Urban Planning
- Architecture & Investment
Reference Editorial-Publishing Architecture
- Blog / Journal
- Case Studies
- Guides
Design Approach
The visual direction explores a dark editorial language as a design hypothesis.
- Large editorial typography
- Minimal grid layouts
- Dark hero sections with light reading surfaces
- Subtle motion and parallax
- Restrained accent color usage
Headlines run in Space Grotesk, body text in Figtree, with sparing green accents against a neutral palette. The type and color choices belong to the study — they are not a fixed brand system.
UX Decisions
Adaptive navigation
The nav adapts to dark hero imagery so it stays readable on any project photograph.
Editorial reading flow
Long-form pieces get deliberate structure — depth for readers who stay, orientation for those who skim.
Portfolio exploration
Browsing runs along region, typology and year, so 127 projects stay explorable rather than overwhelming.
Study Outcomes
Being a concept build, the output is a structural artifact rather than measured client results.
- A hypothetical ~127-project portfolio resolved into a navigable structure
- About 20 reference routes across portfolio, expertise and editorial publishing
- A sketched publishing infrastructure for essays, guides and insights
- A positioning framework that works across Europe, the Middle East and Asia
Prototype stack used to assemble this study
- Next.js
- TypeScript
- Component-based UI architecture
- Centralized design tokens system
- SEO-optimized routing
- Performance-optimized media delivery
Why This Matters
Premium and hospitality-focused studios rarely get all three — portfolio depth, editorial substance, search visibility — from one platform. This build is a structural study of how to, not a record of a delivered engagement.
- A framework for international client acquisition
- Editorial authority in hospitality and villa architecture
- Long-term organic-discovery hypotheses
Interested in a similar build?
The patterns here — editorial publishing, structured portfolios, SEO-led content systems — are exactly what we build in real engagements for design studios, hospitality brands and premium property operators. This page itself remains a concept study.
Concept Visuals (illustrative)
