真正的產出
導出的是合約,不是簡報。
單檔 HTML:每一頁的畫面、每顆元素的規格、動線與驗收條件,決策可追溯。給 RD 開工、給驗收對照、給 AI coding agent 直接吃。
給需求方的 AI 工作台
跟 AI 把產品
一頁一頁畫出來,
規格標在畫面上
頁面 × 狀態 × 動線長成一張圖,每條規格錨在畫面元素上——
導出的是 RD 打開就能直接開工的合約,不是文件。
免註冊、免安裝 · 看真的跑過一次的生成過程 · 想自己動手再建帳號
spexo · 規格圖 — 電商後台
首頁總覽
📝 5
→點某一列
訂單列表
訂單明細
📝 規格 · 訂單列表
1「出貨」鈕:未付款訂單 disabled,tooltip 說明原因
2列表預設 20 筆;超過改分頁,頁碼記在網址
3金額欄:千分位、右對齊,幣別跟租戶設定
✓ 驗收 4 條,可勾可測⚠ 改「列表預設筆數」會波及 3 頁
現在
規格跟畫面,
永遠對不上。
文件一份、線框一份、嘴上又講了一版——
RD 拿到三個版本,最後只好用猜的。
- 1寫 PRD憑想像描述畫面,寫的人自己也沒看過它長怎樣
- 2畫線框另一份檔案、另一個工具,跟文件各自為政
- 3需求一改文件改了圖沒改,圖改了誰被波及沒人知道
- ✕RD 開工三個版本對不齊,照著猜的做
然後驗收的時候才發現——做出來的不是你要的。
如果畫面跟規格,從第一天就是同一份呢?
用講的,AI 把產品畫出來;
規格,就標在畫面上。
怎麼用
三步,從一句話到可開工。
1
說你要做什麼,AI 畫出來
「電商後台,給客服看訂單」——它反問湊齊背景,第一頁直接長在圖上。
2
照著畫面長樹、標規格
頁面、狀態、動線用講的長;規則點著元素寫上去——人是規格的作者,AI 只起草。
3
導出 RD 合約
畫面+規格+動線+驗收,單檔 HTML。改一個決定,它告訴你波及哪幾頁。
spexo · 規格圖 — 電商後台
訂單列表要能篩日期區間
畫好了——篩選放在列表上方的工具列。要不要順便長一個「查無結果」的空狀態?
好,長出來先不用
訂單列表 · 「出貨」按鈕 📝 人寫的規格,錨在這顆元素上
規格未付款訂單 disabled,滑過顯示 tooltip 說明原因;點了寫入出貨紀錄
驗收條件✓ 2 條可勾驗(含「未付款不可觸發」邊界)
錨點
data-el 持久錨——畫面重生、改版,規格都跟著這顆元素走波及依賴「訂單狀態字典」——那條決定一改,這裡自動標待重看
登入流程 · 提升登入按鈕的視覺明顯度已定案 · V2
現在 → 改成
| 視覺明顯度 | 灰底低對比,常被略過 | 主色實心,置於視線落點 |
| hover 回饋 | 無 | 加深底色 + 游標變手型 |
| 點擊回饋 | 3.5 秒無回應 | 立即進入「處理中…」狀態 |
驗收條件
- ✓按鈕為主色實心,文字對比度 ≥ 4.5:1
- ✓hover 時底色加深、游標為 pointer
- ✓點擊後 200ms 內顯示處理中狀態
- ✓手機 / 桌機皆位於首屏可見範圍
影響元素
.login-btnbutton[type="submit"]改後示意
現在登入
改後登入
畫面、規格、動線、驗收、決策追溯——單檔 HTML,可印、可存、可當驗收依據。
結果
兩邊都鬆一口氣。
需求方
用講的就好
不用寫文件、不用學畫線框。看著畫面想,看著畫面改——想法第一次有地方對齊。
RD
打開就能開工
規格錨在畫面元素上,不用猜、不用回頭問。驗收條件白紙黑字,做完就是過。
你一句話
→
規格
→
RD 開工
→
做完
你不用再:
開需求會
畫線框
寫規格文件
來回確認十次
開工前對齊一次,驗收的時候就不會有驚喜。
跟 AI 原型工具差在哪
別人給你效果圖,
Spexo 給你施工圖。
建築業分得很清楚:效果圖好看,但不能照著蓋;能開工、能驗收的是施工圖。AI 原型工具生的是前者——好看、能點,然後呢?
AI 原型工具(效果圖)
- ✕畫面好看,但「為什麼這樣做」不存在
- ✕重生一次,上次改的細節被洗掉
- ✕改了一處,影響到誰沒人知道
- ✕沒有驗收條件,交付全憑感覺
- ✕原型丟給 RD,還是得重問一輪
Spexo(施工圖)- ✓畫面+規格同一份,錨在元素上
- ✓畫面重生,人寫的規格與微調都留著
- ✓改一個決定,自動列出波及的頁面
- ✓每條規格帶可勾可測的驗收
- ✓導出合約,RD 打開就能開工
Used in production
已經在付費客戶的生產環境,每天運轉。
20+ 份/天
首個付費客戶生產環境日用量
1 行
安裝成本,不碰程式碼與資料庫
外行多人可用 · RD 端近一次到位 · 使用者主動表達喜愛。
另一條路:系統已經在跑?
把 Spexo 嵌進去,在真實畫面上把需求變規格。
內部系統、後台的小需求——直接在出問題的畫面上講,AI 看著真實畫面反問、收斂,產出同一種 RD 能開工的規格。一行 script 或書籤,不碰程式碼與資料庫。
your-app.com · 你的產品
Spexo
⚡ Spexo
Spexo嗨,想改這個頁面的什麼?一句話跟我說。
在這裡輸入…
① 點一下 Spexo 書籤→② 右下角冒出 Spexo→③ 點開就能講
FAQ
企業最關心的幾件事
跟 v0 / Lovable 這些 AI 原型工具有什麼不同?
它們生「效果圖」:畫面好看、能點,但規格不存在——改了影響誰、怎樣算驗收通過,都沒有答案。Spexo 生「施工圖」:畫面與規格是同一份,規格錨在元素上、決策可追溯、附可勾驗的驗收條件,導出就是 RD 能開工的合約。
Spexo 看得到我們的資料嗎?安全嗎?
它只讀你操作當下的畫面(截圖 + DOM)當作規格的證據,存在你自己的租戶裡、登入牆後。不碰資料庫、不改動任何東西;敏感欄位可設遮罩。
可以用在內部系統 / 後台嗎?
這正是它為什麼存在——嵌一行 script 或用書籤,直接跑在你的內部後台或工具上,不需要公開網址。React / Vue / 傳統頁面都相容,不挑框架。
它是要取代 Jira 嗎?
不。Spexo 是 Jira 的上游:把需求變成規格。定案後一鍵匯出 Markdown 給 RD 或 AI coding agent,未來也能開成 Jira / Linear issue。工單管理留給你們現有的工具。
需要改我們的程式碼嗎?
不用。不碰後端、不接資料庫、不動部署——貼一行
<script> 就好;沒權限改頁面模板也行,用書籤一鍵安裝。可以自架(self-host)嗎?
預設是 hosted 服務。整套以 docker compose 運行,企業自架方案可談。
Design Partner
讓規格,變成 RD 打開就能開工的東西
正在規劃新產品?或內部系統有做不完的小需求?留個聯絡方式,一個工作天內回你。
- 115 分鐘線上聊,看你的產品或系統適不適合
- 2開一張規格圖,跟 AI 把第一條流程畫出來
- 3或把 Spexo 嵌進既有系統——第一個需求當場變成規格