Taste
產生一份能主動避免千篇一律 AI 審美的 DESIGN.md——經過校準的色彩、有辨識度的字體排印,以及明確的反模式清單。
這套優秀的 Agent Skill 由社群成員 Leon Lin 貢獻。
大多數 AI 產生的介面都會收斂成同一副模樣:過度飽和的紫色漸層、置中的三欄卡片、Inter 字型、捏造的統計數字。taste-design 技能會產生明確禁止這些模式、並強制執行高質感標準的設計系統。
什麼時候該使用 taste-design
| 技能 | 功能 | 理念 |
|---|---|---|
extract-design-md | 從原始碼反向推導 token | 描述性——記錄既有內容 |
design-md | 從既有 Stitch 螢幕擷取 token | 描述性——記錄既有內容 |
taste-design | 從概念產生設計系統 | 規範性——強制執行高質感標準 |
當你從零開始,想要一套超越 AI 生成平均水準的設計系統時,請使用 taste-design。
產生高質感 DESIGN.md
產出內容包括依品味光譜校準的視覺氛圍、嚴格的反模式規則、校準過的色彩科學、有主見的字體排印,以及彈簧物理動態規範。
色彩校準
色彩採用 HSL,並刻意節制飽和度。這反映了一項源自平面設計的原則:精緻的調色盤會以大面積使用低飽和色彩,並把高飽和度保留給小巧、刻意的強調元素。
技能強制執行的規則:
- 強調色飽和度保持在 80% 以下——不使用過度飽和的霓虹色
- 禁止純黑(
#000000)——改用 Zinc-950(#18181B)之類的類黑色 - 最多一個強調色——強制維持視覺紀律
調整調色盤
字體排印
技能採用音程比率來建立字級階層——也就是讓音程聽起來自然和諧的同一套關係:
| 音階 | 比率 | 特性 |
|---|---|---|
| 小三度 | 1.200 | 緊湊、資訊密集 |
| 大三度 | 1.250 | 均衡、用途廣泛 |
| 完全四度 | 1.333 | 寬裕、雜誌編輯感 |
| 黃金比例 | 1.618 | 戲劇性、高衝擊力 |
字型搭配規則:
- 高質感情境中禁止使用
Inter——過於普遍 - 推薦無襯線字型:
Geist、Outfit、Cabinet Grotesk、Satoshi - 推薦現代襯線字型:
Fraunces、Gambarino、Editorial New - 儀表板限制:僅限無襯線字型 + 等寬字型(
Geist+Geist Mono)
空間節奏
每個邊距、內距與間隙都是基礎單位的倍數(通常是 4px 或 8px)。這能創造出即使不對稱,肉眼仍感覺井然有序的空間關係。
調整密度
品味光譜從 1(輕盈通透)到 10(駕駛艙般密集):
較高密度會觸發用於對齊的等寬數字、以頂部邊框分隔線取代卡片、更緊密的間距比例,以及靠字體排印而非陰影區隔的平面。
品味評分標準
從四個面向評估你的 DESIGN.md。高質感設計在四個面向都要拿到 7 分以上:
| 面向 | 衡量內容 |
|---|---|
| 色彩精緻度 | 調色盤的節制、飽和度的紀律、對比度的刻意安排 |
| 字體排印工藝 | 字型的獨特性、字級的和諧、字重的階層 |
| 空間一致性 | 基礎單位的一致性、節奏、回應式縮放 |
| 視覺階層 | 清晰的主要/次要/三級層次、資訊架構 |
如果有任何面向感覺偏弱:
反模式檢查清單
定案之前,確認下列項目都不存在:
- ❌ 設計中沒有表情符號
- ❌ 不使用
Inter字型 - ❌ 不使用純黑(
#000000) - ❌ 不使用霓虹外發光陰影
- ❌ 不使用三欄等寬卡片版面
- ❌ 不捏造指標數據(「99.98% UPTIME」、「124ms AVG. RESPONSE」)
- ❌ 不使用 AI 文案老套字眼(「Elevate」、「Seamless」、「Unleash」)
- ❌ 不使用填充式 UI 文字(「Scroll to explore」、彈跳的箭頭符號)
- ❌ 不使用
LABEL // YEAR格式模式
原文: https://stitch.withgoogle.com/docs/skills/taste/
本頁翻譯自 Google Stitch 官方文件,原文版權歸 Google LLC 所有。本站為獨立第三方翻譯,與 Google 無關聯。