Disarm - Transformative Peacebuilding Landing Page Template

Quick summary

Disarm is a single-column flow landing page template for a gun violence prevention international coalition. It opens with one oversized testimonial card, scrolls through neighborhood stories from three continents, reveals shared methodology and block-level impact data, and closes with a registration form for the annual Global Prevention Summit. Every section earns the next one.

Who this template is for

This template is built for organizations where community credibility matters as much as data. It speaks directly to the people who fund, lead, and deliver violence prevention work at scale.

• Municipal violence prevention directors evaluating proven partnership models
• Foundation program officers allocating global health and social impact grants
• Grassroots organizers and practitioners seeking training partnerships with demonstrated methodology

What problem this template solves

Violence prevention organizations often struggle to speak to two audiences at once: the heart and the brain. A page that leads with statistics loses the practitioner. A page that leads with sentiment loses the funder. Disarm solves this by sequencing testimony before evidence, so both audiences feel met.

• No single page template combines intimate neighborhood storytelling with structural program evidence in a coherent scroll flow
• Registration pages for high-trust convenings often feel clinical, eroding the equity framing the work depends on
• Partnership inquiry and event registration typically compete for attention instead of serving separate audiences at separate scroll depths

What you get with this template

You get a fully structured single-column landing page that moves a visitor from one human voice to a global picture and then into action. The layout is deliberate and sequenced, not modular.

• A floating testimonial hero card, three continental neighborhood story cards, a methodology and impact section, a mid-scroll partnership call to action, and a summit registration form with an illustrated regional map selector
• A nature-inspired Cloud Canvas color system with deep loam body copy, rain-washed sage dividers, and new-growth gold reserved exclusively for calls to action and progress indicators
• Instrument Serif typography for headlines and pull quotes paired with Plus Jakarta Sans for body copy and user interface elements

Feature list

This section covers the built-in components and interaction patterns included in the template.

Floating Testimonial Hero Card

The page opens with a single oversized card set against a cloud-white void. It carries a handwritten-style quote, the speaker's name, their neighborhood, and a circular portrait with a real street visible behind them. The card casts a faint sage shadow to give it physical weight on the page.

Three-Continent Neighborhood Story Cards

Three stacked cards follow the hero, each rooted in a specific location: a Medellín comuna, a Cape Town trauma ward, a Chicago West Side youth circle. Each card holds a distinct community voice and grounds the global mission in a named street corner or clinic.

Methodology and Impact Section

After the neighborhood stories, the template pulls back to reveal the connective tissue: a shared training pipeline and block-level incident reduction data presented as a dashboard-style display. This section gives funders and policymakers the structural evidence they need without disrupting the emotional rhythm built earlier.

Mid-Scroll Partnership Call to Action

A secondary conversion path appears after the methodology section. The prompt "Bring This Training to Your City" captures partnership inquiries separately from summit registration, so two distinct audiences are served at the scroll depth where each is most ready to act.

Illustrated Regional Map Registration Form

The summit registration form replaces a standard dropdown with an illustrated map for regional track selection. Visitors also choose a role from a clear list: policymaker, practitioner, researcher, community leader, or funder. The form asks for name and organization first, keeping the experience personal before it becomes procedural.

GSAP ScrollTrigger Animation System

Sections animate into view as the visitor scrolls, using staggered card entrances and parallax movement. The reveal rhythm mirrors the page's content logic: intimate first, structural second, action third.

Page sections overview

Design & branding system

The visual language is nature-inspired and deliberate. Every color choice carries meaning, and the palette behaves like weather clearing after a long storm.

• Cloud white (#F4F1EC) as the primary background, deep loam (#2C2416) for body copy, and rain-washed sage (#7A8B7A) for section dividers and secondary text
• New-growth gold (#D4A843) appears exclusively on calls to action and progress indicators, used sparingly so it draws the eye exactly where action lives
• Instrument Serif handles quotes and headlines to carry emotional weight; Plus Jakarta Sans handles body copy and interface elements for clarity and ease

Mobile & speed optimization

The template is built desktop-first, reflecting how directors and funders typically review program materials on laptops. Mobile performance is treated as equally important, since grassroots organizers often arrive on phones.

• Server Components power static sections such as the hero card, neighborhood stories, and methodology block to keep initial load lean
• Client Components handle animations and interactive elements including the ScrollTrigger reveals, map selector, and registration form
• The single-column flow collapses cleanly on smaller screens without restructuring the content sequence or losing the emotional pacing

How this template helps you convert

The page earns every click before asking for it. Conversion is built into the scroll sequence, not bolted on at the end.

1. The testimonial hero card builds trust before the visitor knows anything about the organization, so they arrive at the methodology section already emotionally oriented toward the work.
2. The mid-scroll partnership prompt appears after the evidence section, capturing the funder or municipal director at exactly the moment they are most ready to inquire about replication.
3. The illustrated map registration form reduces friction and reinforces the equity frame, making summit sign-up feel like joining a convening rather than filling out a form.

Other information about this template

This template is built as a single-column flow landing page, meaning all sections stack vertically in one intentional sequence. There are no sidebar layouts or tab-based navigation structures.

• The footer follows Pattern 1 (Linear Single-Row), keeping the close of the page clean and uncluttered
• The animation system uses GSAP ScrollTrigger for section reveals and staggered card entrances, with parallax applied to create depth between the testimony and evidence layers
• The template sits within the Community and Nonprofit category, specifically the gun violence prevention international NGO niche, making it relevant for global health grant contexts and social impact portfolios
• The primary call to action language, "Reserve Your Seat at the Table," is baked into the template copy to reflect both the convening format and the equity principle that affected communities lead
• The illustrated regional map component replaces a conventional dropdown, reinforcing the local-and-neighborhood creative direction throughout the form experience

Show more