Vibe Coding 的底層能力，是先看見系統再叫 AI 寫

今天想講講 Vibe Coding 的其中一個底層思維，你有沒有發現一件很弔詭的事？越來越多人在 Vibe Coding，但做出來的東西……比 AI 產文還更 AI 味？圓角適中、陰影適中、漸層適中，雖然強迫症很喜歡，但一切都『剛剛好』的結果就是沒有靈魂。

為什麼會有這種結果？因為 Vibe Coding 的過程，很多時候是讓 AI 去生一個『平均值』，大概就是大多數人都不會挑惕的那種。

你說一句：給我一個現代化的網頁，AI 就很乖給你一個沒有攻擊性、沒有想法、沒有文化背景的 Generic Modern。

嗯，無害，但也無聊。

也就是說，如果你不給 AI 一個 #真實的審美坐標，它永遠長不出你腦海想像的 vibe。

因為審美不是語言推理，審美是一種 #模仿系統，你要它模仿誰？決定了你最後能不能做出『不是 AI、而是活人扛出來』的界面。

這也是為什麼我從 12 月的 Vibe Coding 實踐指南的100種 Design System 裡，挑出一些比較常見的UI設計風格來作為配圖。

比如你只要開始把 AI 限定在真實存在的風格主題，它就會瞬間收斂原本發散又普通的設計，比如說：

① Linear：暗黑美學祖師爺級，1px 光邊、冷酷極簡

② Vercel / Geist：黑白宗教、排版精確到像拿尺

③ Grafana：NASA 控制室 vibe，霓虹折線

然後最好笑的但不可否認還是蠻多人使用的，Neobrutalism（Gumroad 風），完全呈現了醜到極致就是風格的態度😂 這配色穿在身上，絕對是馬路上的一道風景！！！

這些不是抽象美學，
而是「可操作的工程實體」。

你只要在 Prompt 裡丟一句：使用 Ant Design Pro 的高密度企業級排版，表格、分頁、篩選器都要到位。

或丟一句：用 Linear 風格，深色模式、1px 發光邊框、紫色重點。

AI 的態度會瞬間從『我不知道你要什麼，所以給你一個安全版本』變成『OK，你要模仿這個人？小德子馬上辦。』。

好，這麼多 UI 設計參考，到底要怎麼選？我不想教人照模板做 UI，
我想教的是：你要能看懂一個風格背後的 #隱含文化。

AntD 的文化？
→ 對岸企業、效率至上、工程帶頭。

Linear 的文化？
→ 極簡的新創宗教、快、乾淨、不囉嗦。

Notion 的文化？
→ 工程師的寫作儀式＋文青筆記學。

也就是說，UI Vibe Coding 不是在學外觀這層皮毛，而是你得知到這個世界每一種介面為什麼會長這樣？

．它是為誰誕生？
．它服務的使用者是誰？
．它的選擇是什麼文化邏輯？

這才是你跟別人不同的地方，而文化之所以重要，是因為你的作品到底想面向誰？這些用戶的文化背景又是什麼？這些會決定你的商業模式可以走到多遠。

你只要掌握：
① 真實世界的模板（Design System Name）
② 它的文化與需求背景
③ 它的關鍵構件（Key Component Vocabulary）

你大概率就可以擺脫那種平庸的網頁 Builder vibe。

所以，是的，Vibe Coding 可以長得跟別人完全不一樣。而這就是所有創作者會開始跟你不同的地方，因為你的邏輯比他們多兩層、深三尺，你的 UI 可以跟商模無縫接軌，你才能走得長久。

#VibeCoding

本文原發表於 2025/11/26 的 Facebook 貼文，原文照登，僅調整網頁排版；文中提及的產品、價格與活動以當時為準。