審美工程 · 8 / 12

生 UI:從形容詞到規格書

給 AI 提 UI 需求,形容詞是許願,規格是指令。同一個到達頁需求,三檔提示詞能差出三個檔次的產出;這一節教你把「好看」寫成一份 AI 沒法跑偏的規格書。

三檔對比規格書排印規格負向約束提示詞積木
形容詞是許願,規格是指令

「做個好看的到達頁」交出去,AI 會還你一個紫色漸變、居中堆料的大路貨。這口鍋 AI 只背一半:它沒拿到資訊,只能輸出訓練資料的平均值。Prompt 工程篇講過「資訊給一分,它答一分」,生 UI 是這條規律最直觀的展臺。主色寫死、間距鎖網格、字重限兩級、禁止項列清單,產出立刻換一個檔次。

動手 · 同一個需求,三檔提示詞
三檔提示詞,三種產出 三檔切換
來回切兩下,感受提示詞的資訊量怎麼變成產出的檔次。
提示詞做個好看的到達頁
untitled-project.vercel.app
AI 驅動 · 下一代平臺
重新定義生產力的未來
一站式 · 全場景 · 賦能每一個團隊
立即開始了解更多
已有 100,000+ 團隊的共同選擇
智慧
AI 加持
高效
極速體驗
安全
企業級
這就是「AI 預設味」。沒拿到資訊的 AI 輸出訓練資料的平均值:紫色漸變、玻璃卡片、居中堆料、口號文案。像每一個 AI 生成的頁面,就是不像你的產品。
排印有硬數字,抄就行

規格書裡最容易漏的是文字本身。介面十有八九是字,字出問題,配色再對也白搭。好訊息是排印早就有現成的硬指標,About Face 4 第 17 章直接給了數:對比度、字型、大小寫、字號,四條全能翻譯成提示詞。

對比度走 80%正文與背景的明度對比至少 80%。淺灰疊淺灰的「高階感」,使用者讀起來是罰站。
螢幕用無襯線襯線字型在螢幕上會發毛,正文一律無襯線;襯線只准出現在大字號的裝飾性標題。
英文別全大寫人靠詞形認字,全大寫把詞形抹平,又吵又難讀。層級靠字號和字重拉,別靠喊。
10px 是底線低於 10px 的字基本沒法讀。免責聲明也得讓人讀得見,再小就成了擺設。

還有米萊和薩諾那句判詞,About Face 4 原樣收進了教材:不必要的差異是一致設計的大敵。差不多一樣的東西,就做成一樣。寫進提示詞,它就是最值錢的禁止項。

動手 · 規格翻譯器

左邊是你嘴裡的人話,右邊是 AI 需要的規格。點一行翻譯一行,翻完整段複製走。

規格翻譯器 0 / 5
點左邊一句模糊需求,翻出右邊帶數值的規格話術;五句都翻完可以一鍵複製。
「字要看得清」
點選翻譯
「標題別那麼吵」
點選翻譯
「螢幕上要好讀」
點選翻譯
「別花裡胡哨」
點選翻譯
「顯得專業一點」
點選翻譯
動手 · 排印找茬
同一張卡,兩套排印 二選一
點你覺得更好讀的那張,對照上面四條規矩驗一驗。
A
teamly.app/pro
PREMIUM PLAN LIMITED OFFER
升級專業版解鎖高階報表與團隊協作功能,本週下單享受八折優惠。
優惠最終解釋權歸平臺所有,續費按原價結算,詳見條款。
B
teamly.app/pro
專業版限時特惠
升級專業版解鎖高階報表與團隊協作功能,本週下單享受八折優惠。
優惠說明:續費按原價結算,詳見條款。
動手 · 拼一份你自己的規格書

規格書不用背,六個條款各挑一塊就拼出來了。哪組選「不提」,哪部分就交回給 AI 賭運氣,預覽裡看得一清二楚。

提示詞積木機 即時拼裝
每組挑一塊,下方的提示詞跟著變;拼好點複製,直接發給 AI。
參考產品
主色
間距
字重
排印
禁止項
練一題再走
場景題:哪句約束最值錢 單選

哪句約束對 AI 生成 UI 的效果提升最大?

A要大氣上檔次
B配色要和諧
C禁止漸變、顏色只允許一個主色加中性灰
D參考大廠風格
三類條款,抄這三句
條款型別作用模板話術
正向規格把能量化的都定死,AI 沒得猜「主色 #DB2777,間距走 8pt 網格,圓角統一 12px,字重只用 800 和 600」
負向約束把 AI 最愛跑偏的路提前堵死「禁止漸變、禁止 emoji 圖示、禁止超過一種陰影」
參考錨點用雙方都見過的產品當座標「資訊密度參考 Linear,留白參考 Notion」;別說「大廠風格」,沒有指向等於沒說
統一性條款把「差不多一樣」提前統成一樣「差不多一樣的元素做成一樣:全站只允許一個主色、一套圓角、一種陰影,沒有理由的差異一律刪掉」

第四類就是米萊和薩諾那條「不必要的差異是一致設計的大敵」的提示詞版。AI 特別愛在細節上加戲:這裡 10px 圓角、那裡 12px,兩種灰、三種陰影。統一性條款把加戲的口子提前封死。

本節要點
✓

形容詞是許願,規格是指令:主色、間距、字重、禁止項,寫成能逐條驗證的條款。

✓

負向約束性價比最高:「禁止漸變、禁止 emoji 圖示、陰影不超過一種」,三句話砍掉大半 AI 味。

✓

排印有硬數字可抄:對比 80%、正文無襯線、英文禁全大寫、字號 10px 起,寫進提示詞就是四行驗收標準。

✓

下次生 UI,用積木機拼一段規格書發給 AI,跟上一次的「隨口一句」對比產出。

內容來源:小山學堂「審美工程」專題原創;部分設計原則整理自《About Face 4:互動設計精髓》第 17 章。