#Design Bridge — AI 原型生成平台
做一個工具，用一段文字描述就能生出可點擊的網頁原型，供各部門提需求時直接看到畫面；內部實驗性專案。
AI 驅動的原型生成工具：用自然語言描述 UI，AI 幾秒內產出可互動的多頁面 HTML 原型。內部實驗性專案——目標同樣是把各部門的原型需求集中到單一平台，但採用程度尚未達到 Note。
實際系統畫面 — 實際生成過程：輸入「寵物美容預約網站首頁」需求後，合議模式（PM／Designer／Engineer／Moderator）討論定案，自架 opencode gateway（免費模型 mimo-v2.5-free）直接產出可互動的「毛孩澡堂」首頁 wireframe——左側對話、中間即時渲染、右側 275 行 Vue + Tailwind 原始碼。（點擊圖片看原圖）
// 為什麼會做
##背景
PM 與開發團隊之間的溝通落差，讓需求文字到可看畫面之間動輒數天的來回。
// 遇到什麼問題
##問題
需求以文字傳遞時容易失真，設計與開發來回成本高；PM 沒有工具能快速把想法變成可互動的畫面驗證方向。
// 如何解決
##解法
4-Agent 結構化討論（PM → UX → QA → Tech + 確認輪）分析需求 → 準則束縛（harness engineering）：Agent 依設定門檻自動分析並產出網頁與流程圖，美感基準來自自建的視覺基準沙盒 → HTML QA Validator 自動檢查空頁面 / 導航死角 + auto-retry → 元件級選取微調（點選 iframe 內元件，AI 只改該元件、不必整頁重生）。另含對話顧問模式與 SKILL.md 領域知識注入。
// 我負責什麼
##我的角色
設計 4-Agent 協作架構與準則束縛機制，撰寫人設 prompt 與 QA 驗證管線，全端開發
// result
##成果
內部實驗性專案：以 4-Agent 合議＋準則束縛，把自然語言需求變成可互動的多頁面原型（含設計準則、API 清單與對應程式碼）。定位是把各部門的原型需求集中到單一平台，但採用程度尚未達到 Note。
// links