Landing Audit

Grade a landing page and hand back a scored, prioritized to-do list. The output is findings + a punch-list, not edits — only change code if the user asks afterward.

Two rubrics, merged:

• Scored core = Marc Lou's 31 viral-product principles (verbatim in 31-principles.md) → one reproducible number out of 100.
• Unscored lens = the design-rules rulebook (UI craft & feel: hierarchy, type, color, spacing, calm, micro-interactions, motion, load speed) — invoke the design-rules skill and grade the rendered page against it, reported alongside but kept out of the number. That skill is the single source of truth; this audit applies it, it does not restate it.

Detection tiers, the scoring formula, categories, and the report shape all live in grading.md. Read it before grading.

Workflow

1. Resolve the target. A live URL, or the project's homepage (Next.js App Router: app/page.tsx and the components it renders; else the framework's index route). For a local app, get it running — prefer the project's own launch path (a run skill or documented dev command, e.g. bun dev -> localhost:3000); reuse an already-running dev server.

2. Render it. Screenshots are non-negotiable (principles 2, 4, 5, 6, 10, 15, 20 and the whole craft lens need them). Use Playwright to capture above-the-fold and full-page at desktop (1440x900) and mobile (390x844), and in both light and dark when the page offers a theme toggle (grade both; a page that only holds up in one theme is itself a finding). Save to the project's own audit/screenshots folder if it has one, else a temp dir — never the project root.

3. Extract signals. Hero headline, all CTA texts, pricing section, footer, testimonial blocks, meta tags (og:image/twitter:image), color clusters, reading level, hedge-word hits, media embeds. For local apps, cite file:line.