Parterre - Architectural Landscaping Landing Page Template

Parterre is a gallery and detail landing page template built for architectural garden design and planting practices. It opens with a postcode-driven location header, unfolds a before/after project gallery with a draggable slider, and drives leads through a structured slide-in enquiry form. The charcoal and amber visual identity feels precise, grounded, and quietly authoritative.

by Rocket studio

Quick summary

Parterre is a single-page template designed for garden design and planting practices that work at the intersection of engineering and horticulture. It combines a location-aware header, a scrolling before/after project gallery, blueprint-style planting detail views, and a lead-capture form into one confident, visually layered experience.

Who this template is for

This template is built for design-led outdoor practices that need to show the depth of their work, not just pretty photographs. It suits studios that take on varied project scales and want their process to be as visible as their results.

  • Garden design and planting studios serving residential and estate clients
  • Landscape architects and contractors pitching to developers with tight install timelines
  • Outdoor design practices ready to qualify enquiries by project scale and intent

What problem this template solves

Most garden design websites show finished photographs and a contact form. They give no sense of transformation, no signal of technical expertise, and no way to filter enquiries by project size. Prospective clients land on the page and cannot tell whether this practice handles their scale of work.

  • Visitors cannot see the before state, so the transformation feels unearned
  • No location context means every visit feels generic, not personal
  • Lead forms collect names and email addresses without qualifying project scope

What you get with this template

Parterre replaces guesswork with specificity. From the first moment a visitor types their postcode, the page responds to them. Every scroll reveals a more complex project, building quiet confidence that this practice can handle anything.

  • A postcode-driven header that lifts to show a satellite view annotated with soil type, hardiness zone, and average rainfall
  • A scrolling gallery of project tiles that expand into full before/after detail views with a draggable comparison slider
  • Blueprint-style planting plans with species names, root depths, and seasonal bloom Gantt charts beneath each project
  • A slide-in lead form that pre-fills the postcode, collects garden size via a slider, accepts a photo upload, and invites a free-text brief

Feature list

A brief paragraph on the feature section: every component below is drawn directly from the template brief and reflects what the page actually delivers to visitors and the studio using it.

Postcode Location Header

The header opens with a minimal centered search field over a softly blurred aerial photograph of mixed English gardens. When a visitor enters their postcode, the blur resolves into a satellite view of their actual area, annotated in fine blueprint typography with local soil type, hardiness zone, and average rainfall. The headline "We design gardens that belong exactly here" fades in below.

Before/After Draggable Slider

Each project tile in the gallery expands into a split detail view. The left half shows the before state, a drone photograph of bare earth, neglected lawn, or cracked paving. The right half shows the finished garden. A draggable slider lets the visitor control the reveal at their own pace, making the transformation tangible rather than claimed.

Blueprint Planting Plan Detail

Beneath each project's before/after slider, a planting plan unfolds in blueprint style. Species names appear in a monospaced typeface. Root depths are annotated. Seasonal bloom timelines are drawn as Gantt charts, giving technically minded clients and estate managers a clear read on what was specified and why.

The gallery is structured intentionally: projects increase in complexity from courtyard to suburban rear garden to country estate to public realm. Each step up in scale builds visitor confidence that no project is outside the practice's range, without a single word of marketing copy making that claim.

Slide-In Lead Capture Form

The "Get Your Garden Plan" call to action opens a slide-in panel rather than navigating the visitor away. The form pre-fills the postcode from the header, estimates garden size via a simple square-metre slider, accepts a photo upload labelled "Show us what you're working with," and includes a free-text field for timing and ambitions. No pricing is shown. The confirmation screen promises a personalised soil and light report within 48 hours.

Fixed Bottom Call to Action Bar

After the second project reveal, the primary call to action appears in line. From mid-scroll onward, it persists in a fixed bottom bar so the invitation to enquire is always within reach without interrupting the gallery experience.

Page sections overview

SectionPurpose
Postcode Location HeaderPersonalises the visit instantly using local satellite and soil data
Hero Headline FadeDelivers the core message after postcode entry
Project Gallery GridDisplays finished garden tiles as entry points to detail views
Before/After Detail ViewLets visitors control the transformation slider per project
Blueprint Planting PlanShows technical depth beneath each project reveal
Inline Primary call to actionIntroduces lead capture after the second project
Slide-In Enquiry FormQualifies leads by postcode, size, photo, and brief
Confirmation ScreenPromises a soil and light report within 48 hours
Fixed Bottom call to action BarKeeps the enquiry action visible from mid-scroll onward

Design & branding system

The visual identity follows an Engineering Blueprint theme. It feels like an architect's field notebook left open on a potting bench: graphite smudges on cream paper, with a stub of amber pencil holding the page. Every design decision reinforces precision, craft, and quiet authority.

  • Core palette: deep drafting-table charcoal (#2B2D2F), technical graphite (#5C5E60), and warm pressed-linen white (#F4F0E8) form the structural base
  • Living amber (#D4922A) is reserved for interactive hotspots, hover states, and call-to-action elements, drawing the eye exactly where action is needed
  • Lichen green (#7A8B6F) appears only in botanical labels and icon strokes, keeping the horticultural layer visually distinct from the structural one

Mobile & speed optimization

The template is designed with a scrolling, section-led layout that translates naturally to smaller screens. The draggable slider, slide-in form panel, and fixed bottom bar are all components suited to touch interaction.

  • The postcode field and garden-size slider are straightforward touch inputs that work without a keyboard or mouse
  • Gallery tiles stack vertically on mobile so the escalating project sequence reads cleanly on a phone screen
  • The fixed bottom call-to-action bar remains accessible without obscuring the content the visitor is reading

How this template helps you convert

Parterre is built around lead generation from its first interaction to its confirmation screen. Every structural decision reduces friction and increases the quality of the enquiry received.

  1. The postcode header creates immediate personal relevance, giving visitors a reason to stay before they have read a word of copy
  2. The escalating gallery and blueprint detail views demonstrate expertise at every scale, so visitors self-select and arrive at the form already convinced
  3. The slide-in form qualifies by garden size and intent rather than name and email alone, meaning every submission carries enough context for a useful first conversation

Other information about this template

Parterre suits practices that want their enquiry pipeline to reflect the quality of their design work. The template's structure respects the visitor's intelligence and rewards their curiosity.

  • The confirmation screen's promise of a personalised soil and light report within 48 hours gives immediate value and sets a clear expectation before any call or site visit
  • No pricing is displayed anywhere on the page, so the form functions as a scoping tool rather than a price comparison trigger
  • The template is built for a single-page, gallery-led flow and is not a multi-page website structure
Parterre - Architectural Landscaping Landing Page Template
Parterre - Architectural Landscaping Landing Page Template
Parterre - Architectural Landscaping Landing Page Template
Parterre - Architectural Landscaping Landing Page Template

Theme

Engineering Blueprint

Creative direction

Before/After Reveal

Color system

Charcoal & Amber

Style

Gallery + Detail

Direction

Lead Generation

Page Sections

Postcode-driven Location Header

Before/after Draggable Slider

Blueprint Planting Plan Detail

Escalating Project Complexity Gallery

Slide-in Lead Capture Form

Fixed Bottom Call-to-action Bar

Related questions

Who is this template designed for?

Does the form display any pricing to visitors?

Can I use my own project photography in the gallery?

What does the visitor see after submitting the enquiry form?

Is this a single landing page or a multi-page website?