From ff9fd7cb0f7362c608ec8714549bea2d29311a80 Mon Sep 17 00:00:00 2001 From: Kieran Klaassen Date: Wed, 26 Nov 2025 20:39:00 -0800 Subject: [PATCH] Fix landing page component counts and formatting MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Critical fixes: - Commands: 16 → 18 (added missing deploy-docs, release-docs) - Agents: Fixed "24 specialized agents" → "23" - Numbers: Standardized format (four → 4, three → 3, etc.) Verified counts: - 23 agents ✓ - 18 commands ✓ - 11 skills ✓ - 2 MCP servers ✓ 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- docs/index.html | 34 ++- plans/landing-page-launchkit-refresh.md | 279 ++++++++++++++++++++++++ 2 files changed, 303 insertions(+), 10 deletions(-) create mode 100644 plans/landing-page-launchkit-refresh.md diff --git a/docs/index.html b/docs/index.html index 9099341..b6cd6d3 100644 --- a/docs/index.html +++ b/docs/index.html @@ -4,7 +4,7 @@ Compounding Engineering - AI-Powered Development Tools for Claude Code - + @@ -64,7 +64,7 @@ Your Code Reviews Just Got 12 Expert Opinions. In 30 Seconds.

- Here's what happened when we shipped yesterday: security audit, performance analysis, architectural review, pattern detection, and eight more specialized checks—all running in parallel. No meetings. No waiting. Just answers. That's compounding engineering: 23 specialized agents, 16 workflow commands, and 11 skills that make today's work easier than yesterday's. + Here's what happened when we shipped yesterday: security audit, performance analysis, architectural review, pattern detection, and eight more specialized checks—all running in parallel. No meetings. No waiting. Just answers. That's compounding engineering: 23 specialized agents, 18 workflow commands, and 11 skills that make today's work easier than yesterday's.

@@ -87,7 +87,7 @@
-
16
+
18
Slash Commands
@@ -147,7 +147,7 @@ The security-sentinel has checked 10,000 PRs for SQL injection. The kieran-rails-reviewer never approves a controller with business logic. They don't get tired, don't skip Friday afternoon reviews, don't forget the conventions you agreed on in March. Run /workflows:work and watch your plan execute with quality gates that actually enforce your standards—every single time.

- 24 specialized agents + 23 specialized agents /workflows:work dhh-ruby-style skill git-worktree skill @@ -291,7 +291,7 @@
-

Research Agents (four)

+

Research Agents (4)

@@ -330,7 +330,7 @@
-

Design Agents (three)

+

Design Agents (3)

@@ -361,7 +361,7 @@
-

Workflow Agents (five)

+

Workflow Agents (5)

@@ -408,7 +408,7 @@
-

Documentation Agent (one)

+

Documentation Agent (1)

@@ -426,7 +426,7 @@

- 16 Powerful Commands + 18 Powerful Commands

Slash commands that replace entire workflows. /workflows:review is your code review committee. /workflows:plan is your research team. /triage sorts 50 todos in the time it takes you to read five. Each one automates hours of work into a single line. @@ -556,6 +556,20 @@

Resolve file-based todos in parallel.

+
+
+ /release-docs + util +
+

Build and update the documentation site with current plugin components.

+
+
+
+ /deploy-docs + util +
+

Validate and prepare documentation for GitHub Pages deployment.

+
@@ -870,7 +884,7 @@ skill: gemini-imagegen Free & Open Source

Install Once. Compound Forever.

- Your next code review takes 30 seconds. The one after that? Even faster. That's compounding. Get 23 expert agents, 16 workflow commands, and 11 specialized skills working for you right now. + Your next code review takes 30 seconds. The one after that? Even faster. That's compounding. Get 23 expert agents, 18 workflow commands, and 11 specialized skills working for you right now.

