Conversion ux

Skill ominou5/funnel-architect-plugin/skills/conversion-ux

Turn Claude into a full-stack sales funnel architect. Build high-converting funnels with optimized UI/UX, page speed, mobile responsiveness, and deploy to any platform.

Install

npx -y skills add ominou5/funnel-architect-plugin --skill conversion-ux

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its author says it does

Copied from the file, not written here

Conversion-focused UX patterns for sales funnel pages. Apply these patterns to every page to maximize conversion rates. Covers layout, CTA placement, social proof, urgency, and friction reduction.

SKILL.md

3.8 KB, as published. Nobody here has run it

Conversion UX Patterns

Apply these patterns to every funnel page. These are not suggestions — they are requirements for high-converting funnels.

Above the Fold (First Viewport)

Every page must have these 3 elements visible without scrolling:

Headline — Clear, benefit-driven, addresses the #1 pain point
Sub-headline — Expands on the headline, introduces the solution
Primary CTA — Visible, high-contrast button with action-oriented text

<!-- Pattern: Hero Section -->
<section class="hero">
  <h1>Headline: Desired Outcome</h1>
  <p class="subtitle">Sub-headline: How you'll get there</p>
  <a href="#action" class="cta-primary">Action-Oriented CTA Text →</a>
</section>

CTA Button Rules

Rule	Good ✅	Bad ❌
Action-oriented	"Get My Free Guide"	"Submit"
First-person	"Start My Trial"	"Start Your Trial"
Benefit-focused	"Unlock 50% More Sales"	"Click Here"
Urgency	"Claim My Spot (Only 12 Left)"	"Register"
Specificity	"Download the 7-Step Checklist"	"Download"

CTA Placement

Always above the fold
Repeat after every major value block (every 2–3 scroll lengths)
Sticky CTA bar on mobile (bottom of viewport)
Final CTA with full benefit stack at page bottom

Social Proof Patterns

Testimonial Card

<div class="testimonial">
  <img src="avatar.jpg" alt="Customer Name" class="testimonial-avatar">
  <blockquote>
    <p>"Specific result they achieved with your product."</p>
    <cite>
      <strong>Full Name</strong>
      <span>Title, Company</span>
    </cite>
  </blockquote>
</div>

Trust Bar

<div class="trust-bar">
  <span>As featured in:</span>
  <img src="logo1.svg" alt="Publication 1">
  <img src="logo2.svg" alt="Publication 2">
  <img src="logo3.svg" alt="Publication 3">
</div>

Stats Row

<div class="stats-row">
  <div class="stat"><strong>10,000+</strong><span>Customers Served</span></div>
  <div class="stat"><strong>4.9/5</strong><span>Average Rating</span></div>
  <div class="stat"><strong>30-Day</strong><span>Money-Back Guarantee</span></div>
</div>

Urgency Patterns (Use Authentically)

Countdown timer — Only for real deadlines (course enrollment, live event)
Limited spots — Only if genuinely limited ("12 of 50 spots remaining")
Price increase — Only if price is actually changing
Seasonal — "Enroll before [date] to join the spring cohort"

Friction Reduction

Form Optimization

Minimize fields — Only ask for what you need at this stage
- Opt-in: Email only (name optional)
- Purchase: Email, name, payment
- Application: More fields acceptable
Single-column layout — Never side-by-side fields on forms
Progress indicator — For multi-step forms
Inline validation — Show errors in real-time, not on submit

Navigation

Remove top nav on landing pages — No escape routes
Single CTA — One primary action per page (secondary allowed in footer)
Exit intent — Optional popup when cursor moves to close tab

Visual Hierarchy

Headline (largest text, bold)
Sub-headline (medium text)
CTA button (high contrast, standout color)
Body copy (readable, 16px+ on desktop, 18px+ on mobile)
Supporting text (smaller, lighter — fine print, disclaimers)

Mobile UX Requirements

Touch targets: minimum 44x44px
CTA button: full width on mobile
Font size: minimum 16px (prevents iOS zoom on input focus)
Spacing: generous padding between tap targets
Sticky CTA: fixed bottom bar on scroll