Curtain is a full-width immersive landing page template built for an auditorium and theater design atelier. It guides visitors through three sensory chapters, silence, sight, and warmth, using parallax mosaics, scroll-animated waveforms, and editorial typography. The page converts through a gated acoustics folio download and a Listening Session booking path.
by Rocket studio
Loading preview…
Quick summary
Curtain is a full-width, single-page template for a performing arts acoustic design atelier. It opens with a nine-tile parallax photo mosaic and moves visitors through immersive scroll sections covering acoustic engineering, sightline geometry, and material warmth. Two conversion paths sit at the end: a gated PDF folio download and a Listening Session booking form.
Who this template is for
This template speaks directly to design studios and ateliers working in high-stakes performing arts environments. It suits teams whose clients expect depth before they commit to a conversation.
Acoustic design ateliers and architectural studios specializing in auditorium and theater projects
Boutique firms pitching university deans, municipal cultural directors, or private arts patrons
Studios that need a content-led page to build credibility before a first meeting
What problem this template solves
Most architecture portfolio pages present projects as finished images. Clients commissioning a performing arts center need to understand process, not just results. This template fills that gap by embedding real knowledge into the scroll experience itself.
Visitors leave without requesting contact because the page offers no substantive preview of expertise
Prospective clients cannot distinguish one acoustic design firm from another based on surface-level portfolio grids
A PDF folio gated behind a generic form feels like a transaction rather than a natural next step
What you get with this template
The template delivers a complete, single-page layout structured around three immersive content chapters and two conversion touchpoints. Every section is built to carry weight independently, so the page educates as it persuades.
A nine-tile asymmetric photo mosaic hero with parallax scroll behavior and one amber accent tile
Three scroll-driven content sections covering acoustic principles, sightline geometry, and material palettes
A folio download gate with email capture and a project-stage selector, plus a secondary Listening Session booking path
Theme
Atelier Studio
Creative direction
Atmosphere & Mood
Color system
Monochrome Steel
Style
Full-Width Immersive
Direction
Content/Resource
Page Sections
Nine-tile Parallax Mosaic Hero
Scroll-animated Waveform Section
Sightline Vector Overlays
Tactile Material Palette Display
Gated Acoustics Folio Download
Atmospheric Background Transitions
Related questions
What types of clients is this template designed to attract?
How does the folio download gate work?
Does the template require any external animation libraries?
Can the three content chapters be adapted for a different atelier focus?
Is this template suitable for a firm that also does non-theater architectural work?
Feature list
The template is built around a set of purposeful, prompt-grounded capabilities that work together as a single immersive experience.
Nine-Tile Parallax Mosaic Hero
Nine precisely cropped images fill the viewport in an asymmetric grid. Each tile shifts at a different scroll speed, creating a layered depth effect. One tile, the working-light image, carries the stage-light amber accent, drawing the eye before the mosaic collapses into a single full-bleed hall photograph.
Scroll-Animated Waveform Visualizations
The Silence section uses SVG waveform graphics that animate as the visitor scrolls. Reverberation time and acoustic engineering principles are explained through these animated visuals, making technical content immediately readable without requiring prior expertise.
Sightline Geometry Overlays
The Sight section layers elegant vector overlays directly onto hall photography, rendering sightline geometry as a visual argument rather than a written one. Visitors see the spatial logic of the atelier's design approach without reading a single technical paragraph.
Material Palette Close-Ups
The Warmth section presents oak, felt, bronze, and plaster as tactile photographic close-ups. Each material is shown at a scale that communicates texture, giving commissioning clients a sensory reference before any formal specification is discussed.
Gated Acoustics Folio Download
A forty-page PDF compendium covering reverberation time, material selection, and spatial geometry sits behind a two-field gate: email address and a project-stage selector with four options (early concept, schematic design, renovation, or research only). The gate qualifies leads without friction.
Section Background Transitions
As the visitor scrolls, the page background shifts between concrete gray, deep charcoal, and back, mimicking the physical experience of moving from lobby to auditorium to backstage. These CSS-driven transitions reinforce the atmospheric creative direction without requiring heavy animation libraries.
Page sections overview
Section
Purpose
Hero Mosaic Grid
Opens with nine parallax tiles; amber accent tile anchors visual focus
Silence: Acoustics
Scroll-animated SVG waveforms explain reverberation and acoustic engineering
Sight: Sightlines
Vector overlays on hall photography illustrate spatial geometry principles
Warmth: Materials
Tactile close-ups of oak, felt, bronze, and plaster communicate material character
Folio Download Gate
Email and project-stage form gates the forty-page acoustics PDF compendium
Listening Session call to action
Secondary booking path for in-person or virtual project walkthroughs
Footer
Arc Browser Split pattern with atelier tagline
Design & branding system
The template follows an Atelier Studio visual identity built on a Monochrome Steel color system. The palette is deliberately restrained: luxury is communicated through what is removed, not what is added.
Core colors are deep charcoal (#1C1C1E), brushed gunmetal (#4A4A4D), and warm concrete gray (#9E9E9E), with stage-light amber (#E8A838) reserved exclusively for interactive states and pull-quotes
Typography uses DM Sans with long breathing margins and single-sentence editorial blocks that read like stage directions
All hero images are desaturated to near-monochrome except the amber accent tile, maintaining visual hierarchy across the mosaic
Mobile & speed optimization
The template is built desktop-first, with the mosaic hero and waveform animations designed for wide viewports. On smaller screens, the layout degrades gracefully without breaking the content experience.
Parallax mosaic, scroll-linked waveforms, and slideInBlur reveals are powered by CSS scroll behavior and IntersectionObserver, avoiding heavy third-party animation libraries
Section background transitions use CSS-native approaches, keeping the page light and responsive under normal network conditions
Mobile layouts preserve the core three-chapter narrative structure while simplifying the mosaic and animation layers for smaller displays
How this template helps you convert
The page is structured so that every scroll section earns the next one. By the time a visitor reaches the folio gate, they have already consumed substantive acoustic knowledge, making the download feel like a continuation rather than an interruption.
The waveform, sightline, and material sections give away real expertise freely, building trust before any ask is made, so the folio download feels like the natural next chapter
The two-field gate (email plus project-stage selector) qualifies visitors by intent at the moment of highest engagement, separating active commissioners from early researchers
Other information about this template
This template is built for a specific intersection of architectural specialization and performing arts venue design. A few additional details are worth noting for teams evaluating fit.
The template style is Full-Width Immersive, suited to desktop-primary audiences who spend time reading and exploring before contacting a studio
The creative direction is Atmosphere and Mood, meaning the scroll experience simulates a physical journey through a performing arts building rather than presenting a conventional portfolio
The header concept is a Photo Grid Mosaic, a less common pattern that signals editorial sophistication and differentiates the atelier from standard architecture firm templates
The landing page direction is Content and Resource, prioritizing knowledge delivery over hard selling, which aligns well with long sales cycles common in institutional and civic commissioning processes
Pull-quotes from completed projects appear in the amber accent color, providing social proof at the material and acoustic sections without interrupting the atmospheric flow