diff --git a/plans/landing-page-launchkit-refresh.md b/plans/landing-page-launchkit-refresh.md new file mode 100644 index 0000000..3ba4357 --- /dev/null +++ b/plans/landing-page-launchkit-refresh.md @@ -0,0 +1,279 @@ +# Landing Page LaunchKit Refresh + +## Overview + +Review and enhance the `/docs/index.html` landing page using LaunchKit elements and Pragmatic Technical Writing style (Hunt/Thomas, Joel Spolsky). The current implementation is strong but can be refined section-by-section. + +## Current State Assessment + +### What's Working Well +- Specific, outcome-focused hero headline ("12 expert opinions in 30 seconds") +- Developer-authentic copywriting (N+1 queries, CORS, SQL injection) +- Stats section with clear metrics (23 agents, 16 commands, 11 skills, 2 MCP servers) +- Philosophy section with concrete story (N+1 query bug) +- Three-step installation with actual commands +- FAQ accordion following LaunchKit patterns +- Categorized feature sections with code examples + +### Missing Elements (From Best Practices Research) +1. **Social Proof Section** - No testimonials, GitHub stars, or user metrics +2. **Visual Demo** - No GIF/animation showing the tool in action +3. **Arrow icons on CTAs** - 26% conversion boost from studies +4. **Trust indicators** - Open source badge, license info + +--- + +## Section-by-Section Review Plan + +### 1. Hero Section (lines 56-78) + +**Current:** +```html +

Your Code Reviews Just Got 12 Expert Opinions. In 30 Seconds.

