mcpField
D
design-anti-slop

design-anti-slop

github.com/prathameshagrawal设计与 UI540 次安装24 周前更新
代码仓库

关于 design-anti-slop

design-anti-slop 是面向 Claude 的设计技能,通过生成前简报和生成后审查,减少界面设计趋同。它提供三种按任务阶段选择的工作模式,并按概念、结构、视觉层级安排修正。

主要功能

  1. 01生成前收集具体设计简报
  2. 02审查现有设计的趋同问题
  3. 03按资产迭代打磨细节
  4. 04依据概念、结构、视觉排序修复
  5. 05按项目风险调整审查深度

适用场景

  1. 01生成落地页前明确风格与产品主张
  2. 02评估现有页面是否显得千篇一律
  3. 03在保留页面结构时增加视觉深度

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/prathameshagrawal/design-anti-slop --skill design-anti-slop

安装后在 Claude Code 中输入/design-anti-slop确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

patterns/
conceptual.md
structural.md
visual.md
workflows/
iterative-polish.md
post-gen-audit.md
pre-gen-brief.md

详细介绍

design:anti-slop

AI 设计同质化是一个具有审美症状的统计问题。语言模型会从训练分布的中心附近采样,因此如果没有具体约束,它们就会一遍又一遍地生成同样的落地页和仪表盘。这个技能的作用有两个,是单纯列出“禁用颜色”做不到的:

  • 在生成前强制明确具体要求,让模型除了分布均值之外,还有其他内容可供采样。
  • 在生成后检查是否趋同,从视觉、结构和概念三个层面进行审查,并在实际出问题的最深层进行修正。

这个技能不负责通用设计品味、无障碍设计或文案写作;它负责同质化的分类体系以及运用该分类体系的三个工作流。其他事项则交由相应流程处理。

何时选择某个模式

共有三种模式。它们的触发条件、用户体验和输出各不相同。不要将它们合并。

模式 A——生成前简报约束。 当用户要求 Claude 制作落地页、仪表盘或应用界面,且未提供风格简报时触发。触发信号包括:“为 X 搭建一个落地页”“给我做一个 SaaS 首页”“生成一个仪表盘”“制作一个主视觉区块的模型图”“为 Y 设计一个应用”。如果没有简报,请先阅读 workflows/pre-gen-brief.md 并按照其中的步骤操作,然后再编写代码。

模式 B——生成后审查。 当用户分享现有设计(截图、已部署的 URL、代码文件、Figma 链接、v0/Bolt/Lovable 输出),并要求审查时触发。触发信号包括:“这看起来像 AI 生成的吗”“点评一下这个设计”“这个页面有什么问题”“让它不那么普通”“吐槽一下这个落地页”,或者只提供截图而没有说明。请阅读 workflows/post-gen-audit.md 并按照其中的步骤操作。

模式 C——迭代润色。 当用户已经认可页面结构,并且想要更丰富、更有深度,而不是重新生成时触发。触发信号包括:“让它更好”“让素材更丰富”“增加一些层次感”“感觉还是很平”“再进一步”“还缺什么”。请阅读 workflows/iterative-polish.md。该流程以单个素材为单位(盘点 → 排序 → 从数据贫乏到数据丰富逐步强化 → 验证),禁止被动地用装饰性内容填充。

如果请求模糊不清——例如,用户粘贴草稿并说“改进一下”——默认采用模式 B。如果用户随后要求 Claude 从头重新生成,则切换到模式 A。如果用户认可结构,随后要求“深入一些”,则切换到模式 C。

如果请求只是临时尝试或探索——例如,“随便给我一个粗略版本,我想试试看”——则跳过简报约束,直接生成,但要说明采用了哪些默认选项(“你没有指定颜色,因此我使用了靛蓝色;确定配色后可换成语义色板”),让用户了解具体情况。

已保存的偏好与单个项目的简报

已保存到记忆中的长期偏好(“用户偏好温暖、编辑风格的配色”“用户不喜欢通用的 Bento 网格”“用户总是希望 H1 使用衬线字体”)是要复述并确认的默认项,而不是默默强制执行的约束。 适合上个月营销网站的偏好,可能并不适合本周的合规工具;默默套用这些偏好,会剥夺用户调整方向的机会。

在收集简报时,请明确提出已保存的偏好,例如:

你已保存的偏好是[温暖的编辑风格配色、不用 Bento 网格、H1 使用衬线字体]——我会在此项目中采用这些偏好,除非你希望有所不同?

在将这些偏好写入简报前,先等待用户确认(或调整方向)。应将已保存的偏好视为影响每个维度默认答案的先验信息,而不是答案本身。

模式目录

