Atrium - Executive Livework Landing Page Template

Quick summary

Atrium is a landing page template for developers who build live-work lofts, studio compounds, and mixed-use townhomes. It combines a Before/After Slider header with an alternating Gallery Walk layout to tell each project's story with clarity and style. The Executive Suite color system and resident quotes work together to move visitors from curiosity to booked tour.

Who this template is for

This template is designed for developers and property teams marketing spaces where living and working share the same address. It speaks directly to buyers and renters who value intentional, dual-purpose design.

• Live-work loft and studio compound developers presenting finished projects to creative professionals
• Mixed-use townhome teams targeting architects, agency founders, and tech entrepreneurs as buyers
• Property marketers who want a high-touch, editorial feel without a multi-page website build

What problem this template solves

Most real estate landing pages feel transactional. They list square footage and move on. Atrium solves the harder problem: helping a visitor picture their actual working life inside a specific space before they ever book a tour.

• Generic property pages fail to communicate the lifestyle value of a live-work unit to discerning, design-aware buyers
• Lead forms placed too early feel pushy; Atrium earns the click by letting resident voices do the persuading first
• Developers lack a visually distinctive page that matches the quality and ambition of the spaces they actually build

What you get with this template

Atrium is a complete, single-page layout ready to be customized with your own projects, photography, and copy. Every section has a clear role in moving the visitor toward a tour booking or floor plan download.

• A Before/After Slider header, zigzag project gallery, resident quote blocks, lead capture form, and gated floor plan download section
• An Executive Suite visual system with defined roles for each color: emerald black for backgrounds, ivory linen for text, malachite for dividers, and brass reserved for interactive elements
• A slim, fixed navigation bar carrying the primary call to action on every scroll position

Feature list

A paragraph overview of the feature set: Atrium packages its most impactful components into a focused, single-page flow. Each feature below is directly present in the template as described in the source brief.

Before/After Slider Header

The header opens with a split-view slider showing the same space before and after transformation. The left side shows a raw concrete shell with exposed ductwork and a dusty subfloor. The right side reveals the finished live-work unit at the same camera angle. A brass circle handle with an engraved arrow controls the reveal, and the headline "One space. Every ambition." fades in after the visitor's first drag.

Zigzag Gallery Walk Layout

Each completed project is presented as a curated exhibition piece. A large hero image sits on one side and the project story sits on the other, alternating left and right as the visitor scrolls. Every unit block includes a project name, square footage, and a resident quote about how the space changed their working life.

Fixed Brass-Accented Navigation Bar

A slim navigation bar stays visible throughout the entire scroll. It carries the primary call to action, "Tour a Live-Work Space," so the invitation to connect is always within reach without interrupting the editorial pace of the gallery below.

Three-Field Lead Capture Form

The lead form asks for three things in sequence: first name, email address, and a single dropdown asking "What do you do from home?" Dropdown options include "Run a studio," "See clients," "Build a team," and "Everything." This lightweight structure reduces friction while giving the developer useful context about each prospect.

Gated Floor Plan Download

A secondary conversion path offers a downloadable collection of floor plans. Access is gated behind email capture, giving visitors who are not yet ready to book a tour a lower-commitment way to stay engaged with the project portfolio.

Resident Quote Blocks

Each zigzag section features a single resident quote placed alongside the project photography. These first-person voices ground each space in a lived experience. By the time a visitor reaches the lead form, they have already heard from multiple people whose working lives were shaped by the space.

Page sections overview

Design & branding system

Atrium uses an Executive Suite color system built from four deliberately assigned colors. The palette draws from a private members' club library sensibility, serious and warm at the same time.

• Deep emerald black (#0B2B26) dominates backgrounds; polished malachite (#1A5C47) anchors section dividers and secondary containers; warm ivory linen (#F5F0E8) carries body text and breathing space
• Brushed brass (#C9A84C) appears only on calls to action, the slider handle, the navigation bar accent, and hover states, reserving its warmth for every point where the visitor's hand is meant to go
• The overall visual register evokes a corner office with a kitchen island nearby: rich, grounded, and purposeful rather than decorative

Mobile & speed optimization

The template layout is structured for clean rendering across screen sizes. The alternating gallery sections and slider header are designed to adapt gracefully as viewport width changes.

• The zigzag gallery collapses into a stacked single-column layout on smaller screens, keeping project images and resident quotes readable without horizontal scrolling
• The fixed navigation bar remains accessible on mobile, so the primary call to action stays reachable at every scroll position
• The three-field lead form and gated floor plan section maintain their compact structure on smaller screens, reducing tap friction for mobile visitors

How this template helps you convert

Atrium is built around a specific conversion logic: earn trust through resident storytelling, then present a low-friction path to act. This sequence is visible in the layout from top to bottom.

1. The Before/After Slider creates an immediate emotional hook by showing the full transformation potential of a raw space, anchoring the visitor's imagination before any copy asks them to do anything.
2. The Gallery Walk builds accumulated desire across multiple projects, with resident quotes reinforcing social proof at every alternating section before the lead form appears.
3. The dual conversion paths, a tour booking form and a gated floor plan download, give visitors two different ways to move forward depending on where they are in their decision process.

Other information about this template

Atrium is a strong fit for the live-work and artist loft rental market, where buyers make emotionally driven decisions backed by practical space requirements. The template's editorial pace and gallery-style storytelling match the expectations of a design-aware audience.

• The template style is Zigzag/Alternating, the header concept is a Before/After Slider, and the creative direction is a Gallery Walk, all of which are built into the layout as described
• The page is designed for the Real Estate and Property category, specifically for space and rental platforms targeting the artist loft and studio rental niche
• The template supports a developer narrative that builds from intimate studios to ambitious compound conversions, reflecting the scroll pace described in the brief

Show more