funnels skill

---
name: funnel-pages
description: This skill should be used when the user asks to "create landing pages", "build funnel pages", "sales pages", "opt-in pages", "OTO pages", or mentions funnel pages, conversion pages, or direct response landing pages. Creates high-converting funnel pages using proven frameworks.
---

# Funnel Pages & Landing Pages

Write high-converting landing pages for funnels, including lead capture pages, sales pages, OTO pages, and campaign pages. Apply proven principles from Russell Brunson, Mike Filsaime, Anik Singal, and Product Launch Formula.

## Core Objectives

- Maximize opt-ins, purchases, or CTA completions
- Capture and hold attention with curiosity and clarity
- Communicate emotional and strategic benefits
- Build urgency and trust quickly
- Drive action with scroll-based momentum

## Page Types

- **Lead Capture / Opt-In Page**
- **Sales Page (Long-Form or Short-Form)**
- **OTO / Upsell Page**
- **Webinar Registration Page**
- **Challenge Funnel Page**

## Core Page Structure

### 1. Headline + Subheadline (Above-the-Fold)

- Attention-grabbing, emotionally charged headline
- Clear subheadline expanding benefit/transformation
- Hook angle using numbers, outcomes, or paradigm shift
- [Hero Image or Video Thumbnail]

### 2. Lead Magnet or Offer Stack

- Bullet list (Feature → Transformation framing)
- Immediate benefit + long-term gain
- [Supporting visuals, product mockups, icons]

### 3. Urgency & Scarcity

- Countdown timer
- Limited bonuses or enrollment caps
- Copy cues: "Only available this week"

### 4. Social Proof & Testimonials

- Quotes, screenshots, video testimonials
- Trusted client/media logos
- Early and mid-scroll placement

### 5. Offer Breakdown / Value Stack

- Visual component listing
- Real-world value and price anchor
- Bonus stack with stated value

### 6. Guarantee / Risk Reversal

- Money-back or conditional guarantee
- "Nothing to lose" reassurance
- Clear terms

### 7. Final CTA Section

- High-contrast CTA button
- Offer restated near button
- Trust badge or secure checkout icon

## Copywriting Style

- Clear, confident, results-focused tone
- Emotional momentum with conversational copy
- Short, rhythmic sentences
- Ellipses and curiosity loops
- Inspired by Brunson, Filsaime, Singal

## Quality Standards

**Headlines:** Stop the scroll
**Subheadlines:** Build desire
**Bullets:** Stack value
**CTAs:** Create urgency
**Overall:** Would you buy from it?

## Visual & UX Notes

- Mobile-first design
- Thumb-friendly buttons
- White space for flow
- Visual cues (arrows, animations)
- Sticky header or floating CTA

## Page-Specific Features

### OTO Pages
- Urgency-focused copy
- No exit links
- Price anchor
- Before/after contrast

### Opt-In Pages
- One CTA only
- Minimal friction (name + email)
- Zero distraction

### Webinar Registration
- Date/time lock-in
- Time zone display
- Instant confirmation
- Calendar add option

## Funnel Type Variations

| Type | Key Adjustments |
|------|-----------------|
| Discovery Call | Authority proof, low-friction booking |
| Product Launch | Pre-launch rhythm, cart open/close |
| Book Funnel | Chapter highlights, shipping value |
| Freemium | Time-to-value, plan comparison |
| Membership | Community, retention bonuses |
| Tripwire | Order bump + OTO profit stack |
| VSL/Sales | Video hook, skimmable transcript |
| Webinar | Countdown, speaker credibility |
| Challenge | Daily transformation, community |

## Examples

### Opt-In Page Example (Above-the-Fold)

