INEX — Architecture Studio
A fast, image-forward website for an architecture studio, built with Next.js and PayloadCMS so the team publishes new work without a developer.
Case study
- Problem
- Inex Architecture Studio operated entirely on word-of-mouth and static PDF portfolios, lacking a digital footprint to establish credibility with high-ticket clients or showcase their massive, high-resolution architectural photography online.
- What I did
- I architected and developed a bespoke headless platform from the ground up, implementing fluid scroll-triggered animations and designing a custom CMS schema to empower the client's internal team.
- Context
- Prior to this project, the boutique firm had zero digital presence. They needed a brand-new digital home that matched the premium, immersive feel of their physical architecture. A standard template site would have struggled with their heavy visual assets, so the solution required a highly optimized, tailored approach to ensure instant load times and a clunky-free user experience.
- Decisions
- I chose a modern architecture integrating Payload CMS natively within the same Next.js instance. This provided all the robust content modeling benefits of a headless CMS without the overhead of managing a separate backend infrastructure. To mimic the spatial flow of physical architecture, I integrated Lenis for smooth scrolling and GSAP for complex, scroll-triggered animations. For backend autonomy, I designed a bespoke schema specifically tailored for architectural projects, and implemented Resend to handle highly deliverable lead capture.
- Outcome
- The new platform successfully established Inex as a premium digital brand, achieving a perfect 100 score on Google Lighthouse for Performance, Accessibility, and SEO. The immersive, cinema-quality site now acts as a powerful lead-generation tool, and the client's team is completely autonomous, easily publishing new projects through their custom dashboard without touching any code.
The Launch of Inex Architecture Studio's Digital Presence
Inex Architecture Studio creates stunning, forward-thinking physical spaces, but they lacked a digital footprint. We architected and developed a brand-new, highly immersive portfolio website from the ground up. By deeply integrating Payload CMS directly into a cinematic Next.js frontend experience, we delivered a blazing-fast digital platform that elegantly showcases their projects while giving their team intuitive control over their content.
The Challenge
Prior to this project, Inex Architecture Studio operated entirely on word-of-mouth referrals and static PDF portfolios. They needed a digital home that matched the premium, immersive feel of their physical architecture, but they were starting from zero. The lack of a website meant they had no online discoverability, making it difficult to establish credibility with high-ticket clients.
Furthermore, the studio needed to showcase massive, high-resolution architectural photography and blueprints. A standard template site would have choked on these assets, resulting in poor load times. Because they were establishing their online presence for the first time, the Inex team also needed a content management workflow that was intuitive and scalable.
Technical Strategy & Architecture
Starting with a blank canvas allowed us to implement the ideal modern tech stack. Instead of managing a separate backend, we integrated Payload CMS directly into the same Next.js instance. This unified architecture provided the deep content modeling capabilities of a headless CMS while drastically simplifying our infrastructure and deployment pipeline. It gave us maximum performance and design freedom without the typical decoupled overhead.
Frontend Engineering
We built the user interface using Next.js to leverage Server-Side Rendering (SSR) and React Server Components, guaranteeing instant load times for image-heavy pages. To elevate the visual experience, we integrated Lenis for buttery-smooth scrolling and GSAP for complex, scroll-triggered animations. As users scroll, high-res project imagery gracefully fades and slides into view, giving the site a premium, "award-winning" feel. We utilized Tailwind CSS to ensure all these complex layouts remained perfectly responsive across devices.
CMS Integration
To give Inex complete ownership of their new platform, we utilized Payload's powerful admin panel. We designed a custom schema from scratch, creating specific content types tailored to an architecture firm (blueprints, location tags, materials used). Payload provides Inex with a clean, intuitive dashboard right on the same domain where they can easily upload new photo galleries and publish case studies without writing a single line of code.
Results & Impact
The launch of the website transitioned the firm from zero online presence to a cutting-edge digital portfolio that accurately reflects the quality of their physical builds. We achieved a perfect 100 score on Google Lighthouse for Performance, Accessibility, and SEO—a rare feat for such an animation-heavy and image-rich website. The Inex team now effortlessly manages their own updates, successfully publishing their first three new projects via Payload CMS within a week of handover.