/fix-landing

Fix the highest priority landing page issue.

What This Does

• Invoke /check-landing to audit landing page

• Identify highest priority issue

• Fix that one issue

• Verify the fix

• Report what was done

This is a fixer. It fixes one issue at a time. Run again for next issue. Use /copywriting for copy improvements.

Process

1. Run Primitive

Invoke /check-landing skill to get prioritized findings.

2. Fix Priority Order

Fix in this order:

• P0: No landing page, redirects to app

• P1: No value prop, no CTA, weak CTA, mobile broken, slow

• P2: No social proof, single CTA, missing metadata

• P3: Polish items

3. Execute Fix

No landing page (P0): Create app/page.tsx or app/(marketing)/page.tsx with:

• Hero section with headline

• Feature highlights

• Call-to-action

• Social proof section

No clear value prop (P1): Add compelling headline:

<section className="hero"> <h1 className="text-5xl font-bold"> [Verb] your [noun]. [Benefit] in [timeframe]. </h1> <p className="text-xl text-gray-600"> [Product] helps you [primary benefit] without [common pain point]. </p> </section>

Examples:

• "Track your fitness. See results in weeks."

• "Write better code. Ship faster with confidence."

• "Manage your team. Focus on what matters."

No CTA or weak CTA (P1): Add strong CTA:

<a href="/signup" className="bg-primary text-white px-8 py-4 rounded-lg text-lg font-semibold"

Start Free Trial → </a>

CTA best practices:

• Action-oriented: "Start", "Get", "Try", "Create"

• Specific: "Start Free Trial" not "Submit"

• Visible: High contrast, above fold

• Multiple: Above fold + below fold

Mobile broken (P1): Add responsive classes:

<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> {/* Features */} </div>

Add mobile menu.

Slow load time (P1):

• Use next/image for images

• Use next/font for fonts

• Remove heavy client-side libraries from landing

• Ensure page is statically generated

No social proof (P2): Add testimonials section:

<section className="testimonials"> <h2>What our users say</h2> <div className="grid grid-cols-1 md:grid-cols-3 gap-6"> <blockquote> <p>"Quote from happy user"</p> <cite>Name, Title at Company</cite> </blockquote> </div> </section>

4. Expert Panel Review (MANDATORY)

Before returning fix to user, run expert panel review.

See: ui-skills/references/expert-panel-review.md

• Simulate 10 world-class advertorial experts (Ogilvy, Rams, Scher, Wiebe, Laja, Walter, Cialdini, Ive, Wroblewski, Millman)

• Each expert scores the fixed section 0-100 with specific feedback

• Calculate average score

• If average < 90: Implement highest-impact feedback, iterate

• If average ≥ 90: Proceed to verification

Example review output:

Expert Panel Review: Hero Section Fix

Do not proceed until 90+ average achieved.

5. Verify

After fix passes expert review:

Check headline exists

grep -E "text-(4xl|5xl|6xl)" app/page.tsx

Check CTA exists

grep -E "Start|Get Started|Try|Sign Up" app/page.tsx

Check mobile responsiveness

grep -E "sm:|md:|lg:" app/page.tsx | head -5

Check performance (if lighthouse CLI available)

lighthouse http://localhost:3000 --only-categories=performance

6. Report

Fixed: [P1] No clear value proposition

Updated: app/page.tsx

• Added hero section with headline
• Added sub-headline explaining benefit
• Added supporting visual

Copy:

• Headline: "Track your fitness journey. See results in weeks."
• Sub: "Volume helps you build consistent habits without complicated tracking."

Next highest priority: [P1] No CTA button Run /fix-landing again to continue.

Branching

Before making changes:

git checkout -b landing/improvements-$(date +%Y%m%d)

Single-Issue Focus

Landing pages are high-impact. Test each change:

• A/B test major copy changes

• Measure conversion impact

• Keep changes reversible

Run /fix-landing repeatedly to optimize conversions.

Related

• /check-landing

• The primitive (audit only)

• /log-landing-issues

• Create issues without fixing

• /copywriting

• Marketing copy improvements

• /cro

• Conversion rate optimization