Threshold is a modular card grid landing page for a transitional housing program. Built around a Hero's Journey narrative, it guides visitors through four emotional stages of resident life before inviting them to register for a fundraising gala and open-house tour. The warm linen palette, serif manifesto header, and embedded resident voices make this feel like an invitation, not a pitch.
by Rocket studio
Loading preview…
Quick summary
Threshold is a single-page, card-based landing page template designed for a nonprofit transitional housing program. It uses a Hero's Journey structure to tell resident stories across four modular journey cards, then converts emotionally invested visitors into event registrants. The design is warm, editorial, and unhurried, built to earn trust before it asks for anything.
Who this template is for
This template is built for nonprofits and community organizations that do meaningful work and need a page that reflects that. It speaks directly to teams running transitional housing programs, fundraising events, and community engagement campaigns.
Nonprofit fundraising and development teams planning a gala or open-house event
Housing program coordinators who want donors and supporters to understand resident journeys
Social workers, partner organizations, and volunteer communities looking to deepen engagement
What problem this template solves
Most event registration pages feel transactional. They list a date, show a ticket button, and move on. For a program like this, that approach leaves the most important story untold. Visitors arrive without context, leave without connection, and register without conviction.
A disconnected page fails to communicate the human stakes behind the program's work
Generic registration forms don't build the emotional trust that turns casual visitors into committed supporters
Without narrative structure, donor motivation stays shallow and attrition after the event stays high
What you get with this template
You get a fully structured, emotionally paced landing page that leads visitors through the program's story before asking them to act. Every section earns the next one.
A full-viewport manifesto hero section with large serif type and no competing imagery
Four modular journey cards covering Crisis, Stability, Growth, and Launch, each with resident voice quotes
Full-width statistics interstitial banners placed between card stages to reset emotional stakes
Theme
Community Hearth
Creative direction
Hero's Journey
Color system
Slate & Sky
Style
Card Grid (Modular)
Direction
Event Registration
Page Sections
Hero Manifesto Header Section
Four-stage Journey Card Grid
Statistics Interstitial Banners
Event Registration Form
Secondary Monthly Giving Path
Scroll Reveals and Card Interactions
Related questions
Can I update the resident voice quotes with real stories from our program?
Does the page support visitors who want to donate but cannot attend the event?
What fields does the event registration form include?
Can the statistics interstitial banners be updated with our own program data?
Is this template suitable for nonprofit events beyond transitional housing?
A dual-path registration section with a primary event form and a secondary monthly giving link
Feature list
Hero Manifesto Header
The header fills the full viewport with large, unhurried serif type on a warm linen background. The primary line reads "Everyone deserves an address." A secondary line follows below it. No image competes with the words. A thin hearthstone gray underline anchors the text like a foundation being poured, and a breath of whitespace opens the scroll before the first card appears.
Four-Stage Journey Card Grid
Four modular cards represent the stages of the resident experience: Crisis, Stability, Growth, and Launch. Each card carries a resident voice quote written in natural, unpolished language. The grid scrolls the way a resident moves through the program, giving visitors a felt sense of the journey rather than a summary of services.
Statistics Interstitial Banners
Between card clusters, full-width banners display a single stark statistic with no decoration. These interstitial moments interrupt the scroll with data that resets emotional stakes before the next stage begins. They serve as quiet anchors that remind the visitor why the work matters.
Event Registration Form
The registration form appears after the Growth stage card, when emotional investment peaks. It collects name, email, and number of guests. An optional single-line field asks "What draws you to this work?" The primary call to action reads "Reserve Your Seat at the Table" and repeats again at the bottom of the page.
Secondary Giving Path
Visitors who cannot attend the event are offered a clear secondary path. A link labeled "I Can't Attend but Want to Help" directs them to a monthly giving page. This keeps non-attending supporters inside the conversion flow rather than losing them at the registration form.
Scroll Reveal Animations and Card Interactions
The template includes medium-level animation: scroll reveals bring cards into view as the visitor descends the page. Card hover states add subtle interactivity. Grayscale photo transitions are included for visual depth. These effects are paced to match the unhurried tone of the design without distracting from the content.
Page sections overview
Section
Purpose
Hero Manifesto
Opens with a full-viewport serif declaration and whitespace breath
Crisis Journey Card
Introduces the moment a resident first walks in
First Statistics Banner
Delivers a stark data point to ground the emotional opening
Stability Journey Card
Shows the key ceremony and first grocery run milestone
Growth Journey Card
Covers job training and financial literacy workshop stage
Second Statistics Banner
Resets stakes before the final program stage
Launch Journey Card
Depicts lease signing and the goodbye dinner moment
Registration Form
Primary event sign-up with optional motivation field
Secondary Giving call to action
Monthly giving path for visitors who cannot attend
Page Footer
Minimal horizontal flow footer with essential links
Design & branding system
The visual identity follows a Community Hearth theme built on the Slate and Sky color system. Every color choice is deliberate: the palette feels like a wool blanket draped over a porch railing at dawn. Typography pairs Fraunces, a serif face, for headlines with DM Sans for body copy.
Warm linen (#FAF7F2) background holds all content without harshness; charcoal (#3B3F45) grounds primary text
Hearthstone gray (#6B7280) defines card borders and secondary surfaces; open-morning blue (#7BADE2) accents buttons and progress indicators
Fraunces serif headlines carry emotional weight; DM Sans body text stays clean and readable at all sizes
Mobile & speed optimization
The template is designed desktop-first with careful mobile adaptation built in. Static content is handled through server components, which keeps the page load light even as visual richness increases. The animation layer is intentionally medium-weight so it enhances rather than taxes the experience.
Scroll reveal animations and card hover states are paced for smooth performance across device sizes
A horizontal scroll gallery component adapts gracefully to narrower viewports without losing the journey narrative
Form validation is built into the registration section so the mobile experience stays clean and error-free
How this template helps you convert
The page is structured to earn the registration before the form even appears. Visitors are not confronted with a call to action until they have traveled through the resident journey. By the time the form loads, the emotional groundwork is already laid.
The Hero's Journey card sequence builds cumulative empathy, so the visitor arrives at the form already invested in the outcome
The "Reserve Your Seat at the Table" call to action repeats strategically: once after peak emotional engagement and once anchored at the bottom of the page
The optional motivation field and secondary giving path reduce friction by giving every visitor a meaningful way to respond, regardless of whether they can attend
Other information about this template
This template is a strong fit for community organizations that rely on storytelling to drive donor engagement. It is built to support English-language content with United States date formatting and United States dollar currency references where needed.
The footer uses a minimal horizontal flow pattern that keeps the page exit clean without visual clutter
Resident voice quotes are designed to be replaced with real program voices during setup, keeping authenticity at the center of the content
The template style is a card grid layout, which makes individual journey stages easy to update without redesigning the full page
This template works well for annual gala campaigns, program anniversary events, and open-house community tours
