Vibe Designing 是什麼？當設計從手工畫變成下指令

AI TOOLS · 2026

CHAPTER 01 · ORIGIN

一條 throwaway tweet，撐起一個年度詞

去年二月那個傍晚，Andrej Karpathy 在 X 上隨手丟了一句：這種新的寫程式方式我叫它 vibe coding——完全交給 vibes，擁抱指數級成長，連 code 存在這件事都忘掉。他自己後來形容那條是「shower of thoughts」，洗澡洗到一半隨手寫的。

那條推文跑出超過四百五十萬次瀏覽，被 Collins 詞典選為 2025 年度詞，半個科技圈跟著一整年都在繞著它打轉。Y Combinator 公開承認 2025 冬季梯次裡，有 25% 的新創團隊，程式碼是 95% 由 AI 生成的。Sundar Pichai 也在公開場合說過，Google 內部超過 30% 的新程式碼來自 AI。

設計圈這一年一直在等一個東西：我們的版本什麼時候到？

這個春天揭曉了。

Stitch 2.0 推出他們自己定義的「Vibe Design」模式：你不用先畫線框，你描述商業目標、描述你想讓使用者感受到什麼、描述你最近被哪個 UI 打動，AI 生成多個高擬真方向，你來篩選與微調。Muzli 在當天的評論寫：這是設計工具二十年來最有意思的一次轉向。

CHAPTER 02 · WHAT IS IT

Vibe Designing 到底是什麼

我先用一個對比講清楚這件事的本質。

傳統設計流程裡，你開了 Figma 之後做的第一件事，通常是拉一個矩形、決定 grid、選 typography、開始排版。在你回答「這個產品該長什麼樣」之前，你已經做了幾百個微決定：這個欄位寬幾，這個 spacing 多少，標題用什麼字重。

Vibe Designing 把這個順序整個翻過來。你開始的第一件事是描述：幫我設計一個冥想 app 的 landing page，要平靜、極簡，參考 Apple Health 跟 Headspace 的調性。AI 一次給你三到五個高擬真方向，排版、配色、字型、icon 全做好，你直接開始選。

一句話講完：意圖驅動，生成優先，人來收斂。

跟 Vibe Coding 的差別在哪？Vibe Coding 是把實作層丟給模型，你停留在意圖層。Vibe Designing 一樣是把製作層丟給模型，但你停留的不只是意圖——你還要當品味的最後一道閘門。AI 給你的是材料，你決定哪一個方向能上場。

CHAPTER 03 · TURNING POINT

Stitch 為什麼是這場運動的「正式起點」

Stitch 不是第一個 AI 設計工具。它甚至不是 Google 第一次嘗試。但三月十八日的這一發，讓「Vibe Designing」這個詞從口號變成可以指著看的東西。

幾個關鍵更新一次發出來。

▲ Stitch 2.0 介面拼貼：描述框、設計系統、Voice Canvas、Play 互動 prototype 同框出現（圖：Google Labs）

AI-Native Infinite Canvas。整個工作區重寫，你可以丟進去的不只是 prompt：截圖、競品 URL、code snippet、一段文字描述使用者輪廓——AI 把這些當作同一個專案的 context 一起讀。輸入單位從「精確的動作」變成「意圖」。

Voice Canvas。Gemini Live 接進來，你直接對著畫布講話。它會邊聽邊問你問題、給你 critique、即時改畫面。你說「這個 hero 區再強烈一點」「給我三個 menu 變體」「換成深色版本」，它直接改給你看。

DESIGN.md。這個是設計師最該抬頭看的一個。它是一份 agent-friendly 的 markdown 設計系統檔——色彩、字型、間距、元件都被寫成可讀格式，可以從任何 URL 抽取，可以匯入匯出到 Cursor、Claude Code、Antigravity、AI Studio。Stitch 在四月把這份規格 open source 了。

Play 與 MCP。靜態畫面一鍵變成可點的 prototype。MCP server 讓設計檔案可以直接餵進 vibe coding 工具，設計師輸出 DESIGN.md，工程師的 AI agent 接著生對應前端。

▲ Stitch 的無限畫布：同一個 brief 同時展開多個方向（圖：Google Labs）

華爾街反應很直接。Stitch 2.0 公布當天，Figma 股價收跌 8%，是一個多月來最大的單日跌幅。Benedict Evans 那一週的 newsletter 寫：設計工具市場進入跟當年 photo editing 一樣的破壞循環。

