资讯动态

Hallmark 反模式清单(Anti-Patterns):如何按名识别并修复 AI 生成界面的 43 个“指纹“

发布时间:2026/9/10 14:45:48 来源:尧图企业网站定制
Hallmark 反模式清单Anti-Patterns如何按名识别并修复 AI 生成界面的 43 个指纹【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmarkHallmark 是一套面向 Claude Code、Cursor、Codex 等 AI 编码助手的反 AI 味道设计技能其核心是让模型产出的界面看起来是做的而不是生成的。hallmark audit动词会按名字逐一标记本文列出的每一个反模式——这些模式是 AI 生成 UI 的签名特征。本文完整继承 anti-patterns.md 的全部条目并结合仓库中的 slop-test.md、verbs/audit.md、typography.md 等配套规范讲清每一条是什么、为什么被一眼识破、怎么修。判定逻辑看到一个算问题看到两个算实锤反模式清单分为三个严重级别hallmark audit输出时也按此分级Critical严重直接以 slop 形态发布——ships as slopMajor明显一眼 AI 生成——looks AI-generatedMinor轻微品味小瑕疵——small taste issues判定规则只有一条同一个视图中看到一条反模式是问题看到两条就是确认。audit动词的完整执行契约见 verbs/audit.md对每一条发现报告命名反模式名、文件路径与行号区间、严重级别、一行修复建议按严重级别分组最后给出N critical · M major · K minor计数与三选一结论ships as slop / reads as AI-generated / close, fix the minors。Criticalships as slop这些是训练数据中最常见的 AI 美学模型几乎必然默认产出属于第一优先级修复对象。The purple-gradient hero紫渐变 herohero 区背景用紫色到蓝色、或紫色到粉色的渐变配白色居中文字。这是单一最具辨识度的 AI 美学。修复只选一个锚定色相anchor hue、一个强调色hero 上不使用渐变背景。想传达温暖就为中性色染色tint而不是叠加渐变。参见 color.md § 原则无纯色极端、无紫到青/紫到蓝/橙到粉渐变——每个 LLM 都会选这些。Inter-everywhereInter 打天下Inter或 Roboto、Open Sans同时充当 display 与 body 字体没有任何搭配字体。单字体页面 模板页面。修复用一个有辨识度的 display 字体搭配一个精致的 body 字体。参见 typography.md § The 21 rule——页面最多三种字体族display body 一个可选 outlier仅限 wordmark、hero 数字、pull quote 等不超过两个位置。该文件同时列出被禁止的默认字体Inter、Roboto、Open Sans、Lato、Poppins 等均在禁令名单上与替代目录Fraunces、Geist、Bricolage Grotesque、Cabinet Grotesk 等。The 3-column feature grid三等分特性网格三个等宽列每列图标在上、两行标题居中、三行正文在下通常全宽展开、24px 间距。Every LLM emits this——所有大模型都会吐这个。修复打破网格。变化列宽、混合卡片高度、删掉一张卡片改用负空间、把图标移到行内而非上方或者干脆放弃卡片、改用排版节奏。该条与 macrostructures.md 中结构性多样性的诉求一脉相承——页面形状差异来自结构而非配色。Card-in-card卡片套卡片一个带边框的容器里面放卡片或一张卡片里再套一张微卡片。视觉嵌套没有任何语义理由。修复只保留一层包含关系。通常该删的是外层那层。The gradient headline渐变标题标题用background-clip: text填充线性渐变通常紫到粉、或蓝到青。这是比几乎所有东西都更快的AI 生成信号。slop-test 门5直接自动失败该模式Universal — no genre allows gradient text见 slop-test.md。修复纯色墨迹。想让标题有生命力用字重、斜体或 display 字体——而不是渐变填充。typography.md § Bans 同样明确No gradient text on headings。The side-stripe card侧边条纹卡片卡片一条边有粗彩色边框通常左侧、4–6px、紫色或绿色。辨识度极高2018-SaaS-AI 味十足。修复四周细发丝线hairline、或干脆无边框、或在标题旁放一个小色块。永远不要不对称粗条纹。Full-viewport centred hero满屏居中 heromin-height: 100vh或100dvh一切居中一句短文案一个大 CTA。这是 LLM 落地页的默认形态。slop-test 门7自动检查heromin-height: 100vhwith everything centred仅 atmospheric 与 playful 体裁在 canvas 本身即设计时豁免。修复让 hero 高度等于内容高度向左或向右偏置放多于一句话的内容。与之配套slop-test 门53hero 居中之物不得超过两件、门54hero 下内边距应 ≥ 上内边距的 1.3 倍进一步约束 hero 结构。Pure black, pure white纯黑纯白#000000背景或#ffffff表面都显得扁平、合成感强。修复向锚定色相染色。color.md 给出具体配方Paper 用oklch(96–98% 0.005–0.015 hue)浅色或oklch(12–16% 0.008–0.015 hue)深色Bans 列出无纯#000000、无纯#ffffff作基础表面、无零色度平面灰至少 0.005 色度。slop-test 门8也将其列为视觉门仅 modern-minimal 允许纯白纸面。Default-attractor sameness默认吸引子同质化同一项目中连续两次 Hallmark 输出用了同一个 macrostructure第一次产出左边距编号标签 巨型衬线 不对称跨列Specimen第二次原样照搬。页面看起来重新设计了只是因为文案变了。为什么失败Hallmark 存在的全部意义就是让两个不同 brief 的两个页面感觉像不同的网站而不是同一个模板的换色。跨输出重复 macrostructure是模板化的结构指纹——这正是 Hallmark 要消灭的 AI 特征。修复写代码前先在项目 CSS 中查找/* Hallmark · macrostructure: name · ... */印记。若已存在本次选择必须是不同的 macrostructure——在可能的情况下做到类别级不同衬线引导的 editorial 结构搭配无衬线引导的网格结构而不是两个 editorial 变体。21 个命名结构见 macrostructures.mdSKILL.md 的Diversification rule (mandatory)还要求主题在 Paper band / Display style / Accent hue 三个轴向上至少与上次差一项。Specimen fall-throughSpecimen 级联跌落在 brief 并未明确要求 editorial / foundry / specimen 气质时仍产出 Specimen 结构左边距数字标签如01 — HELLO. 巨型衬线 不对称跨列 发丝线 纯排版 CTA 偶发手绘 SVG 点缀。这是被重复最多的 Hallmark 输出也是这个技能看起来只有一种形状的原因。为什么失败Specimen 在 editorial brief 下是漂亮的模式用在 SaaS 定价页、开发者工具、电商或个人应用上看起来就是AI 默认了——因为它确实默认了。修复Specimen 只是 macrostructures.md 中 21 个结构之一不再是默认值。brief 含糊时从该文件前十个中选Bento Grid、Long Document、Marquee Hero、Stat-Led、Workbench、Conversational FAQ、Manifesto、Photographic、Quote-Led最后才是 Specimen。只有当 brief 明确说 editorial、specimen sheet、type foundry 或点名 Specimen 主题时才用它。slop-test 门23自动检查此跌落。The AI navAI 导航Logo 靠左、4–5 个行内文字链接Features · Pricing · Docs · Blog · About居中或靠右、CTA 按钮靠右、全宽、滚动吸顶、白底、1px 发丝线底边。这是辨识度最高的 AI 导航指纹——每个 LLM 都会产出因为喂给训练数据的每个 SaaS 站都这么写。为什么失败这个形状对体裁无感genre-blind用在婚礼摄影师作品集、面包店、B2B SaaS 和 manifesto 上都是一个样。导航无法告诉你这是哪种网站页面就是模板。修复查 component-cookbook.md § Navigation 的路由表按体裁选择 N5–N9Floating pillmodern-minimal / atmospheric、Newspaper mastheadeditorial、Brutal slabplayful、Terminal commandCLI、Edge-aligned minimalluxury / quiet。仅当页面确实只有 2 个目的地且路由表允许时才用 N1并在注释中写一行理由。slop-test 门51对 AI 默认导航自动失败除非 brief 明确证明 N1 合理。The AI footerAI 页脚4 列链接Product · Company · Resources · Legal 社交图标行 最底部版权行 1px 发丝线顶边 中性灰背景。数千个页面完全相同的标准 SaaS 页脚。为什么失败与 AI 导航同理形状对体裁无感。面包店没有 Resources 栏editorial 页面没有四链接 Legal。页脚应该收束页面而不是罗列它不存在的站点地图。修复查 component-cookbook.md § Footers 路由表。默认选 Ft1 Mast-headed、Ft2 Inline single line、Ft4 Dense colophon、Ft5 Statement、Ft6 Letter close、Ft7 Newsletter-first 或 Ft8 Marquee scroll。只有在真正的 hub 或 docs 根页确有站点地图时才用 Ft3 Index columns且即便如此也绝不配社交图标行 微小版权尾巴。slop-test 门52对 AI 默认页脚自动失败。Aurora-blob background极光斑点背景紫色到粉色到青色的流动有机网格斑点叠在 hero 文字后面。看起来高级直到你在 2022 年以来每一张 Dribbble 作品里都见过它。为什么失败这是 2022–2023 生成设计的默认值。观众毫秒级模式匹配AI 模板。修复纯色表面或微妙两停 CSS 渐变 SVGfeTurbulence颗粒透明度 0.1。配方见 hero-enrichment.md E7——filter idgrainfeTurbulence baseFrequency0.9 numOctaves2//filter135° 两停渐变双色相度均 0.04、mix-blend-mode: multiply、颗粒 0.06 透明度、仅限 hero、无动画。不是极光、不是紫到青网格、不是漂浮球体要点是几乎看不见的纸感纹理。slop-test 门31亦约束抽象背景超过一个强调色、面积超过约 5%、或整页动画网格即失败。Floating-orb decoration漂浮球体装饰hero 背后漂浮的通用 3D 球体或模糊彩色圆通常为了增加深度。它们没有任何语义角色。为什么失败通用 3D 氛围感是新的企业库存照片。它暗示这里需要点东西所以加了点东西。修复删掉。hero 不需要深度需要的是强排版锚点。Sound-on autoplay带声音自动播放自动播放且带音频的 hero 视频。浏览器反正会拦截但意图重要一个没有muted的视频元素是一个想对用户大喊的视频。slop-test 门30与 LCP 门一并检查视频。为什么失败对观众有敌意可访问性失败SEO 惩罚浏览器拦截。修复video autoplay muted loop playsinline——四个属性必须全有。若声音确实有用另设独立音频开关按钮。Lazy-loaded LCP对 LCP 元素懒加载对 hero 图片或视频即 LCP 元素加loadinglazy。页面要等用户滚动到它才开始下载而用户正盯着它——于是页面空在那里。文档给出数据懒加载的 LCP 图片 p75 为 720ms预加载为 364ms——慢约 2 倍糟糕体验多约 4 倍。为什么失败拖垮 Largest Contentful Paint。修复LCP 元素上加fetchpriorityhigh与preloadmetadata只有首屏之下的媒体才懒加载。slop-test 门30将此写死demo 视频若缺poster、缺fetchpriorityhigh、或对 LCP 元素用loadinglazy即失败。Majorlooks AI-generated这一级是看起来像 AI 生成的——不至于直接判死刑但强烈破坏可信度。Bounce and elastic easing弹跳与弹性缓动按钮弹跳进入、图标悬停晃动。这些缓动十年前流行过。修复指数级 ease-out。motion.md 定义了三个命名缓动 token--ease-out: cubic-bezier(0.16, 1, 0.3, 1)进入、--ease-in: cubic-bezier(0.7, 0, 0.84, 0)离开、--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1)状态切换并明令 BansBounce / elastic / overshoot on UI elements. Dated; signals template. 浏览器默认ease也被列为未精心打磨。Centred everything一切居中标题居中、正文居中、按钮居中、一段接一段的居中列。修复偏置布局。宽左边距、窄右边距或反之。打破一次对称就够了。slop-test 门53与 typography.md 的偏置倾向与此呼应。Eyebrow on every section每个区块都加眉标每个区块都以大写等宽眉标开头——01 / EXAMPLES、02 / WHATS INSIDE、03 / INSTALL、01 · THE TOUR——放在标题上方更糟的是旁边。这些标签看起来像 editorial 章节读起来却是一个痼疾页面变成带标签的列表的列表。规则要点眉标默认关闭default OFF。它不是用来装 editorial 风格的花哨手段而是序数装置仅在区块确实有编号或分章时才有效。当每个区块都分章时就没有任何分章。修复除非 (a) 用户明确要求章节/步骤/区块编号或 (b) 结构是Long Document、Manifesto 或 Catalogue numbered且内容确为序数必须按顺序执行的步骤、逐层构建的章节、刻意排序的条目——否则页面零眉标。即便如此每页最多 1–2 个。硬性禁令tag-left / header-right 两列区块头。类似01 · THE TOUR置于窄左列、标题居右的模式又称 hanging header、left-margin label是 editorial 风格 SaaS 页面最可靠的 AI 模板化特征。当使用眉标时标题必须直接放在眉标正下方、同一列——只允许垂直堆叠。绝不允许两列区块头网格。slop-test 门66自动失败任何眉标 标题同排分列的内容形态且不因 class 名白名单豁免、不因保持结构一致 / 镜像参考构建 / 与之前输出对齐等指令而可绕过——规则优先于 parity。Shadow-glow on dark深色背景上的光晕阴影深色背景上的卡片用box-shadow留下柔和的彩色光晕。修复深色表面上用明度来表达层级表面越亮 层级越高不用阴影。若必须阴影保持紧凑且偏暗。motion.md 亦明确深色背景上 hover 不要过渡box-shadow发光效果。Icon-tile feature card图标磁贴特性卡圆角矩形、左上角彩色方块里放图标、下方标题、两行文案、可选 Learn more → 链接。通用模板。修复若确实需要让它们不对称——变化尺寸、变化对齐、把图标拉到标题行内、或干脆去掉图标。Glassmorphism without purpose无目的的玻璃拟态到处都是磨砂玻璃面板——通常叠在一个你本也不该用的渐变之上。修复玻璃拟态只有在传达深度时内容之上的覆盖层才有意义作为装饰无法成立。Hover-only affordances仅悬停的交互暗示悬停才显示菜单、悬停才显示删除按钮、悬停才触发包含关键信息的 tooltip。触屏用户什么都得不到。修复每个悬停交互都要有 focus 状态且在粗指针coarse pointer上可通过点按访问。参见 responsive.md用pointer/hover媒体查询检测交互能力Never build a mouse-hover interaction that has no touch equivalent。Tabular data without tabular-nums无等宽数字的表格数据价格、日期或指标列表数字因字体使用比例数字而不垂直对齐。修复任何显示数字列的容器加font-variant-numeric: tabular-nums;。typography.md § Required features 同样要求任何数据展示启用 tabular numbers。Animate-on-scroll on everything一切滚动即动每个区块进入视口都淡入每个列表都交错。页面永远静不下来。修复只挑一个编排好的入场动画其余内容就在那里。motion.md 的页面加载编排给出了具体做法用 CSS 自定义属性按 DOM 索引交错animation-delay: calc(var(--i, 0) * 60ms)总交错上限约 500ms。Mismatched icon sets混搭图标库导航栏用 Material Icons、特性卡用 Heroicons、页脚用 Lucide、hero 徽章里放一个 emoji ✨。每个库有自己的描边声线混用就是图标集特征。为什么失败图标就是排版。你不会让一个页面用三种正文字体就不要让它用三种图标描边。修复每项目只选一个图标库。SaaS 默认 Lucide、需要字重变体用 Phosphor、Tailwind/shadcn 项目用 Heroicons。canon 见 assets.md。slop-test 门32自动检查混用两个以上图标库。AI-illustration lookAI 插画感无关节铰接的光滑网格斑点角色、2010 年代中期现代扁平库存姿势、对称默认布光的 Midjourney 式构图。手绘 SVG 小人一只眼睛比另一只大的涂鸦人也归此类——corporate-doodle 是 2010 年代末 Slack/Figma 营销模板。为什么失败毫秒级读出 AI。2026 年的观众比任何其他特征都更快地匹配它。修复用纯 CSS 或 SVG 手搭插画hero-enrichment.md 的 Tier A 或 Tier B。若必须生成用 Nanobanana 2 或 Recraft V4 配合参考图、非对称裁剪与颗粒后处理——绝不使用裸输出。参见 custom-craft.md Tier E。Invented metrics编造指标Stat-led 布局、对比行或 proof bar 携带用户从未提供的数字——10× faster、saves 5 hours per week、trusted by 50,000 teams、99.9 % uptime、47 % conversion。模型为了填统计位而编了一个数。为什么失败观众识别编造的统计与识别编造的推荐一样快。在 proof bar 上撒谎的页面其主张同样不可信每个编造数字都读作这是生成的不是写的。修复按优先级三种方案(1) 用—加标注灰色块替换数字metric to confirm / stat pending(2) 向用户索要真实数字并暂停本次运行(3) 重建区块、去掉 proof 位——没有真实统计的 stat-led 结构就是选错了结构。数字形状的空位是诚实的编造的数字是 slop。该条对应 slop-test 门56honest copy并与 SKILL.md 的Honest copy — no fabricated content纪律直接挂钩。Generic emoji as feature icon通用 emoji 作功能图标特性卡、价值主张、步骤号或定价层级用✨⚡✅作为主图标。sparkle hero 徽章在眉标旁放✨。用 emoji 顶替图标库因为模型没选一个。为什么失败emoji 由操作系统渲染、各设备不同它破坏了图标描边声线你把 Phosphor 风格线图标和 Twemoji 团子混在一起而且这选择本身可辨识为 AI 默认。Sparkle-emoji-as-AI-shortcut 是 2024–2025 时代的陈词滥调。修复选一个图标库并落地assets.md 列出 canon或手搭自定义 SVG 标记或干脆省略图标、以排版领衔——大多数功能列表根本不需要图标。对应 slop-test 门60。Re-drawn UI chrome重绘 UI 铬件用假浏览器栏URL 胶囊 红黄绿圆点包截图用假手机框圆角矩形 刘海 听筒缝包移动端 mockup用假代码窗口假标题栏 最小化/关闭圆点包pre用假 IDE 铬件文件标签页 活动栏包编辑器截图——全部用 HTML/CSS/SVG 手搭。为什么失败用户已经有铬件了——他们的浏览器、手机、IDE 本身就是铬件。在页面里重绘它等于在一幅真实画框里放一张画框照片。而且造假也拙劣URL 是错的、圆点不是 macOS 圆点、刘海形状不对。观众一眼就模式匹配AI 发明了一个已存在的 UI。修复用真实截图包在figure里最多加发丝线边框。手机 mockup 用厂商透明 PNG 设备框或真实产品照片——绝不用 CSS 画框。代码块用系统pre加排版式边框顶线 标签 底线不用伪造窗口铬件。页面的工作是展示内容不是模仿操作系统。对应 slop-test 门57也是 SKILL.md 四项跨动词纪律之一Re-drawn chrome forbidden。Mid-render token improvisation渲染中途令牌即兴发挥主题在运行开始时选定但产物里出现不在令牌块中的内联颜色值#5b6cff、oklch(74% 0.18 245)、rgb(...)或font-family声明。或者产物带主题令牌集外加一个塞进 hover 态、focus ring 或单条边框的额外 hex。模型选了主题然后跑偏了。为什么失败令牌纪律是系统与自由发挥的分界线。主题一旦锁定文件里每个颜色、每种字体都必须引用命名令牌var(--color-accent)、font-family: var(--font-display)。内联值是凝聚力流失的方式——编辑三轮后页面从三色变成八色支撑主题的克制感荡然无存。观众看不见内联值但能感到那种松散。修复产物中每个颜色、每种字体都必须经var(--token-name)输出。需要令牌不存在的值时先把新令牌加进令牌块--color-accent-warm: oklch(...)再引用。渲染中途不允许内联 OKLCH 或一次性 hex。对应 slop-test 门58并与 SKILL.md § Locked tokens 纪律一致SKILL.md。Wrap-to-two-lines clickable text可点击文本折成两行按钮标签、导航链接、页脚链接、面包屑或 CTA 因视口变窄、标签过长而折行。视觉上交互部件像坏了——读者分不清换行是否有意。最糟的情况第二行只有一个词free、more、started读起来像样式错误。为什么失败可点击交互部件是一行对象。两行标签拖慢扫读、破坏行的垂直节奏按钮变高而兄弟按钮不变并暴露这个页面没在这个宽度下测试过。这是响应式纪律的特征。修复按优先级(1) 缩短标签——Get started free → Start freeRead the documentation → Read docs大多数 CTA 标签太长(2) 对交互部件设white-space: nowrap让父 flex 容器重排(3) 窄宽度下用hiddenuntil-found或display: none丢弃非核心导航项(4) 阈值以下把导航折叠进 sheet/菜单。绝不让主 CTA 或导航链接折行。对应 slop-test 门59完整修复序列见 responsive.md § Clickable text — never wraps。Lottie shortcutLottie 走捷径纯 CSS 或手搭 SVG 明明能做得更强更轻却去取 LottieFiles 社区动画——旋转 logo、对勾绘制、加载 spinner、loading dots 循环。为什么失败Lottie 拉取是 2023–2024 的 AI 工具捷径观众现在已如此解读。50–500KB 的 JSON 文件加运行时开销是对一个 CSS 零字节就能完成的活的征税。修复自建。旋转 logo → CSSkeyframes rotate对勾 → SVGstroke-dasharray动画loading dots → CSSpropertyanimation-delay。Lottie 在增强层级中是 Tier F——最后手段仅用于真正需要关节动作的角色动画层级见 hero-enrichment.md。Three.js for a still object为静止物体上 Three.jsWebGL hero 里的 3D 不靠可交互性证明自己。一个用户不能碰、不能转向、不能定制的静止旋转模型——只因有人想要 3D。为什么失败100–300KB 的 Three.js 包、模型、纹理、GPU 计算——全为一个静态照片或 SVG 就能搞定的事物。修复用户不能操控它它就不配 Three.js。用静态照片或手搭 SVG。Microinteraction tellsAI 生成动效的命名特征这些是 AI 生成动效的特征。完整目录与配方见 microinteractions.md。transition-all所有属性都在动画包括应瞬时的visibility、focus ring。修复明确列出属性如transition: background-color var(--dur-short) var(--ease-out), transform 100ms var(--ease-out)。slop-test 门11自动检查。Universalhover:scale-105每张卡片悬停都抬起没有阴影变化、没有缓动、没有目的。修复每元素只给一个信号——1px 位移、或颜色变化、或下划线加粗绝不四样全上。门12、门14。Bouncy overshoot easings on UIcubic-bezier(0.34, 1.56, 0.64, 1)用于按钮、模态、tooltip。修复overshoot 只留给真实物理交互拖放释放UI 状态用 motion.md 的--ease-out。门13。Animated hover gradients背景渐变悬停时在色彩空间中滑动。修复删掉或选一种颜色变化瞬时。Cursor follower dots落后于指针的拖尾圆点。修复删掉。Auto-rotating carousels with no pauseWCAG 2.2.2 失败。修复仅手动前进或悬停/聚焦暂停或默认禁用自动播放。门19。Celebratory success toasts用户刚保存了一个看得见已保存的东西弹Done!。修复静默成功。toast 只用于失败、效果不可见的异步动作、以及用户确实需要的明确确认。门17。Confirmation dialogs for reversible actions删除单行数据前问确定删除。修复乐观删除 5–10 秒 Undo toast。模态只留给不可逆的破坏性操作且用输入名称确认不是点 OK。Tooltips with the same delay on hover and focus两者都延迟 800ms。修复hover 延迟 800–1000msfocus 延迟 0ms——意图不同时机不同。门18。Focus rings that animate infocus ring 200ms 淡入——过渡开始阶段键盘用户没有任何指示。修复focus ring 必须瞬时出现永远如此获得焦点时不过渡outline或box-shadow。门16。Toasts that shift layout新 toast 把内容推下去消失又弹回来。修复固定定位、堆在视口角落新 toast 到来时旧 toast 不动。Universal scroll-triggered fade-up每个区块都在交叉观察时淡入页面从不安静。修复首次加载只做一次编排好的入场此后内容就在那里。Spinners that flash快速动作完成时 spinner 只出现 50ms。修复延迟显示150ms 后才显示或强制最小可见时长显示后至少 300ms布局已知时用骨架屏而非 spinner。动效的总体纪律见 motion.md只动画transform与opacity、三档时长Micro 100–150ms / Minor 200–300ms / Major 300–500ms、退出约为进入的 75%、prefers-reduced-motion下所有空间运动塌缩为 ≤150ms 透明度交叉淡入。Minorsmall taste issues这一级是小的品味问题单个无害积累起来却很显眼。Straight quotes直引号正文里的Hello与word。说明没人校对过。修复弯引号Hello、word。typography.md § Required features 同样要求规范标点。Double-hyphen dashes双连字符正文中该用 em-dash 的地方用了--。修复—U2014。Three periods instead of ellipsis三个句点冒充省略号正文中的...。修复…U2026。Placeholder names占位人名Jane Doe、John Smith、Example User。修复用贴近受众的可信占位名或从种子 faker 生成Maya Okonkwo、Sam Tan、Elena Ruiz。slop-test 门20直接失败 Jane Doe / John Smith / Acme 等。Startup-cliché product names创业公司陈词滥调产品名Acme、Nexus、Pulse、Unleash、Seamless、Supercharge。修复具体命名。演示项目用领域内占位名——Maple Weekly、Ridgeline Inventory——不要玩创业公司名字宾果。z-index: 9999随意的巨大 z 值。修复用六级命名刻度。参见 layout-and-space.md--z-base: 1·--z-raised: 10·--z-dropdown: 100·--z-sticky: 200·--z-modal: 400·--z-toast: 500·--z-tooltip: 600。Every section padded the same每段内边距相同所有区块的上下左右内边距全相等。修复变化——收一个、放一个。100vw widthswidth: 100vw用在任何东西上都会在可见滚动条的桌面上溢出。修复width: 100%加容器内边距。responsive.md § Viewport units 明确100vw在桌面包含滚动条导致溢出高度交互用dvh/svh/lvh。hallmark audit如何报告从清单到可执行结论清单最后定义了审计动词的标准输出契约同时见 verbs/audit.md 的完整协议。对每条发现[severity] Tell name — file:line why its a tell (one line) → fix (one line)然后是汇总Summary — N critical · M major · K minor Verdict — [ships as slop | reads as AI-generated | close, fix the minors]audit还执行三项扩展检查结构指纹检查即使视觉处理没问题只要页面使用 AI 模板居中 hero、3 张等分特性卡、CTA、页脚无不对称无意外就标记为 critical 结构发现。印记 vs 页面一致性检查stamp-vs-page若被审计文件含/* Hallmark · macrostructure: name · ... */印记需验证页面确实匹配。印记写 Bento Grid 实际却是居中单列 hero CTA标记为 critical 结构发现stamp lies——这能捕获上次印记了某结构、后续编辑把页面拉回 AI 模板的漂移。体裁感知与design.md审计印记带体裁如genre: atmospheric时按 slop-test.md 的体裁覆盖规则评级——editorial 里径向渐变是 criticalatmospheric 里被允许纯白纸面在 editorial 是特征、在 modern-minimal 被允许。项目根有design.md时先读它再评级令牌/字体/强调色不符标记为critical: design-system drift越出design.md结构族标记为major: outside design.md family印记撒谎标记为critical: stamp lies系统管理项目缺印记标记为major: missing system reference。与 69 道 slop-test 门禁的对应关系anti-patterns.md 是生成前的检查表这些是你绝不能产出的命名特征而 slop-test.md 是交付后的 69 道门禁每个答案都必须是 no两者一一咬合渐变标题 ↔ 门 5、满屏居中 hero ↔ 门 7、纯黑纯白 ↔ 门 8、AI 导航 ↔ 门 51、AI 页脚 ↔ 门 52、transition-all↔ 门 11、悬停放大 ↔ 门 12/14、focus ring 动画 ↔ 门 16、编造指标 ↔ 门 56、重绘铬件 ↔ 门 57、令牌即兴 ↔ 门 58、折行可点击文本 ↔ 门 59、emoji 图标 ↔ 门 60、眉标分列 ↔ 门 66。SKILL.md 将Honest copy、Locked tokens、Re-drawn chrome forbidden、Mobile responsiveness四项纪律列为跨动词硬规则audit、redesign、study与默认设计流程一视同仁。实操建议把本文当作生成前的自查单与审计时的评分卡。每产出或接手一个页面先按 Critical → Major → Minor 扫一遍再看audit的N critical · M major · K minor汇总任何 critical 都意味着页面以 slop 形态发布应当场修复而非辩解——因为清单里的每一条都是观众在毫秒级完成模式匹配的 AI 指纹。【免费下载链接】hallmarkAnti-AI-slop design skill for Claude Code, Cursor, and Codex.项目地址: https://gitcode.com/GitHub_Trending/hal/hallmark创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价