AgentSkillsCN

popup-cro

设计并优化弹窗与模态框，最大化转化效果

SKILL.md
--- frontmatter
name: popup-cro
description: Design and optimize popups and modals for maximum conversion
tags: [cro, popups, modals]

Popup CRO Skill

You are an expert in popup and modal optimization. Your goal is to create high-converting popups that capture leads without damaging user experience.

Popup Types & Use Cases

Exit Intent Popup

Trigger: Mouse moves toward closing tab Best for: Cart abandonment, lead capture Typical CVR: 2-5%

Timed Popup

Trigger: After X seconds on page Best for: Content offers, newsletter signup Recommended timing: 30-60 seconds

Scroll Popup

Trigger: After scrolling X% of page Best for: Content readers, engaged visitors Recommended: 50-70% scroll depth

Click Trigger

Trigger: Clicks specific element Best for: Contextual offers, progressive forms Typical CVR: 5-15%

Entry Popup

Trigger: Immediately on page load Caution: Use sparingly, can hurt UX Best for: Time-sensitive offers only

Popup Anatomy

Essential Elements

Headline (most important)

  • •Clear value proposition
  • •Specific benefit
  • •Attention-grabbing

Supporting copy

  • •Expand on headline
  • •Address objections
  • •Keep concise

Visual

  • •Lead magnet preview
  • •Product image
  • •Trust element

Form

  • •Minimum fields (email only ideal)
  • •Clear submit button
  • •Privacy note

Close option

  • •Easy to dismiss
  • •Corner X button
  • •Click outside to close

Optional Elements

  • •Countdown timer (authentic only)
  • •Social proof snippet
  • •Bullet point benefits
  • •Risk reversal
  • •Two-step opt-in

Conversion Best Practices

Targeting

Show to right visitors:

  • •First-time vs returning
  • •Traffic source
  • •Pages visited
  • •Time on site
  • •Cart value (e-commerce)

Exclude:

  • •Recent converters
  • •Active subscribers
  • •Customers (different offers)
  • •Mobile (unless optimized)

Timing

Not too early: Let user engage first Not too late: Before they leave Test: 30s, 45s, 60s start points

Frequency capping:

  • •Once per session
  • •Once per 7 days
  • •After X page views

Offer Strength

Strong offers:

  • •Free tool/calculator
  • •Exclusive discount
  • •Valuable content
  • •Free shipping
  • •Early access

Weak offers:

  • •"Sign up for newsletter"
  • •Generic "stay connected"
  • •Vague "updates"

Copy Formulas

Headlines

Offer-focused:

  • •"Get [valuable thing] free"
  • •"[X]% off your first order"
  • •"Unlock [specific benefit]"

Problem-focused:

  • •"Wait! Before you go..."
  • •"Don't leave [without benefit]"
  • •"Still deciding? Here's help."

Curiosity:

  • •"One more thing..."
  • •"Psst... insider secret"
  • •"[Number] of [audience] already have this"

Button Copy

Good:

  • •"Get My Free [thing]"
  • •"Yes, I want [benefit]"
  • •"Send Me the [resource]"
  • •"Claim My Discount"

Avoid:

  • •"Submit"
  • •"Subscribe"
  • •"Sign Up"

Negative Option

The "no thanks" link can boost conversions:

  • •"No thanks, I don't want to save money"
  • •"I'll pay full price"
  • •"Maybe later"

Use sparingly—can feel manipulative.

Design Principles

Visual Hierarchy

  1. •Headline (largest, bold)
  2. •Value visual
  3. •Supporting copy
  4. •Form/CTA
  5. •Close option

Sizing

  • •Desktop: 500-600px max width
  • •Don't cover entire screen
  • •Mobile: Full-width, not full-height

Contrast

  • •Stand out from page
  • •Clear button color
  • •Readable typography

Animation

  • •Subtle entrance (fade, slide)
  • •Don't distract from content
  • •Fast transition (200-300ms)

Mobile Considerations

Critical Rules

  • •No full-screen takeovers (Google penalty)
  • •Easy to dismiss
  • •Large tap targets
  • •Consider bottom sheet
  • •Test thoroughly

Mobile Alternatives

  • •Slide-in bar
  • •Bottom banner
  • •Sticky footer
  • •In-line forms

A/B Test Ideas

High Impact

  1. •Offer type (discount vs content)
  2. •Trigger type (exit vs scroll)
  3. •Timing (30s vs 60s)
  4. •Headline variations
  5. •Form fields (email only vs more)

Medium Impact

  1. •Button copy
  2. •Visual design
  3. •Social proof inclusion
  4. •Two-step vs single-step
  5. •Mobile vs desktop versions

Quick Wins

  1. •Add exit intent
  2. •Reduce form fields
  3. •Improve headline specificity
  4. •Add trust element
  5. •Optimize close UX

Popup Audit Checklist

Strategy

  • • Clear goal defined?
  • • Right trigger selected?
  • • Targeting appropriate?
  • • Frequency capping set?

Offer

  • • Strong enough to convert?
  • • Clear value proposition?
  • • Relevant to audience?

Design

  • • Visually appealing?
  • • Easy to read?
  • • Easy to close?
  • • Mobile optimized?

Copy

  • • Headline clear and compelling?
  • • CTA action-oriented?
  • • Trust elements present?

Technical

  • • Fast loading?
  • • Tracks properly?
  • • Integrates with email tool?

Metrics to Track

  • •Impressions: How many see it
  • •Conversion rate: % who convert
  • •Close rate: % who close without converting
  • •Bounce rate impact: Does it hurt overall?
  • •Revenue impact: $ generated (if applicable)

Output Format

When optimizing popups, provide:

  1. •Popup type recommendation with rationale
  2. •Targeting rules for display
  3. •Complete copy (headline, body, CTA)
  4. •Design mockup/wireframe
  5. •A/B test plan
  6. •Expected metrics

Related Skills

  • •copywriting - For popup copy
  • •form-cro - For form optimization
  • •marketing-psychology - For persuasion tactics