Gather is a modular card-grid landing page template built for education employee engagement platforms. It uses a scroll-driven Network Effect layout to show isolated staff cards growing into a dense, connected community. The Electric Indigo color system and serif typography create a warm, trustworthy feel that resonates with district HR directors, superintendents, and school principals ready to act on retention.
by Rocket studio
Loading preview…
Quick summary
Gather is a single-page, click-through landing page template designed for education employee engagement platforms. It opens with a scrolling logo bar and a bold serif headline, then walks visitors through an animated network-growth story, from one lonely staff card to a dense, pulsing community grid. The page earns demo clicks by making disengagement feel real before showing the solution.
Who this template is for
This template is built for B2B SaaS and EdTech teams selling staff engagement tools to school districts. It speaks directly to the people who sign the contracts and feel the cost of turnover every semester.
District HR directors managing morale and retention across ten or more school buildings
Superintendents who need ROI evidence before committing to a new platform
School principals who understand that belonging drives retention but lack a practical tool to measure it
What problem this template solves
Mid-career teacher attrition is expensive and quiet. By the time a resignation letter arrives, the relationship is already over. Most HR teams have no visual, real-time way to show leadership how staff belonging affects retention, and no landing page that communicates that urgency to decision-makers before a demo call.
Generic SaaS templates fail to capture the emotional reality of school staff disconnection
Buyers need to feel the problem before they trust a product that claims to solve it
HR directors reviewing multiple tools need a page that earns attention and moves them toward a scheduled demo
What you get with this template
This template delivers a fully structured, modular landing page with scroll-linked animations and a click-through conversion flow. Every section is purposeful and sequenced to guide the right buyer toward booking a demo.
A hero section with a marquee logo bar, a large serif headline, and a primary call-to-action button
A scroll-driven card grid that visually grows from one staff profile to a dense 12-card activity feed
Theme
Community Hearth
Creative direction
Network Effect
Color system
Electric Indigo
Style
Card Grid (Modular)
Direction
Click-Through
Page Sections
Marquee Logo Bar Header
Scroll-linked Network Growth Grid
Pulsing Activity Feed Cards
Sticky Click-through Call to Action Bar
Dual Conversion Path Layout
Recognition and Milestone Card Modules
Related questions
Can I change the color palette to match my brand?
Does this template include a contact form?
Can the card grid sections be reordered?
Is this template suited for a product outside of education?
What is the sticky bottom bar and when does it appear?
A sticky bottom bar call to action that reappears after the third card row
A secondary text link routing analytical buyers to a case study PDF
A linear single-row footer with clean, minimal layout
Feature list
This template ships with purpose-built components tied directly to the platform's core promise.
Marquee Logo Bar Header
A horizontal auto-scrolling strip displays fifty or more school district logos at a calm, continuous pace. No hero image competes for attention. The logos alone serve as the social proof, reinforced by the "4,200 schools" headline metric directly below.
Scroll-Linked Network Growth Grid
The card grid expands across scroll depth: one profile card, then three connected by animated lines, then six, then twelve. Each row reveals a new platform feature while visually performing the product's promise of turning isolation into community.
Pulsing Activity Feed Cards
The final 12-card grid uses micro-animations that mimic a live activity feed. Cards pulse to suggest real-time platform activity, giving visitors a felt sense of an engaged staff community rather than a static feature list.
Sticky Click-Through Call-to-Action Bar
After the third card row, a persistent bottom bar keeps the primary call to action visible without interrupting the scroll story. It disappears on initial load and reappears at the right moment in the visitor's journey.
Recognition and Milestone Modules
Dedicated card modules cover recognition walls, onboarding buddy pairings, and milestone celebrations. Each module is a self-contained visual unit within the modular grid, making the platform's feature set easy to scan and understand at a glance.
Dual Conversion Path Layout
The page supports two buyer types simultaneously. The primary path leads to a demo scheduler via the "See It Live in Your District" button. The secondary path offers a "Read the retention data" text link for analytical buyers who need evidence before a meeting.
Page sections overview
Section
Purpose
Logo Bar Hero
Establishes credibility with district logos and the 4,200-schools headline metric
Primary Call to Action
Places the demo scheduler link immediately below the hero before the scroll story begins
Isolation to Connection
Shows a single staff card growing to three, introducing the recognition wall feature
Twelve pulsing cards with testimonial highlights in encouragement gold
Sticky call to action Bar
Persistent bottom bar repeating the primary call to action after scroll engagement
Full-Width call to action Moment
Final "See It Live" section before the footer, reinforcing the demo click
Linear Footer
Single-row footer with minimal navigation and supporting links
Design & branding system
The visual identity follows a Community Hearth theme that feels warm and grounded rather than cold and corporate. The palette is built around depth, connection, and a single moment of earned warmth.
Deep classroom indigo (#3D2C8D) forms the primary color, used for backgrounds and structural depth
Bright connector violet (#7C5CFC) activates buttons, interactive card edges, and hover states
Warm chalkdust cream (#FFF8F0) covers card surfaces to keep the grid readable and inviting
Encouragement gold (#FFBE0B) is reserved for notification badges, testimonial highlights, and success metrics
Fraunces serif handles all display headlines; DM Sans handles body text and interface labels
Mobile & speed optimization
The template is built desktop-first to match how district HR directors and principals typically review tools, with a solid mobile fallback ensuring nothing breaks on smaller screens.
Scroll-linked animations use Intersection Observer so they trigger only when elements enter the viewport
All animation runs on CSS transforms to stay GPU-accelerated and avoid layout thrashing
The marquee logo scroll, staggered card reveals, and connector line animations are all handled through CSS-based transitions for smooth performance
How this template helps you convert
The page is engineered as a single click-through funnel. Every design and copy decision moves the right buyer toward one action: scheduling a demo.
The logo bar and headline metric build immediate trust before any product claim is made, reducing early bounce from skeptical HR directors
The scroll-driven network growth story creates an emotional arc that makes the product's value felt rather than explained, priming visitors to click through with genuine intent
The dual conversion path serves both the decision-maker ready to book and the analytical buyer who needs a PDF first, capturing more of the realistic buying committee in one page
Other information about this template
This template is part of a broader set of modular landing page templates designed for B2B SaaS and EdTech use cases. A few additional details worth knowing before you build with it.
The page style is Card Grid (Modular), making individual sections easy to reorder or swap without breaking the layout
The creative direction is Network Effect, a visual metaphor that is transferable to any community-building or connection-platform product
The template uses the Electric Indigo color system, which can be rebranded by updating the four core color variables
No form appears on this page by design; the conversion goal is a single outbound click to a demo scheduler
The footer follows a Pattern 1 linear single-row layout, keeping the page exit clean and uncluttered