```html
<section style="background: linear-gradient(180deg, #1a1a2e 0%, #16213e 100%); color: white; padding: 80px 20px; text-align: center;">
  <div style="max-width: 600px; margin: 0 auto;">
    
    <!-- Pre-headline -->
    <p style="color: #f6e05e; font-size: 14px; letter-spacing: 2px; margin-bottom: 15px;">
      FREE INSTANT DOWNLOAD
    </p>
    
    <!-- Headline -->
    <h1 style="font-size: 42px; line-height: 1.2; margin-bottom: 20px;">
      The 7-Figure Funnel Blueprint: How I Generated $2.3M From a Single Funnel
    </h1>
    
    <!-- Subheadline -->
    <p style="font-size: 18px; opacity: 0.9; margin-bottom: 30px;">
      Discover the exact page-by-page breakdown of my highest-converting funnel—including the copy, the tech, and the numbers.
    </p>
    
    <!-- Lead Magnet Image -->
    <img src="lead-magnet-mockup.png" style="max-width: 300px; margin-bottom: 30px;" />
    
    <!-- Value Bullets -->
    <div style="text-align: left; background: rgba(255,255,255,0.1); border-radius: 12px; padding: 25px; margin-bottom: 30px;">
      <p style="font-weight: bold; margin-bottom: 15px;">Inside this free guide, you'll discover:</p>
      <ul style="list-style: none; padding: 0; margin: 0;">
        <li style="margin-bottom: 12px;">✓ The 4-page funnel structure that converts 3x better than average</li>
        <li style="margin-bottom: 12px;">✓ My exact headline formulas (steal them)</li>
        <li style="margin-bottom: 12px;">✓ The "invisible upsell" that added $47K in pure profit</li>
        <li style="margin-bottom: 12px;">✓ Why 97% of funnels fail (and how to be in the 3%)</li>
      </ul>
    </div>
    
    <!-- Opt-In Form -->
    <div style="background: rgba(255,255,255,0.05); border-radius: 12px; padding: 30px;">
      <input type="text" placeholder="Your First Name" style="width: 100%; padding: 15px; border: none; border-radius: 8px; margin-bottom: 15px; font-size: 16px;" />
      <input type="email" placeholder="Your Best Email" style="width: 100%; padding: 15px; border: none; border-radius: 8px; margin-bottom: 15px; font-size: 16px;" />
      <button style="width: 100%; background: #38a169; color: white; padding: 18px; border: none; border-radius: 8px; font-size: 18px; font-weight: bold; cursor: pointer;">
        YES! SEND ME THE FREE BLUEPRINT →
      </button>
      <p style="font-size: 12px; opacity: 0.6; margin-top: 15px;">
        🔒 Your info is safe. No spam, ever.
      </p>
    </div>
    
  </div>
</section>
```

### Sales Page Value Stack Example

```html
<section style="background: #f7fafc; padding: 60px 20px;">
  <div style="max-width: 800px; margin: 0 auto;">
    
    <h2 style="font-size: 36px; text-align: center; color: #1a202c; margin-bottom: 40px;">
      Here's Everything You Get Inside
    </h2>
    
    <!-- Core Offer -->
    <div style="background: white; border-radius: 12px; padding: 30px; margin-bottom: 20px; border-left: 4px solid #5a67d8;">
      <div style="display: flex; justify-content: space-between; align-items: start;">
        <div>
          <h3 style="color: #1a202c; margin: 0 0 10px 0;">The Complete [Program Name] System</h3>
          <p style="color: #4a5568; margin: 0;">
            6 core modules taking you from zero to [outcome]. Includes video training, 
            worksheets, and implementation guides.
          </p>
        </div>
        <p style="color: #5a67d8; font-weight: bold; white-space: nowrap;">$997 Value</p>
      </div>
    </div>
    
    <!-- Bonus 1 -->
    <div style="background: #fefcbf; border-radius: 12px; padding: 30px; margin-bottom: 20px; border-left: 4px solid #d69e2e;">
      <div style="display: flex; justify-content: space-between; align-items: start;">
        <div>
          <p style="color: #744210; font-size: 12px; font-weight: bold; margin: 0 0 5px 0;">🎁 BONUS #1</p>
          <h3 style="color: #1a202c; margin: 0 0 10px 0;">Done-For-You Templates</h3>
          <p style="color: #4a5568; margin: 0;">
            Copy-paste templates for [specific use case]. Just customize and deploy.
          </p>
        </div>
        <p style="color: #d69e2e; font-weight: bold; white-space: nowrap;">$297 Value</p>
      </div>
    </div>
    
    <!-- Bonus 2 -->
    <div style="background: #fefcbf; border-radius: 12px; padding: 30px; margin-bottom: 20px; border-left: 4px solid #d69e2e;">
      <div style="display: flex; justify-content: space-between; align-items: start;">
        <div>
          <p style="color: #744210; font-size: 12px; font-weight: bold; margin: 0 0 5px 0;">🎁 BONUS #2</p>
          <h3 style="color: #1a202c; margin: 0 0 10px 0;">Private Community Access</h3>
          <p style="color: #4a5568; margin: 0;">
            Get feedback, support, and accountability from peers on the same journey.
          </p>
        </div>
        <p style="color: #d69e2e; font-weight: bold; white-space: nowrap;">$197 Value</p>
      </div>
    </div>
    
    <!-- Total -->
    <div style="background: #1a202c; color: white; border-radius: 12px; padding: 30px; text-align: center;">
      <p style="font-size: 18px; opacity: 0.7; margin: 0;">Total Value:</p>
      <p style="font-size: 36px; text-decoration: line-through; opacity: 0.5; margin: 5px 0;">$1,491</p>
      <p style="font-size: 18px; margin: 0 0 5px 0;">Your Investment Today:</p>
      <p style="font-size: 56px; font-weight: bold; color: #38a169; margin: 0;">$297</p>
      <p style="font-size: 14px; opacity: 0.7; margin-top: 10px;">Or 3 payments of $109</p>
    </div>
    
  </div>
</section>
```

### OTO Page Example (Urgency-Focused)