Stitch 怎麼用、能做到什麼，我之前另外寫過一篇完整實作教學，這篇就不重複，聚焦在它對工作流意味的東西。

CHAPTER 04 · WORKFLOW

設計師工作流的真實重排

我自己過去半年實際把 Vibe Designing 跑進日常工作流之後，有些感受很具體。

舊的工作流是這樣排的：聊需求、寫 brief、畫 wireframe、跟工程師對齊、做 hi-fi mock、做設計系統、再跟工程師交付。每一段都吃時間。Hi-fi mock 之前的所有東西，本質上是為了避免後面修正的成本。

Vibe Designing 直接把這條鏈砍短一截。你的第一個 deliverable 不是 wireframe，是一份 hi-fi 的初稿——而且不是一個方向，是三到五個方向。整個探索期被壓縮到幾小時。

整套工作流長這樣：

我自己最有感的是第三步。AI 給你五個方向時，每個都看起來「好像沒問題」。那一刻你會發現，真正考驗的不是會不會用工具，是你看不看得出哪一個版本「不對」——對品牌來說、對 use case 來說、對使用者氣質來說。這個能力沒人 prompt 得出來，只能練出來。

你的角色從製作者往導演位移。手繪的部分被自動化了，品味、判斷、方向感變成被放大的東西。

CHAPTER 05 · TOOL MAP

工具地圖：四強各打哪一段

Vibe Designing 不是一個工具的事，是一條 pipeline。要把這條 pipeline 走完，你會在不同階段切換工具。Muzli 把 2026 的格局拆成四強，我認同這個拆法，加上 Figma 自家的 Make 跟 Weave，大致就是現在主流的工具光譜。

我目前的實際使用順序是：Stitch 探索方向 → 把選定的版本帶進 Figma 收細節 → DESIGN.md 餵給 Claude Code 處理前端。Stitch 不會取代 Figma，Stitch 會把「探索期」吃掉。

Figma 的策略也很明顯：Make 對應 vibe coding，Weave 對應 vibe media。Dylan Field 在 Welcome Weavy 那篇文章裡寫過一句很關鍵的話——AI 的 first prompt 是創意的起點，不是終點；在「夠好」已經是「平庸」的時代，要 stand out，只能逼自己超越 prompt。

CHAPTER 06 · LIMITS

限制與盲點（誠實版）

好文要欠讀者一份反證。這幾個是我自己跑下來最有感的限制。

Vibe Coding hangover 也會傳染到設計。Vibe Coding 過去一年最大的副作用，是工程團隊接手 AI 生成的 codebase 後，難以擴展跟維護，業界已經出現「Vibe Code Cleanup Specialist」這種工種。設計端類似：AI 生成的版面初看驚艷，放進真實的 design system 之後，token 不對齊、間距打架、accessibility 不過 WCAG。生成不是終點，治理才是。

設計系統治理仍然吃人力。NN/g 這幾個月反覆強調的事：user research、information architecture、accessibility 審計、design system governance，這些都還沒有 AI 替代品。Vibe Designing 改變的是「製作層」，不是「策略層」。

Quality 不穩。同一個 prompt 跑兩次可以給你完全不同水準的結果。複雜的多元件 layout 經常需要好幾輪迭代才到位。Stitch 自己也老實寫：目前不支援動畫、micro-interaction、custom component library 匯入。

Karpathy 自己一年後的補充也很重要。他在 2026 年 2 月寫了一篇 1-year retrospective，說那條原始推文本意是用 vibe coding 描述「throwaway weekend project」——一次性、低風險、可丟棄的場景。後來這個詞被泛用到 production-grade 系統，他自己更偏好的講法是 agentic engineering。Vibe Designing 同理：它對的是探索期，不是上線交付期。

CHAPTER 07 · WHAT TO DO

設計師現在該動的三件事

講完現象、講完限制，留下「我該做什麼」是這篇最該回答的問題。

第一，把意圖描述能力練到極致。以前一份好 brief 是 BD 跟 PM 的事，現在那是設計師核心競爭力。你會不會把「我想要 Stripe 那種 premium minimalism，但帶一點 Headspace 的呼吸感，適合中小企業財務人員，主視覺要傳達秩序而不是緊張」這句話寫得乾淨，直接決定 AI 給你的東西能不能用。模糊的描述換來模糊的方向，然後你就回到一個一個拉框的舊世界了。