+``` + +**Review Checklist:** +- [ ] Headline follows Pragmatic Writing (concrete before abstract) ✅ +- [ ] Eyebrow badge is current (Version 2.6.0) - verify +- [ ] Description paragraph under 3 sentences ✅ +- [ ] Button group has arrow icon on primary CTA +- [ ] "Read the Docs" secondary CTA present ✅ + +**Potential Improvements:** +- Add `→` arrow to "Install Plugin" button +- Consider adding animated terminal GIF below buttons showing `/workflows:review` in action + +### 2. Stats Section (lines 81-104) + +**Current:** 4 stat cards (23 agents, 16 commands, 11 skills, 2 MCP servers) + +**Review Checklist:** +- [ ] Numbers are accurate (verify against actual file counts) +- [ ] Icons are appropriate for each stat +- [ ] Hover effects working properly +- [ ] Mobile layout (2x2 grid) is readable + +**Potential Improvements:** +- Add "developers using" or "reviews run" metric if available +- Consider adding subtle animation on scroll + +### 3. Philosophy Section (lines 107-192) + +**Current:** "Why Your Third Code Review Should Be Easier Than Your First" with N+1 query story + +**Review Checklist:** +- [ ] Opens with concrete story (N+1 query) ✅ +- [ ] Quote block is memorable and quotable +- [ ] Four pillars (Plan, Delegate, Assess, Codify) are clear +- [ ] Each pillar has: tagline, description, tool tags +- [ ] Descriptions use "you" voice ✅ + +**Potential Improvements:** +- Review pillar descriptions for passive voice +- Ensure each pillar description follows PAS (Problem, Agitate, Solve) pattern +- Check tool tags are accurate and current + +### 4. Agents Section (lines 195-423) + +**Current:** 23 agents in 5 categories (Review, Research, Design, Workflow, Docs) + +**Review Checklist:** +- [ ] All 23 agents are listed (count actual files) +- [ ] Categories are logical and scannable +- [ ] Each card has: name, badge, description, usage code +- [ ] Descriptions are conversational (not passive) +- [ ] Critical badges (Security, Data) stand out + +**Potential Improvements:** +- Review agent descriptions against pragmatic writing checklist +- Ensure descriptions answer "when would I use this?" +- Add concrete scenarios to generic descriptions + +### 5. Commands Section (lines 426-561) + +**Current:** 16 commands in 2 categories (Workflow, Utility) + +**Review Checklist:** +- [ ] All 16 commands are listed (count actual files) +- [ ] Core workflow commands are highlighted +- [ ] Descriptions are action-oriented +- [ ] Command names match actual implementation + +**Potential Improvements:** +- Review command descriptions for passive voice +- Lead with outcomes, not features +- Add "saves you X minutes" framing where appropriate + +### 6. Skills Section (lines 564-703) + +**Current:** 11 skills in 3 categories (Development, Content/Workflow, Image Generation) + +**Review Checklist:** +- [ ] All 11 skills are listed (count actual directories) +- [ ] Featured skill (gemini-imagegen) is properly highlighted +- [ ] API key requirement is clear +- [ ] Skill invocation syntax is correct + +**Potential Improvements:** +- Review skill descriptions against pragmatic writing +- Ensure each skill answers "what problem does this solve?" + +### 7. MCP Servers Section (lines 706-751) + +**Current:** 2 MCP servers (Playwright, Context7) + +**Review Checklist:** +- [ ] Tool lists are accurate +- [ ] Descriptions explain WHY not just WHAT +- [ ] Framework support list is current (100+) + +**Potential Improvements:** +- Add concrete example of each server in action +- Consider before/after comparison + +### 8. Installation Section (lines 754-798) + +**Current:** "Three Commands. Zero Configuration." with 3 steps + +**Review Checklist:** +- [ ] Commands are accurate and work +- [ ] Step 3 shows actual usage examples +- [ ] Timeline visual (vertical line) renders correctly +- [ ] Copy buttons work on code blocks + +**Potential Improvements:** +- Add copy-to-clipboard functionality if missing +- Consider adding "What you'll see" output example + +### 9. FAQ Section (lines 801-864) + +**Current:** 5 questions in accordion format + +**Review Checklist:** +- [ ] Questions address real objections +- [ ] Answers are conversational (use "you") +- [ ] Accordion expand/collapse works +- [ ] No passive voice in answers + +**Potential Improvements:** +- Review for weasel words ("best practices suggest") +- Ensure answers are direct and actionable + +### 10. CTA Section (lines 868-886) + +**Current:** "Install Once. Compound Forever." with Install + GitHub buttons + +**Review Checklist:** +- [ ] Badge is eye-catching ("Free & Open Source") +- [ ] Headline restates core value proposition +- [ ] Primary CTA has arrow icon ✅ +- [ ] Trust line at bottom + +**Potential Improvements:** +- Review trust line copy +- Consider adding social proof element + +--- + +## NEW: Social Proof Section (To Add) + +**Position:** After Stats section, before Philosophy section + +**Components:** +- GitHub stars counter (dynamic or static) +- "Trusted by X developers" metric +- 2-3 testimonial quotes (if available) +- Company logos (if applicable) + +**LaunchKit Pattern:** +```html + +``` + +--- + +## Pragmatic Writing Style Checklist (Apply to ALL Copy) + +### The Five Laws +1. **Concrete Before Abstract** - Story/example first, then principle +2. **Physical Analogies** - Import metaphors readers understand +3. **Conversational Register** - Use "you", contractions, asides +4. **Numbered Frameworks** - Create referenceable structures +5. **Humor as Architecture** - Mental anchors for dense content + +### Anti-Patterns to Find and Fix +- [ ] "It is recommended that..." → "Do this:" +- [ ] "Best practices suggest..." → "Here's what works:" +- [ ] Passive voice → Active voice +- [ ] Abstract claims → Specific examples +- [ ] Walls of text → Scannable lists + +### Quality Checklist (Per Section) +- [ ] Opens with concrete story or example? +- [ ] Can reader skim headers and get the arc? +- [ ] Uses "you" at least once? +- [ ] Clear action reader can take? +- [ ] Reads aloud like speech? + +--- + +## Implementation Phases + +### Phase 1: Copy Audit (No HTML Changes) +1. Read through entire page +2. Flag passive voice instances +3. Flag abstract claims without examples +4. Flag missing "you" voice +5. Document improvements needed + +### Phase 2: Copy Rewrites +1. Rewrite flagged sections following pragmatic style +2. Ensure each section passes quality checklist +3. Maintain existing HTML structure + +### Phase 3: Component Additions +1. Add arrow icons to primary CTAs +2. Add social proof section (if data available) +3. Consider visual demo element + +### Phase 4: Verification +1. Validate all counts (agents, commands, skills) +2. Test all links and buttons +3. Verify mobile responsiveness +4. Check accessibility + +--- + +## Files to Modify + +| File | Changes | +|------|---------| +| `docs/index.html` | Copy rewrites, potential new section | +| `docs/css/style.css` | Social proof styles (if adding) | + +--- + +## Success Criteria + +1. All copy passes Pragmatic Writing quality checklist +2. No passive voice in any description +3. Every feature section answers "why should I care?" +4. Stats are accurate against actual file counts +5. Page loads in <3 seconds +6. Mobile layout is fully functional + +--- + +## References + +- LaunchKit Template: https://launchkit.evilmartians.io/ +- Pragmatic Writing Skill: `~/.claude/skills/pragmatic-writing-skill/SKILL.md` +- Current Landing Page: `/Users/kieranklaassen/every-marketplace/docs/index.html` +- Style CSS: `/Users/kieranklaassen/every-marketplace/docs/css/style.css`