The problem
Outbound sales reps sink real hours into competitor research before every cold call. They open the competitor's site, hunt for a pricing page, dig through "About" for decision-makers, scan the blog for activity signals, and stitch together a positioning angle in a Notion doc, for one prospect. Then they do it again for the next.
I wanted a self-serve demo that does that whole loop in under 75 seconds, in front of the prospect, with the n8n pipeline animating live so they can see exactly what the system is doing, not a spinning "Loading..." spinner. The branded PDF is the lead-capture artifact; the live pipeline is the wow.
Architecture
Six logical stages, one n8n workflow, one Postgres column driving the live animation. Hybrid runtime: Next.js owns the form + polling + email gate; n8n owns the scrape + Claude + scoring pipeline.
Submit + Trust Gate
Public form at /teardown takes a competitor URL, an industry, and 1 to 5 extraction targets (offer, contacts, tech stack, recent activity, social presence). Turnstile + zod validate the input, a per-IP cap (5 / 24h) and a global daily cap (200 / day) protect the Anthropic budget, and a Supabase row is inserted with stage='queued'. The n8n webhook is fired async with a 2-second timeout; the row is the source of truth, the client polls from there.
Live Pipeline Animation
The browser polls /api/teardown/status every second and animates a 6-stage diagram from the row's stage column. Each stage flips active → done as n8n PATCHes the column on completion. No SSE, no streaming; one Postgres column drives the entire user-facing show. A 15-second stuck-queued timer catches webhook misfires; tab visibility pauses polling.
Smart Multi-Page Scrape
Firecrawl pulls the homepage. Claude Haiku reads the markdown + first 80 links and picks the 3 to 5 most useful follow-up URLs (pricing → /pricing, contacts → /about, /team, etc.) with a one-line reason each. n8n loops Firecrawl over the picked URLs, accumulates their markdown into workflow-static data, and feeds the lot to the extractor, all under ~$0.05 of Firecrawl + Haiku spend.
Findings Extractor + Threat Score
Claude Sonnet extracts a typed Findings object: only the keys whose target was checked. A pure-JS Code node then computes a 0 to 100 threat score from the findings: tech-stack modernity, recent-activity density, decision-maker discoverability, pricing transparency, and content cadence. Each component normalized 0..1, weighted, and re-normalized to selected components only. No Claude in the scoring loop, fully explainable.
Positioning Synthesizer
A second Sonnet call writes a 150 to 300 word "how to position against them" narrative: concrete weaknesses to anchor against, specific strengths to acknowledge, and 1 to 2 talking points the rep can use on a call. Plain text by design (the on-page result renders verbatim, the PDF wraps it in a section). Tone is peer-to-peer; "leverage," "synergy," and "differentiate yourself" are explicitly banned in the system prompt.
Email-Gated PDF + Funnel
Once stage='ready' fires, the on-page result is free; the branded PDF requires a work email. The trust check (DNS/MX + free-provider + disposable) runs only on engaged prospects who already saw the value. PDF is rendered via the existing Vercel function and emailed via Resend with a List-Unsubscribe header. Day-3 and Day-10 follow-ups fire from the existing cron-driven follow-up workflow, same funnel pattern as the Voice Receptionist.
Key decisions
The choices that separate this from a generic "AI scrapes a website" demo.
Why a single workflow with a Postgres column for state
The animation is driven by polling one column on one row. n8n PATCHes stage='scraping', then 'page_discovery', and so on; the browser polls every second and re-renders. No SSE, no n8n status API, no streaming. The case-study story stays clean: "single workflow, 26 nodes, here's the diagram" reads better than "two workflows, here's why we split them," and the polling pattern is debuggable from psql in 5 seconds.
Why the email gate comes after the wow, not before
The Voice Receptionist's magic-link works because the demo IS the email click: a phone call. For a scraper, putting an email gate before the result kills the "drop URL, watch it work" promise. So the on-page findings + threat score + positioning narrative are free. The branded PDF is what the email unlocks. By the time the prospect's seen the value, the email-gate has 5 to 10x higher conversion than gating the demo itself.
Why deterministic threat score, not Claude-rated
A Claude-rated 0 to 100 score would drift run-to-run and resist explanation. The Code node computes the score from five well-named components with documented weights. If a prospect challenges "why 67?", I can name the inputs. The trade-off is the formula has opinions baked in (modern tech stack = higher threat, monthly cadence = lower), but those opinions are visible and editable, not hiding inside an LLM call.
Precautions baked in
This is a public, self-serve demo with paid Anthropic + Firecrawl calls behind it. Every guardrail is non-negotiable.
- Per-IP rate limit (5 / 24h) + global daily cap (200 / day) on submit, protecting the Anthropic + Firecrawl budget
- Cloudflare Turnstile on both the submit form AND the PDF unlock gate, never just one
- Email trust score (DNS/MX + free-provider + disposable list) on the unlock gate; fake addresses bounce silently
- HMAC-signed unsubscribe tokens with a TEARDOWN_HMAC_SECRET independent from voice-demo and audit lanes; a leaked secret here can't unsubscribe rows there
- Manual x-api-key header on every Anthropic HTTP node, never the httpHeaderAuth credential. Locked in LESSONS.md across all four projects
- Strip Claude code fences before JSON.parse on every parse step; even when the prompt says "no fences," assume they'll appear
Outcome
- Sub-75-second end-to-end run on a real competitor URL, animation keeps the user watching the whole time
- ~$0.18 per completed teardown, well within the $0.20 to $0.35 envelope I designed against
- Single n8n workflow, 26 nodes, every stage observable from one Postgres column
- Email-gated PDF funnel + Day-3 / Day-10 nudge: same lead-capture pattern proven by the Voice Receptionist
Watch the pipeline animate on a real URL
Drop any competitor link, pick what you want extracted, and see the n8n workflow run live. PDF in your inbox if you want it.