Backyard is a gallery-and-detail landing page built for real estate agents who specialize in selling accessory dwelling units (ADUs). It uses a case-study narrative structure, an inline valuation form, and a deep charcoal-and-amber visual identity to help homeowners understand their ADU's true market value and take the next step toward listing it.
by Rocket studio
Loading preview…
Quick summary
Backyard is a focused landing page for ADU listing specialists. It walks homeowners through real sale case studies, shows how dedicated marketing outperforms generalist pricing, and closes with a three-step inline valuation form. The design uses a charcoal and amber palette to signal restrained expertise, making the value of a separate ADU sale feel obvious.
Who this template is for
This template is built for real estate agents and teams who represent homeowners with detached studios, converted garages, basement units, or purpose-built casitas. It targets practitioners who sell ADUs as standalone assets rather than folding them into a main home's comparable sales sheet.
Agents building a niche practice around accessory dwelling unit sales
Real estate professionals who want to attract permitted ADU owners actively seeking a specialist
Listing agents positioning against generalists who undervalue secondary units
What problem this template solves
Most ADU owners get lowballed. Their unit is worth $180,000 to $450,000 as a separate asset, yet a generalist agent typically lumps it into the primary home's pricing without a dedicated listing, a separate virtual tour, or access to an ADU-specific buyer pool. The result is tens of thousands of dollars left on the table.
Homeowners lack a clear way to find an agent who understands ADU-specific pricing strategy
Generalist marketing makes a finished ADU look like an add-on rather than a standalone home
Sellers have no benchmark to understand what dedicated ADU representation actually delivers
What you get with this template
You get a single-page layout structured around escalating real-sale case studies. Each case opens with a thumbnail gallery, expands into a detail panel, and closes with a sold price versus original comp estimate comparison. The page builds credibility incrementally and guides the visitor toward a multi-step valuation form.
Full-bleed golden-hour header with a single fade-in headline over the lower third
Three escalating case study sections covering a garage conversion, a detached studio, and a two-unit lot split
Theme
Pastoral Calm
Creative direction
Before/After Reveal
Color system
Cloud Canvas
Style
Zigzag/Alternating
Direction
Click-Through
Page Sections
Case Study Narrative Scroll
Amber Sale-price Figures
Three-step Inline Valuation Form
Pull-quote Charcoal Bands
Persistent Bottom Bar
Full-bleed Golden-hour Header
Related questions
Who is this landing page template designed for?
What does the three-step inline form collect?
Can the case study sections be updated with my own sales?
Does the template include the header photography?
Is this template suitable if I only have one or two ADU sales to show?
A three-step inline form capturing ADU type, permit status, and seller contact details
Feature list
A brief paragraph describes the key capabilities of this template. Each feature below is drawn directly from the design brief and page structure.
Case Study Narrative Scroll
Each scroll section tells the story of one real ADU sale. It opens with a thumbnail gallery showing exterior, interior, and aerial lot views, then expands into a detail panel covering the homeowner's situation, the pricing strategy, and the final sold price set against the original comp estimate.
Amber Sale-Price Display
Key figures are large, set in liquid amber (#D4920B), and impossible to miss as a reader scrolls. This treatment applies to sold prices, comp estimates, and the dollar difference between them, making the financial argument visually self-evident without requiring extra copy.
Three-Step Inline Valuation Form
The primary call to action opens a three-step form without leaving the page. Step one captures ADU type and square footage. Step two asks about permit status, separate entrance, and rental status. Step three collects address, name, and preferred contact method.
Pull-Quote Charcoal Bands
Between case studies, a full-width charcoal band displays a single sentence from the seller. This grounds the data in a human voice and gives the eye a deliberate pause before the next case escalates.
Persistent Bottom Bar Call to Action
After the second case study, a sticky bottom bar keeps the primary call to action visible at all times. This ensures the "Get Your ADU Valued" prompt stays accessible even as the visitor scrolls deeper into the content.
Full-Bleed Header Composition
The header image is shot from the threshold of a finished ADU's French doors looking outward into a manicured backyard at golden hour. Warm oak flooring, a lemon tree, and the soft-focused roofline of the main house communicate that this is a real home, not an afterthought.
Page sections overview
Section
Purpose
Full-bleed header
Sets scene and introduces the core value message
First case study
Garage conversion with gallery, detail panel, and sold price
First call to action placement
"Get Your ADU Valued" button after the first case
Seller pull quote
Human voice break between first and second case
Second case study
Detached studio with escalated sale figures
Persistent bottom bar
Sticky call to action activated after the second case study
Second pull quote
Grounds the data before the final case
Third case study
Two-unit lot split as the highest-stakes example
Three-step inline form
Valuation request capturing ADU details and contact
Design & branding system
The visual identity follows an Executive Suite theme. Deep architectural charcoal (#2B2D2F) anchors the primary backgrounds. Warm brushed slate (#4A4A4D) surfaces card areas and detail panels. Liquid amber (#D4920B) appears only where the eye needs to land: buttons, sale-price figures, and the thin rule beneath each case study headline. Soft linen white (#F5F0E8) handles body text and open breathing space.
Typography and spacing give the layout a restrained, high-trust feel consistent with premium real estate presentation
Amber is used sparingly, which amplifies its effect on each call to action and key financial figure
The overall palette reads like a cashmere blazer draped over a mid-century chair: quietly authoritative
Mobile & speed optimization
The layout is structured as a single-page vertical scroll, which adapts naturally to mobile viewports. Case study galleries and detail panels are organized so content stacks cleanly without losing hierarchy. The persistent bottom bar is particularly effective on mobile, where it keeps the valuation prompt visible throughout the session.
Thumbnail galleries in each case study section are sized for clear viewing on smaller screens
The three-step inline form is broken into discrete steps, which reduces visual overload on mobile displays
The charcoal and linen-white color contrast supports comfortable reading across screen sizes
How this template helps you convert
The page earns its clicks through accumulated evidence rather than a single pitch. By the time a visitor reaches the inline form, they have seen three sellers who left $60,000 to $140,000 on the table with generalist agents. The form feels like the obvious next move rather than a speculative request.
The case study narrative builds credibility progressively, with each sale more complex and valuable than the last, making the agent's range clear before any ask is made.
The call to action placement is deliberate: one button after the first case study, a persistent bar after the second, and the full inline form after the third, so commitment is earned in stages.
Other information about this template
This template is designed specifically for the accessory dwelling unit real estate niche. It serves agents who want a dedicated marketing asset separate from their main brokerage website. The page works as a standalone lead-generation tool for homeowners with permitted ADUs seeking a specialist valuation.
The template supports three ADU property types in the form: converted garage, detached new-build, and basement unit, with an open "other" option
The case study structure can be adapted to reflect the agent's own closed sales as their portfolio grows
The Backyard template is well suited to markets where ADU legislation has expanded supply and created a distinct buyer pool that generalist agents are not equipped to reach
