從無到有建立一個用於生產環境的登陸頁面。此技能負責技術層面（效能、SEO、圖示、圖片、驗證）。Impeccable 負責設計。 不要重新發明視覺效果——將它們移交出去。
首先：只詢問缺失的資訊
不要預設立場。如果以下任何事項在請求中不明確，請提問（每次批次提出 2–4 個問題，使用使用者的語言）：
- 品牌：名稱、業務內容、一行價值主張、標誌檔案（或產生一個？）。
- 受眾 + 目標：誰會造訪，主要轉換目標（WhatsApp / 表單 / 電話 / 註冊 / 購買）。
- 章節 / 內容：有哪些區塊及其真實文案（服務、關於、流程、聯絡方式……）。切勿編造事實、價格、統計數據或推薦見證——將未知部分標記為
// PLACEHOLDER — editar。 - 外觀：任何靈感參考圖片、調色盤或品牌顏色、語言/地區、目標網域（用於 SEO
SITE_URL）。 - 圖片：確認 Gemini 金鑰存在於
.env檔案中，名稱為GEMINI-IMAGES-API（請參閱圖片步驟）。
工作流程
-
建立骨架 — Next.js App Router + TS + Tailwind。首先閱讀專案自己的框架文件（例如
node_modules/next/dist/docs/）；API 可能與訓練資料不同。保持檔案少於 350 行。 內容的單一事實來源： 所有可編輯的值——每個標題、段落、列表項、品牌名稱、連結、電話/WhatsApp、價格、SEO 字串——都存放在一個單一的類型化檔案中（lib/content.ts或site.config.ts）。元件從該檔案匯入，並且不包含任何硬編碼的文案。依據環境而異的值（SITE_URL、聯絡電話）來自.env，並透過該單一檔案重新匯出。目標：非開發人員透過編輯一個檔案即可更改所有內容。 -
設計 → Impeccable。 這是視覺品質的必要條件。對於全新專案，執行
/impeccable init（它會設定 PRODUCT.md/DESIGN.md，選擇品牌註冊 + 調色盤），然後對每個區塊執行/impeccable craft <section>。Impeccable 的反AI垃圾規則（每個章節不要有眉毛元素，不要有 01/02/03 骨架，不要有相同的卡片網格，對比度 ≥4.5:1，有意的動畫）是標準。目標：乾淨、簡約、視覺上引人注目——而不是 AI 垃圾。 -
圖片 — 填滿每個視覺區塊。編寫
public/images/manifest.json，執行scripts/generate-images.mjs，後處理，驗證。一個共用的style= 一組有凝聚力的圖片。絕對不要讀取或印出.env——只使用node --env-file=.env。→ references/images.md -
效能 — next/image（AVIF、
sizes、僅 LCP 使用priority）、next/font、縮小來源、不要將真實內容隱藏在opacity:0的揭露效果之後（在預渲染時會顯示空白）、減少動畫的備用方案。→ references/performance.md -
SEO + Favicon — Metadata API（標準連結、OG 1200×630、twitter）、
viewport、robots.ts、sitemap.ts、JSON-LD、<html lang>，以及透過scripts/make-icons.mjs從標誌產生的圖示/OG 圖片。→ references/seo.md -
驗證 —
npm run build乾淨建置 + 實際上能繪製內容的無頭螢幕截圖（較大的--virtual-time-budget；很小的 PNG = 空白 = 揭露陷阱）+ 如有可能達到 Lighthouse 95+ 分。在將產生的圖片接入之前，先讀取它們。
腳本
scripts/generate-images.mjs— 從 manifest 使用 Gemini 產生圖片。node --env-file=.env <script> public/images/manifest.json [names…] [--dry]。讀取GEMINI-IMAGES-API，絕不記錄它。scripts/make-icons.mjs— 從標誌產生 favicon.ico + icon.png + apple-icon.png + og.jpg（需要sharp）。node <script> --logo public/logo.png [--mark …] [--out-app src/app] [--bg "#fafaf8"] [--title "…"] [--crop "L,T,W,H"]。
嚴格規則
- 絕不讀取/回顯
.env或 API 金鑰。 - 所有可編輯的內容都在一個檔案中；元件沒有硬編碼的文案。
- 設計品質需通過 Impeccable；不要輸出預設外觀的結果。
- 切勿編造事實/統計數據/推薦見證——使用占位符，並清楚標記。
- 不要將真實內容隱藏在 JS 觸發的揭露效果之後（空白頁面陷阱）。