审计中使用的所有模式 ID 都位于三个同级文件中。需要查找某个模式的信号、根本原因或修复方法时,请阅读相关文件,不要试图凭记忆作答——这些条目存在的目的,正是确保修复有据可依。

  • patterns/visual.md — V1–V9。表层:颜色、字体、圆角、阴影、图标、色块、玻璃卡片、3D 黏土风插图。最容易检测,半衰期最短,单独来看也最弱。
  • patterns/structural.md — S1–S9。构成:主视觉模板、三栏功能网格、Logo 墙、Bento 网格、KPI 卡片行、带通用菜单的侧边栏。大多数粗糙设计实际上都出在这一层,而且其他大多数技能都会忽略这一层。
  • patterns/conceptual.md — C1–C7。文案与产品实情:空洞的愿景式标题、动词堆砌、缺乏观点、抽象的演示视觉、虚构数据、缺失的功能状态。如果第 3 层出了问题,第 1/2 层的修复只是表面功夫。

这三个文件彼此独立;当前审查只需阅读相关文件。

按层级而非易修程度排列修复优先级

如果设计在多个层级都有问题,人们往往会先修复视觉层,因为它成本最低。不要这样做。拥有出色的主视觉主张、真实的产品截图,以及 Inter + 靛蓝色的设计并不粗糙——只是视觉上不够独特,这可能并无大碍。而拥有完美的自定义配色系统、漂亮的字体,却用“打造工作未来”作为标题的设计,才是粗糙设计。

按以下顺序排列修复优先级,并告诉用户你选择了哪个层级以及原因:

  1. 优先修复概念层问题(第 3 层)。如果主视觉主张空洞,或演示内容抽象,应先修复这些问题,再调整样式。
  2. 接着修复结构层问题(第 2 层)。如果结构是“三栏网格 + KPI 行 + Logo 墙”,应先调整构成,再重新上色。
  3. 最后修复视觉层问题(第 1 层)。只有在更深层的问题已解决,或用户明确要求快速修补表面症状时,才处理这些问题。

要敢于说“这样没问题,不算粗糙”。如果什么都指出来,你就会失去可信度。干净利落的审查也是有效结果。

交接——此技能的范围本就有限

如果真正需要的工作属于其他技能,请说明并指出相应技能。不要在这里越俎代庖。

情况交接给
第 3 层文案问题(C1 空洞的愿景式主视觉、C2 动词堆砌、C6 虚假的具体性)超出局部修补范围design:ux-copy
跨页面一致性/同一产品中反复出现的千篇一律问题(S6)design:design-system
一般设计审查(层级、间距、对比度,以及与粗糙设计模式无关的交互状态)design:design-critique
审查中发现的无障碍问题(与 C7 缺失状态部分重叠)design:accessibility-review
用户想要的是不同的设计方向,而非修复当前设计design-ideation

对于希望长期解决问题的团队,最终的修复方案是制定项目专属的设计系统。适用时,请明确指出这一点——此技能只是权宜之计,而非一套系统。

如果此环境未安装所引用的技能,请直接在此处进行局部修补,并明确说明限制,例如:“这实际上应该交给 design:ux-copy;我会在这里快速改写,但更深入的文案审查不在此技能范围内。”

风险校准——运行工作流的范围

反目标要求“根据风险校准”。具体来说:

场景建议深度
面向客户的落地页(正式发布)模式 A,涵盖全部 5 个维度;如果已有完整的模式 B 审核,则进行审核
内部管理工具/仪表板模型模式 A,但仅涵盖主张和资产维度——排版/颜色/避免项通常按模板处理即可
临时探索性模型(“大致给我看看就行”)使用简短路径作为备用方案;不要进行访谈
一次性营销实验如果会向真实用户发布,则涵盖全部 5 个维度;如果只是临时拼凑的测试,则使用简短路径

这张表回答了“要不要做简报?”——不要临场发挥。

反目标——这项技能不是什么

这些内容至关重要。如果你发现自己开始偏离其中任何一项,请重新阅读本节。

  • 不是品味警察。 这项技能不偏好衬线字体胜过无衬线字体,也不偏好粗野主义胜过玻璃拟态,或任何特定美学。它标记的是趋同,而非潮流。
  • 不是钟摆。 “反 AI 俗套风格”(颗粒质感、溢出式字体、不对称混乱)本身正在成为新的吸引子。不要引导用户走向这种风格,而要引导他们走向具体性,具体体现为何取决于这位用户。
  • 不是一成不变。 目录中的每个具体模式都有其半衰期。当某种模式不再重要时——无论是底层默认设置发生了变化,还是潮流周期已经更迭——都要标记并更新文件。
  • 不只是禁用清单。 单纯否定只会产生更难看的俗套设计(禁用 Inter → 模型就会趋向 Space Grotesk)。每条模式都应包含改进方向,而不只是“避免”。
  • 不过度热心。 根据风险校准。快速临时模型不需要五维简报,而真正面向客户的落地页需要。
  • 不是检查清单。 目录不是一份“命中所有条目才算通过”的评分标准。命中一项确实的俗套问题,胜过五项模棱两可的问题;如果设计中出现一项明确的第 3 层问题,就标记这一项并停止,不要为了凑数而列出所有你能找到的 V 层匹配项。

请记住这一句话

目标不是让 AI 输出看起来更像手工制作,而是让 AI 输出体现这位用户对这款产品的具体意图。只要简报足够具体,俗套模式自然就会消失。

评论

支持 Markdown