第二，學會 token-driven thinking，把設計系統寫成 agent 可讀的格式。DESIGN.md 不是 Stitch 的私有規格，是一個方向的代表——設計系統未來要能被 agent 讀進去、被 agent 校驗（WCAG、色彩對比、間距規則），你的設計系統如果還是只能在 Figma 裡被人看，就會變 legacy。把 design token 拉出 Figma，寫成可以被工具串起來的東西，這件事今年該開始做。

第三，把職責往策略層拉。research、IA、accessibility、design system governance、品牌方向，這些是 AI 短期內取代不了的事。Vibe Designing 把「製作層」自動化，你的時間配比要主動往上移。我之前寫過一篇設計師價值在 AI 時代怎麼遷移，可以接著看。

CHAPTER 08 · TAKEAWAYS

收回到一句話

Vibe Designing 不是新的工具類別，是設計工作流的起點被重新定義。過去你從畫布開始，現在你從一段話開始。過去你做完 wireframe 才看到方向，現在你直接面對方向選擇。過去你的價值在「能畫出來」，現在你的價值在「看得出哪個版本對」。

Karpathy 那條 throwaway tweet 撐起了一年的程式語言；設計圈在這個春天接到了棒。我不擔心設計師被取代，我擔心的是：把這套工作流當成簡單的「快速生成」用，而不是當成新工作流去重新練自己的品味。

你的 vibe 是別人 prompt 不出來的——這句話才是這場運動真正的入場券。

SUBSCRIPTION · AIWAKEN

AI 覺醒設計應用攻略

AI 工具每週都在更新，我幫你過濾雜訊，只整理對設計師真正有用的應用。

✦ AI 工具實測與工作流

✦ 設計師角度 Prompt 技巧

✦ 每週 AI × 設計新知

了解訂閱方案 →

FAQ · 常見問題

常見問題

Q：Vibe Designing 跟 Vibe Coding 差在哪？

A：Vibe Coding 是把實作層丟給 AI，你停在意圖層。Vibe Designing 一樣是把製作層丟給 AI，但你要當品味的最後一道閘門——要選方向、判斷對錯、識別 AI 過度模板化的地方。設計師不會 vanish 進 vibe 裡，設計師被推到導演位置。

Q：設計師會被 Stitch 或 Vibe Designing 取代嗎？

A：被取代的不是設計師，是「設計師花在重複工作上的那幾個小時」。Adobe 2026 Creative Trends 報告顯示 58% 專業設計師每週使用 AI 工具，但 user research、IA、accessibility、design system governance 還是仰賴人的判斷。製作層被自動化，策略層的價值反而被放大。

Q：哪個工具最適合設計師入門？

A：Stitch。免費、瀏覽器打開就能用、Google 帳號登入即可，Vibe Design 模式跟 Voice Canvas 是入門最直觀的兩個切入點。每月 350 個免費生成，夠你練到把這個工作流跑熟。熟了之後再延伸到 v0、Lovable、Figma Make。

Q：Vibe Designing 適合做正式上線的產品嗎？

A：目前的成熟用法是「探索期用 Stitch，收尾回 Figma，前端交給 vibe coding 工具（Cursor / Claude Code）」。AI 生成的 UI 在 design system 對齊、accessibility 合規、複雜互動處理上仍有缺口，正式產品不建議跳過 Figma 收尾這一段。

Q：DESIGN.md 是什麼？要怎麼開始用？

A：DESIGN.md 是 Stitch 推出的一份 agent-friendly markdown 設計系統規格——色彩、字型、間距、元件規則都寫成可讀格式。Stitch 在四月把這份規格 open source 了，Cursor、Claude Code、Antigravity 都能讀。最快的入門方法是進 Stitch，讓它從你現有的網站 URL 自動萃取一份 DESIGN.md，再從那份 baseline 開始改。

Q：我已經是 Figma 重度使用者，有必要切換嗎？

A：不是切換的問題，是擴增的問題。Figma 在收尾、協作、設計系統治理上仍然強；Stitch 取代的是「探索期」那段。我目前的實際工作流是 Stitch 起手 → Figma 收尾。Figma 自己的 Make 跟 Weave 也朝同方向迭代，你會發現整個生態正在往「探索 AI 化、收尾人化」分工。

Q：Vibe Designing 對非設計師的創作者意義是什麼？

A：創辦人、PM、行銷可以用 Vibe Designing 把腦中的東西在幾小時內變成可點的 prototype，直接拿去做使用者訪談或 demo。意思是你不再卡在「找不到設計師檔期」這道牆上。但要做出真的 ship 得出去的產品，你還是會需要懂品味、懂治理、懂 accessibility 的人——也就是真設計師現在更值錢的地方。