Taste

產生一份能主動避免千篇一律 AI 審美的 DESIGN.md——經過校準的色彩、有辨識度的字體排印,以及明確的反模式清單。

這套優秀的 Agent Skill 由社群成員 Leon Lin 貢獻。

Leonxlnx / taste-skill Star 可攜式 Agent Skills,強化 AI 打造的介面:更出色的版面配置、字體排印、動態效果與間距 Markdown Leonxlnx/taste-skill

大多數 AI 產生的介面都會收斂成同一副模樣:過度飽和的紫色漸層、置中的三欄卡片、Inter 字型、捏造的統計數字。taste-design 技能會產生明確禁止這些模式、並強制執行高質感標準的設計系統。

什麼時候該使用 taste-design

技能功能理念
extract-design-md從原始碼反向推導 token描述性——記錄既有內容
design-md從既有 Stitch 螢幕擷取 token描述性——記錄既有內容
taste-design從概念產生設計系統規範性——強制執行高質感標準

當你從零開始,想要一套超越 AI 生成平均水準的設計系統時,請使用 taste-design。

產生高質感 DESIGN.md

PROMPT
Generate a premium DESIGN.md for a high-density financial analytics dashboard using the taste-design skill.

產出內容包括依品味光譜校準的視覺氛圍、嚴格的反模式規則、校準過的色彩科學、有主見的字體排印,以及彈簧物理動態規範。

色彩校準

色彩採用 HSL,並刻意節制飽和度。這反映了一項源自平面設計的原則:精緻的調色盤會以大面積使用低飽和色彩,並把高飽和度保留給小巧、刻意的強調元素。

技能強制執行的規則:

  • 強調色飽和度保持在 80% 以下——不使用過度飽和的霓虹色
  • 禁止純黑(#000000)——改用 Zinc-950(#18181B)之類的類黑色
  • 最多一個強調色——強制維持視覺紀律

調整調色盤

PROMPT
Adjust the DESIGN.md accent color to a deep teal (#0D9488) and warm the neutrals toward sand tones.

字體排印

技能採用音程比率來建立字級階層——也就是讓音程聽起來自然和諧的同一套關係:

音階比率特性
小三度1.200緊湊、資訊密集
大三度1.250均衡、用途廣泛
完全四度1.333寬裕、雜誌編輯感
黃金比例1.618戲劇性、高衝擊力

字型搭配規則:

  • 高質感情境中禁止使用 Inter——過於普遍
  • 推薦無襯線字型:Geist、Outfit、Cabinet Grotesk、Satoshi
  • 推薦現代襯線字型:Fraunces、Gambarino、Editorial New
  • 儀表板限制:僅限無襯線字型 + 等寬字型(Geist + Geist Mono)
PROMPT
Use Outfit for display headlines and Geist for body text with Geist Mono for data.

空間節奏

每個邊距、內距與間隙都是基礎單位的倍數(通常是 4px 或 8px)。這能創造出即使不對稱,肉眼仍感覺井然有序的空間關係。

調整密度

品味光譜從 1(輕盈通透)到 10(駕駛艙般密集):

PROMPT
Generate a DESIGN.md at density 8 — this is a monitoring dashboard that needs to display many metrics simultaneously.

較高密度會觸發用於對齊的等寬數字、以頂部邊框分隔線取代卡片、更緊密的間距比例,以及靠字體排印而非陰影區隔的平面。

品味評分標準

從四個面向評估你的 DESIGN.md。高質感設計在四個面向都要拿到 7 分以上:

面向衡量內容
色彩精緻度調色盤的節制、飽和度的紀律、對比度的刻意安排
字體排印工藝字型的獨特性、字級的和諧、字重的階層
空間一致性基礎單位的一致性、節奏、回應式縮放
視覺階層清晰的主要/次要/三級層次、資訊架構

如果有任何面向感覺偏弱:

PROMPT
The typographic hierarchy feels flat. Increase the weight contrast between headlines and body, and add letter-spacing differentiation.

反模式檢查清單

定案之前,確認下列項目都不存在:

  • ❌ 設計中沒有表情符號
  • ❌ 不使用 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 無關聯。