```html
<section style="background: #c53030; color: white; padding: 20px; text-align: center;">
  <p style="margin: 0; font-size: 18px;">
    ⚠️ WAIT! Your order is not yet complete. Do NOT close this page.
  </p>
</section>

<section style="background: white; padding: 60px 20px;">
  <div style="max-width: 700px; margin: 0 auto; text-align: center;">
    
    <h1 style="font-size: 38px; color: #1a202c; line-height: 1.2; margin-bottom: 20px;">
      "One-Time Offer: Get [Product] for 70% Off (Only $47)"
    </h1>
    
    <p style="font-size: 18px; color: #4a5568; margin-bottom: 30px;">
      This exclusive offer is <strong>only available right now, on this page</strong>. 
      Once you leave, it's gone forever.
    </p>
    
    <!-- Product Image -->
    <img src="oto-product.png" style="max-width: 400px; margin-bottom: 30px;" />
    
    <!-- Why This Matters -->
    <div style="text-align: left; background: #f7fafc; border-radius: 12px; padding: 30px; margin-bottom: 30px;">
      <p style="color: #1a202c; margin-bottom: 15px;">
        You just invested in [Main Product]—smart move.
      </p>
      <p style="color: #4a5568; margin-bottom: 15px;">
        But here's the thing...
      </p>
      <p style="color: #4a5568; margin-bottom: 15px;">
        [Main Product] gives you the WHAT.<br>
        [OTO Product] gives you the HOW.
      </p>
      <p style="color: #1a202c; font-weight: bold;">
        Without [OTO Product], most people take 3-6 months to implement.<br>
        With it? You could see results in the first week.
      </p>
    </div>
    
    <!-- Price Anchor -->
    <p style="font-size: 24px; color: #718096; text-decoration: line-through;">
      Regular Price: $147
    </p>
    <p style="font-size: 48px; color: #c53030; font-weight: bold; margin: 10px 0;">
      Today Only: $47
    </p>
    
    <!-- CTA Buttons -->
    <button style="background: #38a169; color: white; font-size: 20px; padding: 18px 48px; border: none; border-radius: 8px; cursor: pointer; margin-bottom: 15px; width: 100%; max-width: 400px;">
      YES! Add This To My Order for $47 →
    </button>
    
    <p style="margin-top: 20px;">
      <a href="#decline" style="color: #718096; font-size: 14px;">
        No thanks, I don't want faster results. Take me to my purchase.
      </a>
    </p>
    
  </div>
</section>
```

## Guidelines

**Landing Page Principles (Per Russell Brunson, Mike Filsaime, Anik Singal):**

1. **One Page, One Goal** - Every page has ONE primary action
2. **Scroll-Based Momentum** - Copy builds desire as they scroll
3. **Feature → Transformation** - Don't sell features, sell outcomes
4. **Price Anchor** - Always show value before price
5. **Risk Reversal** - Make buying feel safer than not buying

**Avoid Funnel Page Pitfalls:**
- Never: Multiple competing CTAs on opt-in pages
- Never: Exit links on OTO pages
- Avoid: Walls of text without visual breaks
- Skip: Generic headlines that could be anyone's

**Headline Formulas:**
- "How to [Outcome] Without [Pain Point]"
- "The [Number] Secrets to [Desired Result]"
- "Discover the [Method] That [Transformation]"
- "Finally: A [Solution] That Actually Works for [Audience]"

**Copywriting Style (Per Mike Filsaime):**
- Clear, confident, results-focused tone
- Emotional momentum with conversational copy
- Break up long sections with short, rhythmic sentences
- Use ellipses (...) and curiosity loops to keep users scrolling
- 3-5 lines maximum per paragraph

**Visual & UX Best Practices:**
- Mobile-first with thumb-friendly buttons
- White space and scroll indicators for flow
- Visual cues (arrows, animated elements) guide next steps
- Sticky header or floating CTA for long-form pages
- Video thumbnails with play button overlay

**Page-Specific Rules:**

**Opt-In Pages:**
- ONE CTA only (no navigation, no footer links)
- Minimal friction: first name + email maximum
- Zero distraction—remove everything that doesn't convert
- Promise immediate value (instant access)

**Sales Pages:**
- Multiple CTAs as they scroll (every 2-3 sections)
- Value stack before price reveal
- Testimonials distributed throughout
- Guarantee prominently displayed

**OTO Pages:**
- NO exit links (accept or decline only)
- Urgency-focused copy ("one-time only")
- Price anchor (show "regular price" first)
- Before/after emotional contrast
- Decline link should be understated

**Webinar Registration:**
- Date/time above the fold with timezone
- Calendar add buttons immediately after signup
- 3 Secrets / What You'll Learn format
- Countdown to live date

## Quality Checklist

- Does headline stop the scroll?
- Is value stack compelling?
- Is urgency real and believable?
- Are CTAs prominent and action-oriented?
- Would you convert from this page?

## Additional Resources

### Reference Files
- **`references/page-frameworks.md`** - Funnel page templates