Page / How It Works
How It Works
Explain how FundU works for organizations insimple steps “This page is not informational — it’s a conversion page. Every section should reduce hesitation and move an organization toward starting a fundraiser.
Page Context
What this page should explain
- Match the structure and conversion-focused feel of DoubleGood.com: Hero → 3-step ‘How it works’ → Vendor choices → Benefits → Social proof → Final CTA.
- Include a bold hero headline explaining that fundraising with FundU is simple and fast, with a clear primary CTA.
- Build a 3-step ‘How it works’ section showing: Create fundraiser → Share fundraiser shop → Track results and receive payouts.
- Add a dedicated ‘Choose Your Fundraiser’ section showing multiple community partners/vendors to emphasize marketplace choice.
- Display at least four vendor cards (example partners) to show organizations they are not limited to one fundraiser type.
- Follow with a Benefits/Proof section emphasizing ease, transparency, built-in tracking, and simplified payouts.
- Include a short value-proposition block focused on reducing coordination stress for organization leaders.
- Add social proof with success stories or testimonials to build trust.
- Repeat clear call-to-action buttons throughout the page to keep the experience conversion-focused.
Shared UI Demo
Reusable Page Primitives
Use these components for consistent buttons, paper surfaces, cards, and metric blocks across routes.
Wrapper: components/ui/PaperSurface.tsx
Buttons: components/ui/AppButton.tsx
Cards: components/ui/UiCard.tsx
Paper Card
Use for page modules, forms, and structured content blocks that should match the FundU catalog aesthetic.
Inbound Demand
Organizations can launch campaigns without rep outreach.
Attribution
Businesses see who sent traffic and what generated sales.
Metrics: components/ui/MetricCard.tsx
Orders
148
Campaigns
12
Tracked Sales
$4,280
New Customers
73
Page shell references: components/global/HeaderMenu.tsx, components/pages/PageHero.tsx, components/global/Footer.tsx