在產品開發或創業的過程中，常常會遇到「想快速做一份 pitch deck」「想出一頁產品 one-pager 給客戶看」「要給團隊討論用的 mockup」這種需求。不過真的打開 Figma 或 PowerPoint 從頭排版，通常 10 分鐘內做不完，而且美感調整往往比內容本身還耗時。Anthropic 在 2026 年 4 月 17 日推出的 Claude Design，就是想解決這段「從想法到可交付格式」之間的落差。
這篇文章會先把 Claude Design 是什麼、能產出什麼、怎麼匯出這幾個核心功能整理清楚，接著看訂閱方案與開放範圍、與 Figma、Canva、v0、Lovable 這些工具的定位差別，也會聊一下為什麼 Figma 股價在 Claude Design 發布當天跌了 7%。文末會坦白哪些情境其實不適合用 Claude Design，以及在實際匯出 standalone HTML 後觀察到的幾個限制。
Claude Design 是什麼
Claude Design (https://claude.ai/design) 是 Anthropic Labs 旗下的新產品，由 Claude Opus 4.7 驅動，以對話的方式協作產出視覺設計與可交付文件。使用者用自然語言描述需求（例如「幫我做一份介紹公司 B2B SaaS 的 3 頁 pitch deck，色調偏深藍、字型簡潔現代」），Claude Design 就會產出完整的設計稿，並允許後續透過文字指令來調整版面、配色、文案。
這邊先釐清一個容易誤會的地方——Claude Design 不是 Figma 那種「畫布式」的設計工具，也不是 Canva 的「模板式」工具。它比較接近「對話式設計助理」，整個流程主要依賴對 Claude 描述需求，而不是自己拖拉元件。因此它的學習曲線很低，但相對地對畫素精度、細節手感的控制也不如傳統工具強。
產品目前屬於 research preview（研究預覽），Anthropic 的定位是「實驗性產品」，不保證長期維護或功能穩定。這件事後面會在 Anthropic Labs 的章節詳細談，先記得這個背景，才能合理判斷要把它用在什麼樣的場景。
核心功能總覽
可產出的五種格式
Claude Design 官方列出目前支援的五種產出類型，覆蓋了從 idea 發想到對外交付的常見情境：
| 產出類型 | 適合情境 |
|---|---|
| Prototype | 產品介面、APP 功能流程草稿，給團隊討論 user flow |
| Slides | 投影片，例如會議簡報、公司介紹、課程講義 |
| One-pager | 單頁產品介紹、功能總覽、landing page 雛形 |
| Pitch deck | 募資簡報、商業計畫書，含標準章節骨架 |
| Mockup | UI / 網頁的視覺稿，測試配色與排版 |
實際使用上，類型之間的界線沒有那麼死——例如一份 3 頁的 mockup 也可以當成 prototype 的起點；pitch deck 與 slides 差別主要在結構預設，前者會自動帶入「問題、解法、市場、競品、團隊、Traction、Ask」這類創投常見章節。這些預設骨架對剛開始學寫簡報的人幫助很大。
五種匯出選項
產出格式只是其中一面，Claude Design 真正讓人驚艷的是匯出選項的完整度——一份設計可以直接變成多種不同型態，對應不同的使用場景：
| 匯出格式 | 用途 |
|---|---|
| Canva | 匯入 Canva 後可繼續用 Canva 的模板系統微調，適合非工程背景的使用者 |
| 最通用的交付格式，適合給客戶、外部簡報 | |
| PPTX | PowerPoint 原生格式，適合需要在 Office 生態內持續編輯的情境 |
| Standalone HTML | 單一 HTML 檔可獨立開啟，資源全部內嵌，不需要額外 host |
| Claude Code handoff bundle | 包含設計稿與可餵給 Claude Code 的 spec，讓 AI 開發助手接著實作 |
其中 Standalone HTML 跟 Claude Code handoff bundle 是最有 Anthropic 味道的兩個選項。Standalone HTML 把整份設計（包含字型、圖片、互動）打包成單一 HTML 檔，可以直接分享連結、嵌入 iframe、存成離線檔案。而 Claude Code handoff bundle 則是把設計稿轉成結構化 spec，讓 Claude Code 可以直接讀進來、開始寫程式，把「設計到實作」的流程整段串起來。
讀取 codebase 與 design files 建立 design system
Claude Design 最有差異化的能力，是它可以「讀取團隊的 codebase 與既有 design files，自動建立 design system，之後所有新產出自動套用」。這個設計對應的痛點很明確——大部分團隊在做新 pitch deck 或 one-pager 時，最煩的不是排版，而是「要跟既有品牌的色票、字型、logo 保持一致」。
實作上，Claude Design 會分析我們提供的 repo（例如 Tailwind config、CSS variables、已部署的網站），從中推出品牌色、字型、間距規則、元件風格，再把這些規則儲存成 design system，之後每次產出新作品時自動套用。換句話說，我們只需要前期餵一次資料，後續新設計都會「長得像自家的東西」，不用每次手動指定色票。
注意：把 codebase 或內部 design files 餵給雲端 AI 產品前，需要先確認公司的資料治理政策。Anthropic 公告強調資料不會用於訓練，但受管制產業（金融、醫療、政府）在導入前仍建議走一次合約與法務流程，這點在後面「不該用的情境」章節會再展開。
實際範例：一份用 Claude Design 做的介紹頁
說了這麼多不如看實際的產出。下面這個 iframe 嵌入的，是用 Claude Design 產出的「介紹 Claude Design」投影片，然後輸出成 HTML 頁面。
拆開這個 HTML 檔看，會發現 Claude Design 的匯出不是簡單輸出靜態頁——它是一個 self-contained bundle：所有 JavaScript、字型、圖片資源都用 base64 編碼、再經過 gzip 壓縮後內嵌在同一個 HTML 檔案裡。這樣的好處是整份設計可以用 email 寄送、存在 USB、甚至放到內網分享，不依賴任何外部 CDN 或 host。
代價是檔案會比較大，這份範例檔約 14 MB，其中超過 200 個 woff2 字型檔案內嵌佔了大部分體積。這也解釋了為什麼這份 HTML 要放進 iframe 前，建議加 loading="lazy" 並設定合理的 fallback 連結——對行動網路使用者不友善的第一印象，往往就是從「首屏一個 14 MB 資源」開始的。
訂閱方案與開放範圍
Claude Design 目前開放給 Claude 的 Pro、Max、Team、Enterprise 訂閱者使用，免費版（Free tier）暫時還沒開放。Anthropic 公告提到 feature 會在上線日當天「逐步滾動開放」，意思是就算已經訂閱也不一定即時看到，可能需要等幾個小時後才在介面上出現入口。
訂閱方案之間有一個比較重要的差異——Enterprise 方案是預設關閉，需要由組織的 admin 手動啟用後，底下的成員才能使用。這個設計其實很能理解：Enterprise 通常帶有嚴格的資料治理需求，在管理員沒有確認過新功能的資料流之前，預設就開放給所有員工反而會造成合規風險。這是 Anthropic 對 B2B 客戶常見的做法，類似的安排在 Projects、Files 等功能上也看得到。
關於費用，Claude Design 目前包含在訂閱之內，沒有另外收費，但 Anthropic 也沒承諾未來一定免費。同類 AI 產品（如 ChatGPT 的 Canvas、Gemini 的 Deep Research）通常有「早期免費吸引使用、後續拆成獨立 add-on」的慣例，所以現在算是相對划算的體驗時機。
使用額度與重置機制
Claude Design 有一件務實的事要單獨講：它在「Settings → Usage」裡有獨立的使用額度，跟一般 Claude 聊天與 Claude Code 的額度是分開計算的。這句話有兩個方向的意義——好消息是，跑 Claude Design 不會吃掉日常聊天或 Claude Code 的配額；壞消息是，這份設計專用額度自己很容易見底，背後跑的是 Claude Opus 4.7，一次產出就包了多個頁面、多輪推理，燒 token 的速度相當驚人。
在哪裡看、怎麼看
登入 claude.ai 後從右上角選單進 Settings → Usage，會看到一個專門的 Claude Design 區塊，顯示本週的用量與剩餘比例。額度用完時介面會直接提示下一次重置時間，想繼續用可以在 Settings 裡啟用 Extra usage，之後超過本週額度的部份會另外計費。
重置週期：每 7 天滾動，不是自然週
Anthropic 官方說明是 recurring weekly allowance that resets every seven days，也就是按個人帳號各自的 7 天滾動視窗，不是「每週一歸零」那種自然週結算。舉例來說，如果某週四晚上把額度用光，下一個週四晚上才會回滿，而不是等下週一。這跟多數訂閱服務常見的週期性結算邏輯不太一樣，規劃重要交付日期時要把這點算進去。
各訂閱方案的額度比例
Anthropic 官方沒有公布確切的 token 或次數，只給了方案之間的相對比例：
| 訂閱方案 | 額度定位 |
|---|---|
| Pro | 基準，適合輕度、偶爾做一份 mockup 或 one-pager |
| Max（較低檔） | 約 5× Pro 額度，適合半規律產出設計稿 |
| Max（較高檔） | 約 20× Pro 額度，針對設計師與創作者的密集使用 |
| Team Standard seat | 適合團隊探索性用量 |
| Team Premium seat | 進階用量，適合團隊中重度使用的 power user |
| Enterprise（座席制） | 分 Standard 與 Premium 兩種座席，對應一般與密集用量 |
| Enterprise（usage-based） | 按標準 API 計價，另贈一次性 credit 可涵蓋「約 20 個典型 prompt」 |
注意：實際使用上，Claude Design 的額度燒得比直覺快很多。國外有使用者分享「試玩半小時就把整週額度用完、被鎖到下週」的經驗。一次 pitch deck 產出背後可能牽涉十幾個頁面的版面配置、配色、字型、icon、文案重寫，跟一般聊天那種「幾輪來回」的消耗模式完全不同。
比較實際的做法是：把 Claude Design 留給真的要交付成品的場景——例如明天就要給投資人看的 pitch deck、這週要給客戶的 one-pager——在還沒想清楚方向的探索階段反覆 prompt 迭代很容易把額度燒光。若真的需要密集使用，可以考慮升級到 Max 高階、或在 Settings 裡開 Extra usage 付費延長。
跟 Figma、Canva、Google Stitch 等工具的定位差別
因為 Claude Design 橫跨了「設計工具」與「AI 生成工具」兩個領域，發布後最多人問的就是「它跟 X 差在哪裡」。這邊用一張表把幾個定位相近的工具一起對比：
| 工具 | 核心互動 | 產出型態 | 定位 |
|---|---|---|---|
| Claude Design | 自然語言對話 | 交付格式（PDF、PPTX、HTML） | 從想法到可交付，減少排版 |
| Google Stitch | 自然語言 + AI 畫布 + Voice Canvas | 互動 UI prototype、DESIGN.md | Gemini 驅動、免費，主打 UI/UX 介面設計 |
| Figma | 畫布 + 元件拖拉 | 設計原檔 | 多人即時協作、pixel-perfect 設計 |
| Canva | 模板 + 拖拉 | PDF、PPT、社群素材 | 模板驅動、非專業使用者友善 |
| v0（Vercel） | 自然語言 | React / Next.js 程式碼 | 生成可部署的前端程式 |
| Lovable | 自然語言 | 全端應用程式 | 生成可部署的全端產品 |
拉平這張表後，Claude Design 的差異化就比較清楚——它不產出程式碼（跟 v0、Lovable 不同），但會產出 PDF、PPTX 這種面向商業場景的檔案；它不以畫布操作為主（跟 Figma 不同），但提供了 Figma 沒有的「自然語言 prompt 優化設計」流程；它不完全模板驅動（跟 Canva 不同），但有 Canva 沒有的 codebase 讀取能力。
Claude Design vs Google Stitch
這張表上最容易跟 Claude Design 混在一起的是 Google Stitch。兩者都以 prompt 生成設計為核心，也都能從 URL 或 codebase 萃取 design system，但底層定位其實很不一樣。
Stitch 的強項是「UI 介面的互動 prototype」——可以把多個螢幕串成可點擊的流程（stitch 本身就是「拼接」的意思），透過 Voice Canvas 用語音邊描述邊改圖，再用 Annotate 在畫面上直接圈註解讓 Gemini 解讀。對應的場景是 app 或網頁介面設計，工作流仍然圍繞「畫布」這個核心隱喻。
Claude Design 則把強項押在「多種交付格式」——從 pitch deck、slides 到 one-pager 都能一次產出 PDF、PPTX、standalone HTML，整個互動幾乎純對話，沒有畫布。對應的場景是商業文件與企劃交付，而不是互動介面設計。換句話說，Stitch 像 AI 版的 Figma，Claude Design 像 AI 版的 Keynote 加 Canva。
取得門檻也是實務選擇時的重要因素——Stitch 在 stitch.withgoogle.com 免費開放，而 Claude Design 需要 Claude Pro、Max、Team 或 Enterprise 訂閱。因此如果只是想先感受一下「AI 生成設計」是什麼體驗，從 Stitch 入門成本最低；若已有 Claude 訂閱、而且需求偏向 pitch deck 或公司內部簡報，則直接用 Claude Design 最順。
Claude Design vs Figma
Figma 是近十年專業設計工作流的 source of truth——多人即時協作畫布、元件庫、auto layout、design token、外掛生態系，每一個環節都被設計師長期驗證過。Claude Design 在這些向度幾乎不直接競爭：它沒有畫布、也沒有元件系統，整個互動模式跟 Figma 是兩個世界。
比較實用的判斷方式是看「工作是『從零開始』還是『既有設計的延伸』」。Claude Design 擅長從零開始——給 prompt、拿到第一版完整設計，排版、配色、字型一次搞定。Figma 擅長既有設計的延伸——在品牌 library 的前提下，設計師在畫布上精準控制每一個 pixel，確保跟品牌規範一致。因此早期草稿、pitch deck、內部簡報用 Claude Design 最快；最終交付、行銷素材、品牌核心頁面仍然需要 Figma。至於 workshop、設計共創、即時 review 這類需要多人同時在畫布上拖拉留言的情境，Claude Design 沒有畫布也做不到即時共編，還是 Figma、FigJam 的主場。
實務上最合拍的做法是兩者接力——Claude Design 產出初稿後，若還需要 pixel-perfect 收尾，再把匯出的稿拿到 Figma 做最終微調。這也解釋了為什麼 Claude Design 推出後 Figma 股價雖然短線下跌，但專業設計社群並沒有太恐慌。Figma 自己也在 2025 年底推出 FigJam AI 與 Make，目標不是跟 Claude Design 在「生成」這一層正面對打，而是把 AI 嵌進既有畫布工作流，讓協作時的發想更快。
各工具各自的強項
下面把每個工具最無可取代的那個強項抓出來，之後要挑工具時直接從情境反查會比較快：
- Claude Design：多格式一次交付（PDF、PPTX、standalone HTML、Claude Code handoff bundle），加上讀取 codebase 建立 design system 的能力。適合「一份內容、多種輸出型態」的 pitch deck、one-pager、內部文件場景。
- Google Stitch：互動 UI prototype、Voice Canvas 語音修改、Annotate 直接在畫面上圈註解。把多個 app 畫面串成可點擊流程是它的招牌，且目前免費開放，適合設計師做 app 或網頁介面的早期探索。
- Figma：多人即時協作畫布、元件庫、design token、pixel-perfect 控制。專業設計團隊的 source of truth，其他工具的產出最後往往還是要回到 Figma 做最終調整與品牌合規檢查。
- Canva：海量模板生態（社群貼文、海報、名片、簡報），打開就有數百種 Instagram 限動模板可直接套。對非設計背景使用者最友善、支援多人共編，也是社群素材量產目前最難被 AI 工具取代的定位。
- v0 / Lovable：直接產出可部署的前端或全端程式碼，從 prompt 一路跳到 production URL。適合「設計可以粗、但要能馬上跑起來」的快速 MVP 或 landing page 開發。
換個角度看，這些工具其實不是互斥的——同一個產品團隊可能用 Figma 做主視覺、用 Canva 做社群貼文、用 Claude Design 做投資人 pitch deck、用 Stitch 探索互動原型，再交給 v0 生成前端程式碼。Claude Design 切入的是「多格式交付文件」這個特定環節，並沒有打算吞掉整條設計流程。
因此在選工具時，比較實用的判斷是「這次的產出要送到什麼地方」——送 email 或印出紙本用 PDF、進 PowerPoint 或 Keynote 用 PPTX、發給工程師實作用 handoff bundle、在網頁上嵌 iframe 或放離線檔用 standalone HTML。Claude Design 在這些情境下提供了最短的路徑，其他情境則讓 Figma、Canva、Stitch 繼續擅長它們本來就擅長的事。
Figma 股價當天跌 7%：市場在擔心什麼
Claude Design 發布當天，Figma 股價下跌約 7%。單日波動其實多受情緒影響，不宜過度解讀，但市場的反應本身有訊息——它反映了投資人對「AI 生成 UI 工具長期可能侵蝕 Figma 營收故事」的擔憂。
不過實際上 Claude Design 跟 Figma 在短期內並不直接競爭。Figma 的主要營收來自企業訂閱 seat，使用者以設計師與產品團隊為主，工作流深度仰賴即時多人協作、元件庫、設計 token 管理這些 Claude Design 目前做不到的事。Claude Design 更容易吃掉的，是「非設計師偶爾做一份 pitch deck」這種低頻、低付費意願的長尾需求——這塊其實 Figma 也不是主力。
因此把「Figma 跌 7%」解讀成「Figma 要被 AI 取代」會有點太快。更合理的解讀是：AI 設計工具整體的成熟度正在拉高，Figma 過去以「設計原生的協作平台」為護城河，未來需要證明自己在 AI 輔助設計這塊也能站穩。Figma 2025 年底推出的 FigJam AI 與 Make 就是回應，只是速度跟生態完整度還沒讓市場完全放心。
Anthropic Labs 的實驗產品策略
Claude Design 掛在 Anthropic Labs 這個 brand 下，這是一個值得留意的訊號。Anthropic Labs 的定位類似 Google Labs，是 Anthropic 用來快速試驗新產品概念的管道——做得起來會晉升成正式產品線（像 Claude Code 就是從實驗性功能逐步變成獨立產品），做不起來或被其他產品吸收的功能則會悄悄下線。
因此對於要不要把 Claude Design 納入核心工作流，建議先把它當成「非長期穩定」的工具來看待。這並不是貶意——早期嘗鮮可以拿到最新的能力、跟產品團隊建立反饋回圈，但如果公司的商業簡報流程要全面切到 Claude Design、把 Figma 停掉，那風險就太高了。
題外話，從 Anthropic 近期的產品路線圖看，Claude Code（for 開發者）、Claude Design（for 設計與商業文件）、以及早前推出的 Computer Use / Browser Use（for agent 操作），其實都是在解同一個大問題——「如何讓 Claude 不只給文字回答，而是直接交付可以使用的成果物」。Claude Design 算是這條路線上對設計與商業生產力最明顯的一步。
什麼情境其實不該用 Claude Design
寫到這邊大概已經能感覺到 Claude Design 的價值，不過還是要坦白講幾個不適合的情境，避免讀完後期待過高：
一、已有成熟 Figma library 與 design token 的團隊。在這種團隊導入 Claude Design，最大的風險不是產出品質，而是「source of truth 分裂」——團隊原本所有品牌規則都集中在 Figma 的 shared library，現在又多出一份 Claude Design 的 design system。兩邊不同步就會造成混亂，同步的成本往往比節省的排版時間還高。
二、需要 pixel-perfect 或品牌合規嚴格的場景。自然語言 prompt 的精準度，跟手動拖拉元件的精準度還是有差距。對於最終要印刷、要上法律文件、要跟品牌規範書一字不差的場合，用 Claude Design 產初稿、再拉到專業工具微調是比較安全的做法。
三、受管制產業的內部資料。金融、醫療、政府這類受強監管的產業，把內部 codebase 或 design files 餵給外部模型建 design system 前，建議先走完法務與資安流程。Anthropic 公告資料不會用於訓練，但「資料留存時間」「是否跨區傳輸」「是否允許供應商人工審閱」這些細節，都要在合約層面確認後再導入。
使用上需要留意的限制
除了「不該用的情境」這種策略層面，實際匯出、整合的時候也有幾個技術限制值得提前知道：
Standalone HTML 檔案很大。前面的範例檔約 14 MB，主要來自 200 多個內嵌 woff2 字型。若是要放進行動網路常用的環境（例如部落格 iframe、email 附件），要考量第一次載入時間，並規劃好 lazy load 與 fallback 連結。
PPTX 匯出的動畫與互動會丟失。Claude Design 生成的頁面在 HTML 環境下可以有過場動畫、hover 效果，但匯出成 PPTX 後大多回到靜態頁。若要給客戶當簡報用，PDF 反而是比 PPTX 更穩定的選擇。
Claude Code handoff bundle 目前還在磨合。概念上是把設計稿交給 Claude Code 直接實作，但實際的整合品質很看專案既有結構。對從零開始的新專案比較順，對既有大型專案則還需要手動調整 spec 才能跑得動。
字型選擇以內建為主。目前產出的設計使用的是 Claude Design 內建的字型集，還不能直接指定企業自有的品牌字型。對字型敏感的品牌，會需要在匯出後用 Figma、Illustrator 重新指定。
小結
整體來看，Claude Design 解決的是「開發者、產品經理、創業者想快速把想法變成交付檔案」的痛點，而不是要取代專業設計師的工作流。因此最適合的使用情境，是 Figma 或 Sketch 對自己太重、但 Google Docs 或 PowerPoint 又不夠看的那一塊中間地帶——例如內部 slide、pitch deck 初稿、產品 one-pager、blog 配圖、功能說明頁。
因此如果手上剛好有 Claude Pro / Max / Team 訂閱，這週很值得花 30 分鐘試一份東西——例如把正在做的 side project 做成一頁 one-pager，或把會議摘要做成一份 slide。過程中會很直觀地感受到「自然語言產出可交付文件」的體驗，之後在評估要不要把它納入日常工作流時，才會有比較扎實的判斷基準。
而對於受管制產業、已有成熟設計團隊、或工作需要 pixel-perfect 的情境，先別急著導入。繼續觀察 Anthropic Labs 的產品走向、等到 Claude Design 從 research preview 晉升到正式產品線、匯出選項更成熟的時候再評估，會是比較穩的節奏。