Balance is a single-column editorial landing page built for economic equality awareness campaigns. It pairs real family budget data with personal stories across zip codes, guiding visitors from the kitchen table to collective action. The design uses a warm, faded-photo color system and a Hero's Journey scroll flow, ending with a clear click-through to an action hub.
by Rocket studio
Loading preview…
Quick summary
Balance is a grassroots-ready landing page template for economic equality campaigns. It tells the story of inequality through real receipts, utility bills, and school supply lists placed side by side. The scroll follows a Hero's Journey structure, moving from a family's weekly budget to collective action, using warm editorial visuals that feel lived-in and deeply human.
Who this template is for
This template speaks directly to the people who feel economic inequality every day and the organizers trying to make that reality visible to everyone else.
Parents working multiple jobs who want their family's story told with dignity
Teachers spending personal money on classrooms who need data to back their experience
Local community organizers who are tired of policy briefs that never name a real family
What problem this template solves
Most awareness campaign pages present inequality as a statistic. That keeps the issue distant and easy to scroll past. Balance makes the gap personal by placing real household data from different zip codes on the same screen.
Visitors can see the cost difference clearly, without needing to interpret dense reports
The page earns the click-through emotionally, so visitors act because they feel moved, not because they were pushed
Organizers get a page that works equally well on a phone between shifts and on a desktop at a community meeting
What you get with this template
You get a fully structured single-column landing page built around five distinct narrative sections. Each section advances the story while doing a specific persuasive job.
A cinematic hero section with a composed family portrait and a headline that fades in over the image
A bento-style data grid for zip code comparisons with embedded pull quotes and secondary report links
A primary call-to-action section with the "Sit With Us" button and a clear path to the action hub
Feature list
Theme
Family First
Creative direction
Hero's Journey
Color system
Soft Mist
Style
Single Column Flow
Direction
Click-Through
Page Sections
Hero's Journey Scroll Structure
Cinematic Hero Section
Zip Code Comparison Grid
Emotional Escalation Pacing
Click-through Action Pathway
GSAP Scrolltrigger Animations
Related questions
Does this landing page include a form for collecting visitor information?
Can I use this template for a campaign outside the United States?
What actions can visitors take from this landing page?
How many times does the primary call to action appear on the page?
Is this template suitable for campaigns that rely on real statistics and data?
This section covers the core built-in capabilities of the Balance template as delivered.
Hero's Journey Scroll Structure
The page is organized as a five-act narrative. It opens with a family's ordinary weekly budget, crosses into data, raises the stakes through education and housing, reaches an emotional peak with a child's handwritten note, and then returns with a theory of change and a final call to act together.
Cinematic Hero Section
The hero uses a wide, golden-hour family portrait framed wide enough to count every face. A headline, "Same City. Different Childhood.", fades in over the lower third using a scroll-triggered opacity animation. Floating receipt and bill cards accompany the portrait to anchor the campaign's subject immediately.
Zip Code Comparison Grid
A bento-style grid places real household cost data from different zip codes side by side. Parent quotes sit inside the grid cells as pull quotes. A secondary text link, "Read the Full Report", lives below the grid for policy-minded visitors who need the numbers first.
Emotional Data Storytelling
Each section escalates the stakes in sequence: housing costs, then healthcare, then education. The innermost moment is a child's handwritten note displayed alone on screen. This pacing is deliberate and built into the section order so it cannot be accidentally broken by rearranging content blocks.
Click-Through Action Pathway
The primary call to action, "Sit With Us", appears twice: once after the data threshold and once at the final section. Each instance links to the campaign's action hub. No form lives on the landing page. The click is earned through emotional weight, not a gated content barrier.
GSAP ScrollTrigger Animations
The template includes medium-weight scroll-driven animations powered by GSAP ScrollTrigger. These include staggered content reveals, counter animations for statistics, floating card hover effects, and grayscale-to-color photo transitions that activate as the visitor scrolls deeper into the story.
Page sections overview
Section
Purpose
Hero Portrait
Anchors the campaign emotionally with a golden-hour family photo and fade-in headline
Ordinary World Budget
Shows one family's real weekly expenses in a warm kitchen-table layout
Data Threshold Grid
Compares zip code costs side by side with parent quotes and a report link
Education Stakes
Presents teacher spending data alongside a child's handwritten note
Theory of Change
Builds the path from individual action to collective pressure with the primary call to action
Minimal Footer
Closes the page with a single-row linear footer pattern
Design & branding system
The visual identity follows a Family First theme built on the Soft Mist color system. Every color decision references the feeling of a family photo that has been sitting on a refrigerator door long enough to fade slightly in the sunlight.
Background surfaces use morning fog gray (#E8E4E1) and worn kitchen-table oak (#C4A882) to keep the page warm and grounded
Body text runs in soft pencil graphite (#5B5B5B) for quiet readability, while quiet hopeful gold (#D4A843) appears only on buttons and pull quotes where the page asks something of you
Typography pairs Fraunces, a serif built for emotional headlines, with DM Sans for body text and data labels, creating a contrast between feeling and fact
Mobile & speed optimization
The template is built mobile-first, reflecting the reality that its primary audience checks pages on a phone between work shifts. Layout, typography, and tap targets are all sized for a small screen first, then expanded for wider displays.
Scroll-driven animations use Client Components only where interactivity is needed, while static content uses Server Components to keep initial load lean
The single-column flow means no complex grid reflow is needed on smaller screens, so the reading experience stays consistent from phone to desktop
How this template helps you convert
The conversion strategy here is emotional gravity, not form friction. The page earns the click by building an undeniable case before it ever asks for action.
The Hero's Journey scroll structure increases investment with each section, so by the time the "Sit With Us" button appears, visitors already feel the weight of the story and want to do something with that feeling.
The dual placement of the primary call to action gives both early-convinced visitors and late-convinced visitors a clear exit point into the action hub, without interrupting the story for anyone who needs more context first.
Other information about this template
The Balance template is designed for USA-based campaigns, with all data labels and currency formatted in English and United States Dollars (USD). The project is localized for domestic audiences by default.
The footer follows a Pattern 1 linear single-row layout, keeping the close of the page minimal and uncluttered
The template supports three action pathways inside the linked action hub: attending a town hall, signing an open letter, and sharing a personal family story
Creative direction follows a Hero's Journey arc, which pairs well with campaign launches, awareness weeks, and public testimony drives where you need to move someone from observer to participant
The Soft Mist color system and Family First theme are intentionally non-partisan in tone, making the template suitable for campaigns that want to build broad community coalitions rather than mobilize a single political base
