Brochure → live site in 3 hours

Receipts

Proven in production.

• Ballair / Fuel First / 7Air — operating-group brochure + allowlist admin + federal bid agent

  Stood up the digital footprint for a three-entity aviation operating group: Fuel First International (fueling + bunker, CAGE 77SM4), Ballair Aviation Holdings (Boeing 767F + holding entities), and 7Air Cargo (three 737-800SFs, FAA Part 121, acquired May 2026). The deliverable is three layers: a public brochure at ballairaviation.com, a hard-allowlist admin dashboard for the operator, and an Anthropic-backed federal-bid drafting agent that scouts SAM.gov on the operating-group's real CAGE/UEI and drafts compliant bid sections without ever inventing a capability or auto-submitting.

  • 3 federal entities under one ops surface
  • 28 SAM.gov keyword-scope categories — one-click into live searches

When to use it

Trigger phrases.

Any of these in the user's prompt should invoke this skill in Claude Code.

• Make a website from this brochure
• Brochure to site
• PDF to website
• Same-day site from this image
• Flyer to landing page
• Partner sent me a brochure
• We need a quick web presence for [brand]
• Scan-this-and-build-it

What it needs

Required inputs.

• 01A brochure source image (JPEG / PNG / HEIC / PDF) with a wordmark, 3–10 service bullets, and at least one hero-worthy photo
• 025–10 locked brand decisions — color direction, font preference, nav style, email-handoff target, domain registrar
• 03The customer's domain name + registrar credentials (for the human-handoff DNS step until the registrar MCP lands)

The mechanism

Pipeline.

1. 01 · Read the brochure

   Multimodal extraction — copy and imagery from the same JPEG.

   Open the brochure with the vision-capable model. Extract verbatim: wordmark text, tagline, service bullets, About paragraph, sampled color hex values from the dominant 3–5 colors, contact info. Inventory the photos visible in the brochure; note which one is hero-worthy. Output a structured brochure-extract object the next stage consumes.

2. 02 · Lock the plan

   Write a 200–300 line PLAN.md so the executor never re-prompts.

   Convert the brochure-extract into a complete `PLAN.md` at the project root: decisions captured (table), visual design system (color tokens, typography, layout), site structure (single-page scroll, exact section list with brochure-sourced copy), tech stack (plain HTML + Tailwind + one serverless function — no framework), email pipeline (Cloudflare Email Routing + Resend), file layout (exact tree), build & deploy steps (phase-numbered Chrome execution checklist), pre-launch checklist, out-of-scope list. Every decision pre-resolved.

3. 03 · Author the paste-block

   Compress PLAN.md into a 100–150 line CLAUDE_CODE_PROMPT.md.

   A self-contained paste-block: project root absolute path, brochure source image filename, every locked decision inline ('do not re-prompt me on these'), exact file layout, image-extraction sub-steps, email pipeline contract, explicit stop conditions ('do not deploy', 'do not push'), workflow steps, and the one-screen handoff format. This is the artifact the executor session reads end-to-end before writing a line of code.

4. 04 · Execute the build

   Fresh Claude Code session runs PLAN.md → working site in ~3 hours.

   The executor reads the brochure image, extracts the hero + supporting frames via Pillow / ImageMagick, recreates the logo as a flat SVG (not a tracing — a clean two-tone wordmark + decorative element), builds 400–500 lines of hand-written HTML with all sections inline, writes 80–120 lines of `api/contact.js` Resend handler, compiles Tailwind to a static CSS file, initializes git, makes the first commit, and stops at the boundary it can't cross.

5. 05 · Numbered handoff

   8 ordered Chrome steps for the parts only a human (or the right MCP) can do.

   GitHub repo + push → Vercel import + env var → DNS nameserver migration → Cloudflare Email Routing → Resend domain verify + API key → custom domain on Vercel + SSL → Gmail Send-As setup → smoke test (form submit, reply delivery, mail-tester ≥9/10). Each step has a one-paragraph instruction and a verification check.

What lets it fan out

Connector stack.

With all of these MCP connectors wired, the mechanism runs end-to-end without human handoff. Without them, the handoff is a numbered Chrome checklist.

• Vercel MCP

  Available

  Steps 2, 5, 6 — programmatic deploy, env-var management, custom domain attach.

• GitHub MCP

  Needed

  Step 1 — programmatic repo create + push + branch protection.

• Cloudflare MCP

  Needed

  Steps 3, 4 — add zone, change nameservers via API, enable Email Routing, add MX/TXT records.

• Resend MCP (or REST API client)

  Needed

  Step 5 — add domain, retrieve DNS records, verify, generate API key.

• Registrar MCP (GoDaddy / Namecheap / CF Registrar)

  Needed

  Step 3 — change nameservers from the customer's existing registrar to Cloudflare.

• Gmail MCP

  Partial

  Step 7 — Send-As configuration. Gmail MCP exists in this environment but doesn't expose the Settings → Accounts surface.

• Email-delivery test MCP

  Needed

  Step 8 — automate the mail-tester.com submission + score retrieval.

Guardrails

Stop conditions.

The skill is predictable because it refuses to expand its own scope.

• stopDon't expand to multi-page — single-page scroll only. If the brochure implies a blog or team page, stop and ask.
• stopDon't invent capabilities — if the brochure doesn't say 'FAA Part 121 certified', the copy can't say it either.
• stopDon't auto-purchase — no domain registrations, no paid SaaS, no exceeding free-tier without explicit confirmation.
• stopDon't push to remote without confirmation — `git init` and stage locally; ask before `git push`.
• stopDon't deploy without confirmation — print the Vercel import URL and wait.