antislop-ui

antislop-ui

Anti Slop：面向 AI 编码 Agent 的规则。UI 与视觉技能

属于 antislop 系统的一部分。请与核心文件 antislop.md 一起阅读。本技能深入探讨 UI/视觉方面：颜色、布局、组件、装饰、结构流程和动效。它按编号引用核心规则，不会重复或重新编号。构建或编辑网站、Web 应用或任何界面时，请加载本技能。

如何使用本技能

• 只要任务涉及 UI 或视觉工作，就与 antislop.md 一起加载。核心文件包含机制（目的测试、三个层级、交付门槛）；本技能则深入介绍 UI 特定内容。
• 每条内容都采用相同结构：表现（这种模式）、原因（为什么看起来像粗制滥造）、修正（应采取的做法），并引用对应的核心规则 R-XX。
• 核心文件中的交付门槛仍是最终门槛。本文件末尾的“UI 技能检查清单”是 UI 专属补充，应与之同时执行。

视觉与颜色

常见的蓝紫渐变

• 表现： 将蓝到紫、蓝到青，或紫到粉的渐变作为主要配色，或使用覆盖整页的彩色光晕。
• 原因： 这是训练数据中过度常见的配色方式。它传递的是“没有品牌标识”，而不是“我们的调色板”，一眼就会让设计显得由 AI 生成。
• 修正： 从 DESIGN.md 或产品自身的品牌形象中提取调色板。仅在渐变承担层级功能且记录了使用理由时保留渐变（R-01）。用于区分层级的渐变体现了设计功力；每个区块都用同一种渐变则只是默认做法。
• 同类默认配色： 刺眼或彩虹渐变、紫黑配色、霓虹或粉彩配色，以及主视觉后方模糊的径向光斑。它们只是换了外衣的同一种表现：颜色来自模型的默认偏好，而非品牌。若无明确目的，全部禁止作为默认方案（R-01）。

过度使用玻璃拟态

• 表现： 导航栏、卡片、模态框和侧边栏同时使用模糊或 backdrop-filter。
• 原因： 模糊会抹去纹理，使所有表面都处于同一层磨砂效果中，从而削弱层级。当每个表面都像玻璃时，就没有任何元素处于前景。
• 修正： 将玻璃效果作为点缀，而不是设计特征。用量上限：最多用于 1-2 个元素（R-10）。需要吸引注意的表面使用玻璃效果；其他部分保持纯色。

过度使用圆角

• 表现： 每个元素都呈胶囊形：按钮、输入框、卡片、徽章、模态框。
• 原因： 统一的胶囊形会抹去“这是输入框，这是卡片”的视觉语言。圆角沦为装饰，而非层级工具。
• 修正： 在设计系统中设定少量圆角规格，并有意识地应用（R-11）。主 CTA 使用一个较大的圆角会显得经过刻意设计；每个元素都使用相同圆角则像是默认设置。

阴影过于柔和

• 表现： 每个组件都有大范围阴影，让整个页面看起来都浮在空中。
• 原因： 当所有元素都被抬高时，抬高就不再传递任何信息。页面失去基准平面，变得千篇一律、缺乏力度。
• 修正： 仅将阴影用作高度标记，并记录设置该高度的理由（R-12）。大多数元素应平铺在页面上；只有一两个需要浮起的元素才添加阴影。

到处使用光晕

• 表现： 卡片、按钮、图标、徽章、背景和边框同时带有光晕。
• 原因： 光晕会放大注意力。到处使用就等于什么也没放大，而且这是让设计看起来“像 AI 制作”的最快方式之一。
• 修正： 将光晕保留给最多 1-2 个重要元素，作为焦点点缀（R-13）。其他部分保持哑光。

背景网格

• 特征： 内容背后有网格方块、蓝图线条、方格纸、点阵网格或纤细的重复线条。
• 原因： 这是让扁平页面显得“技术感十足”的默认做法，却没有真正解决任何问题。它只是纹理，没有明确意图。
• 改进： 只有在纹理或图案确实有助于体现产品身份时才使用，并写明理由（R-07）。真正的品牌识别图案（核心部分 3）永远胜过现成网格。

毫无理由地默认使用深色模式

• 特征： 整个页面仅仅因为看起来“有科技感”就采用深色，没有考虑品牌。
• 原因： 深色是一种选择，不是默认设置。强行采用深色模式，显得是在追随潮流，而不是服务产品。
• 改进： 根据品牌形象、产品类型和受众选择主题（R-21）。开发和创意工具确实有理由采用深色主题；以内容为先的产品通常没有。如果没有充分理由固定主题，就实现可用的明暗模式切换开关。

调色板中的颜色过多

• 特征： 一个页面上有 5-7 种不同颜色，却没有明确的设计系统。
• 原因： 杂乱的调色板没有层级。当每个元素都能使用任意颜色时，就没有什么元素能脱颖而出。
• 改进： 将当前使用的调色板限制为 2-3 种核心色 + 1 种强调色（R-29），并让一种核心色作为中性色基底。克制才能让强调色真正发挥作用。

过度使用强调色

• 特征： 同一种强调色同时用于按钮、图标、徽章、链接、线条、背景和光效。
• 原因： 强调色一旦无处不在，就不再是强调色。它只会变成另一种普通颜色，设计也会失去焦点。
• 改进： 强调色只应出现在关键之处（有意使用一种强调色，核心部分 3）。完全不用强调色会显得乏味；处处使用强调色则显得粗糙。选出一两个真正需要它的地方。

呆板的默认风格

• 特征： 纯白或近白色背景、细灰色边框、小圆角、没有纹理、通用字体、缺乏个性。
• 原因： 这是在没有方向的情况下过度过滤后得到的“安全”结果。它不算粗糙，但也称不上设计：该有设计的地方只剩一片空白。
• 改进： 这是方向问题，而不是过滤问题。添加 DESIGN.md 或明确设计方向（核心部分 3），然后调高活力刻度。解决方法绝不是增加更多禁令，而是明确目的并注入活力。

布局与组件

单调的模板布局

• 特征： 每次都按相同顺序排列：主视觉区、副标题、2 个 CTA、截图、功能网格、用户评价、常见问题、CTA、页脚。
• 原因： 这种顺序是训练数据中的默认模式，并非产品叙事所需。某个版块出现，只是因为模板里有，而不是内容需要它。
• 改进： 根据实际内容需求构建结构（R-05、C-3）。如果产品没有用户评价，就不要设置用户评价版块。版块顺序应遵循产品的故事。匹配 RHYTHM 刻度：如果数值为 3，各版块就应明显有所变化。

复制粘贴式功能卡片

• 特征： 所有功能卡片的尺寸、高度、图标、布局和内边距都完全相同。
• 原因： 统一的卡片会淡化内容。当每项功能都用带图标的卡片呈现时，真正重要的功能和不那么重要的功能看起来就毫无区别。
• 改进： 创建能体现内容层级的变化，并写明理由（R-14）。不是每项功能都需要用卡片呈现。旗舰功能可能值得采用全宽布局，辅助功能则可以用列表呈现。

Bento 网格

• 特征： 由大小各异的卡片组成的拼贴式区块，部分卡片横跨两列或两行，像平铺的仪表板一样填满空间。
• 原因： 这是近几年默认的“类应用”落地页布局，因此无法体现产品特色。当每个区块都可以做成 Bento 网格时，这种布局就成了模板，而不是经过考量的选择。
• 改进： 只有在内容确实包含需要以不同尺寸展示的元素时，才使用 Bento 网格（R-05）。如果每个单元格大小都差不多，简单的网格或列表会更加诚实。RHYTHM 刻度决定各区块是否要有所变化。

间距统一

• 特征： 每个区块的内边距、外边距和间隔都完全相同。
• 原因： 节奏是一种工具，只有一种间距值会让节奏消失。各区块之间失去关联，整页看起来就像一条平坦的长带。
• 改进： 将留白作为结构的一部分（核心内容第 3 部分），并通过 RHYTHM 刻度调整。建立一套间距比例，再用不同层级来区分和连接内容。只有刻度明确要求时，才刻意使用统一节奏（R-05）。

“工作原理”总是 3 个步骤

• 特征： 圆形图标 + 数字 1、2、3 + 简短文字；总是三个步骤，形状也总是相同。
• 原因： 产品的真实流程很少会刚好是整齐的三步列表。这种模板强行让流程适应形状，而不是反过来。
• 改进： 按照流程的真实情况来呈现（R-05）。如果流程确实是三步，配上圆形图标也没问题；否则就采用真实工作流所需的形式，包括两步或五步。

“深受信赖”徽标栏

• 特征： 主视觉区块正下方排列着一排通用公司徽标。
• 原因： 这是一个没有证据支撑的信任声明：徽标泛泛而谈，没有列出真实客户，也没有使用证明。
• 改进： 只展示真实且可验证的徽标（R-18、R-36、C-5）。如果产品还没有这类客户，就不要伪造徽标栏。真实的社会证明永远胜过泛泛的证明。

“最受欢迎”定价卡片

• 特征： 总是用胶囊徽章突出显示中间的定价档位。
• 原因： 这是默认模式，也就意味着它并非经过考量的选择。当每个定价区块都这样做时，被突出显示的档位就失去了意义。
• 改进： 突出显示真正有助于实现产品目标的档位，并说明原因（R-31）。如果没有任何档位值得强调，就一个也不要突出。
• 三栏也是特征之一： 不论真实结构如何，定价都展示为三个档位，并突出中间档位。这种形式是默认设置，因此并非经过考量的选择（R-05）。根据产品的实际档位数量来展示，并突出最有助于实现目标的档位。

没有真实产品的演示

• 特征： 页面在推销产品，却从未展示产品实际运行的样子：没有真实演示、没有服务条款、没有隐私政策，只有承诺。
• 原因： 这只是穿着产品外衣的演示。每一项声明都毫无依据，缺失的法律页面则悄悄表明，实际产品尚不存在。
• 改进： 展示真实运行的产品，或者诚实说明产品尚未发布（R-38、C-5）。如果页面要求注册或付款，就必须提供服务条款和隐私政策。坦诚地说“即将推出”，胜过令人信服的演示。

四栏模板页脚

• 特征： 固定设置“产品 / 公司 / 资源 / 法律”四栏，没有任何变化。
• 原因： 设置这些栏只是因为模板有这些栏目，而不是因为网站确实有这么多组链接。
• 改进： 根据产品实际链接的内容来组织页脚（R-05）。一栏链接可能比四栏半空的链接更实用。

统一的章节节奏

• **表现：**每个章节都是居中的标题 + 副标题 + 相同的卡片网格，没有任何变化。
• **原因：**相同的构图会让各章节混在一起，页面显得重复而平淡。
• **改进：**用 RHYTHM 刻度（R-05）改变构图。在文字密集型和视觉型章节之间交替使用不对称和对称布局。每个章节都采用相同模板的页面，就是由模板设计出来的页面。

装饰元素

通用 AI 图标

• **表现：**把闪光、星星、魔法、闪电、钻石、立方体、机器人或 AI 光球用作功能图标。
• **原因：**这些图形是“AI 产品”的通用词汇，无法传达具体功能的信息。
• **改进：**使用与内容真正相关的图标；如果图形含义比较通用，就写明其相关性（R-04）。如果没有合适的图标，就不用。功能标签本身就能说明问题。

Lucide 图标

• **表现：**所有图标都来自同一个细线条、圆角图标库（Lucide 或视觉上相似的图标库），所以看起来都一样。
• **原因：**单一的默认图标库会让所有 AI 网站的图标变得相同，也就无法再体现产品特色。图形可能与内容相关；暴露出问题的是千篇一律的图标库风格。
• **改进：**图标集是一种视觉选择，而不是默认配置（R-04）。先根据相关性挑选图标，再判断图标库的粗细和笔画是否符合产品特征。即使两个图标看起来“差不多”，只要选择图标集是经过考量，而非直接导入，它们仍然可以展现你的风格。

用 Emoji 装饰

• **表现：**文案、标题、徽章和按钮中到处都是 Emoji：标题里放 🚀，每条功能要点旁放 ✅，CTA 上放 🔥，图表标题上方放 📈。
• **原因：**Emoji 是“这是生成出来的，不是写出来的”最显眼的速记符号。在 UI 中，它会与内容争夺注意力，并让产品的表达风格变得和其他 AI 网站一样，流于轻快活泼。
• **改进：**从 UI 文本中移除 Emoji。如果某个概念需要标记，就使用真正相关的图标并写明理由（R-04），也可以完全不用标记。文案负责传达含义；Emoji 毫无帮助。

每个按钮上都放小箭头

• **表现：**几乎每个按钮上都放 → 或 ↗，纯粹为了装饰。
• **原因：**箭头会变成一种模式，而不是信号。如果每个 CTA 都有箭头，那它们就都没有明确的指向。
• **改进：**箭头不是按钮的默认特征（R-08）。只有在确实能提供方向提示的操作上保留箭头，尺寸要合适，并写明用途。

左侧彩色竖条

• **表现：**卡片、列表行或章节标题左侧边缘有一条细彩色竖条，用作装饰。
• **原因：**竖条只增加颜色，不增加意义。这是让卡片“看起来经过设计”最省事的方式，因此到处出现，却毫无表达。
• **改进：**竖条是装饰；要么承载信息，要么去掉（R-01、R-31）。左侧边缘如果用于标记真实状态（激活、警告、新内容），就是一种信号。只为了显得经过设计而添加的竖条，就是默认套路。

AI 胶囊徽章

• **表现：**胶囊形状、细边框、发光效果、小圆点、大写文字，内容为“AI Powered”“Beta”“New”。
• **原因：**胶囊 + 发光 + 圆点的组合是一种自我指涉的徽章，只是在说“由 AI 制作，讲的也是 AI 制作”。它只会增加干扰，不会提供信息。
• **改进：**只有在功能上确有需要时才使用徽章，并写明使用理由；不要使用完整的组合（R-09）。真正的状态标签没有问题；装饰性的“AI Powered”胶囊则不行。

标题上方的眉题徽标

• 识别特征： 紧贴在 H1 上方的小胶囊标签，通常带有一个圆点和细边框，内容是类别标签（“中小企业账单应用”“团队协作平台”），而下方的标题已经表达了同样的信息。
• 问题所在： 徽标重复了标题的内容，因此只增加了一行阅读内容，却没有提供任何新信息。它在每个生成页面上都出现在同一位置，因此看起来像模板，而非经过斟酌的设计。当它还带有圆点时，就借用了状态指示器的表达方式，却用来标记毫无状态可言的标签。
• 改进方法： 删除徽标，让标题发挥作用。如果标签包含标题未表达的信息，就将其融入标题或副标题，让它作为内容呈现，而非装饰。首屏上方的徽标和其他徽标一样，需要有明确的书面理由（R-09）；其中的圆点也必须标记真实状态（R-31）。

装饰性状态圆点

• 识别特征： 标题、眉题、导航项或标签旁边的小彩色圆点，通常带有发光效果并循环脉动，却没有标记任何状态。它借用了在线或录制指示灯的视觉语言，却用在没有任何在线内容的页面上。
• 问题所在： 圆点只是吸引注意力，背后却没有任何依据：发光加上无休止的脉动，等于对一个并不存在的事实进行双重视觉强调。它看起来像 AI 生成的设计，因为生成的页面常把系统状态术语当作装饰，而同样的圆点也总出现在每个页面的同一位置。
• 改进方法： 圆点必须标记真实状态（活跃、在线、录制中、警告）。如果确实如此，就保留一个圆点，去掉发光效果和无休止的脉动（R-19）。如果它没有标记任何状态，就删除它：标题不需要指示器来证明自己是标题（R-31）。

泛化的 AI 排版

• 识别特征： 大号等宽字体标题，或字母间距极大的大写标签（“工作原理”“功能”）。
• 问题所在： 将等宽字体作为美学风格，以及使用宽字距大写文字，都是“技术感、现代感”的速成手段，并没有真正发挥排版的作用。
• 改进方法： 根据品牌个性而非模型的默认选择来挑选字体，并写明理由（R-06）。排版必须提升可读性并体现产品特征。有理由的字体选择总是胜过追赶潮流。
• 默认字体清单： 无衬线字体：Inter、Geist 和 Space Grotesk；等宽字体：Geist Mono、JetBrains Mono 和 Fira Code。它们都没有被禁止；只要有符合品牌的理由，每一种都可以使用。问题在于字体是因为默认选项而出现，而非因为适合设计（R-06）。

伪终端窗口

• 识别特征： 一个经过样式设计的终端窗口，带有红黄绿圆点、提示符行和输入的命令，用作主视觉或功能配图。
• 问题所在： 这是“这是一个开发者工具”的通用装扮。窗口只是装饰；真实产品通常并非如此。它看起来像真实截图的占位图。
• 改进方法： 如果产品确实是终端或命令行工具，那么真实可运行的截图就是有力证据。否则，应展示实际产品界面，而非装扮（R-06、C-5）。将等宽字体作为美学风格的问题已由 R-06 涵盖；伪终端只是这种模式在组件中的体现。

毫无关联的插画

• 识别特征： 与产品毫无实际关联的 Undraw、Storyset 或通用 3D 团块角色。
• 问题所在： 装饰性插画只说明设计经过了装饰，而非精心设计。它们填充空间，却没有为内容服务。
• 改进方法： 插画必须与产品直接相关，并写明这种关联（R-22）。如果不存在这种关联，就使用真实截图，或不使用插画。

结构与流程

无效导航

• 识别特征： 导航栏链接指向不存在的页面或版块。
• 问题所在： 无效链接就是无法兑现的承诺。用户一旦点击，信任便会立即受损。
• 改进方法： 每个导航项都必须有实际的目标位置（R-24）。如果某项功能尚未开发，就不要列出，或明确标注“即将推出”。导航栏应反映实际存在的内容。

非功能性控件

• 表现： 按钮点击无效、下拉菜单无法展开、表单无法提交。
• 原因： 视觉效果已经完成，但功能尚未实现。这就是模型稿与产品的区别。
• 修复： 每个交互元素都必须有实际功能，否则就将其移除（R-26）。如果某个元素确实没有目标位置，就提交清晰的 // TODO，并显示“即将推出”标签，否则不要发布。

填充模板的版块

• 表现： 某个版块的存在只是因为“每个 AI 落地页都有它”，而不是因为内容需要它。
• 原因： 模板版块是没有目的的内容。它们拉长页面，也分散重点。
• 修复： 每个版块都必须有产品内容作为存在的理由（C-3）。移除那些只是为了填充模板的版块。版块更少、目的明确的页面，比包含所有默认版块的页面更有力。

应用与仪表板

上面的模式是落地页的常见形态。以下是应用端的对应问题：当屏幕是仪表板、管理面板或任何已登录视图时，Agent 通常会直接套用的默认做法。它们违反的规则相同，只是形式不同。

默认仪表板框架

• 表现： 左侧边栏、顶部栏、四张统计卡片、一张图表、一张表格。在没有人询问屏幕用途之前就已选定，无论管理的是发票、患者还是服务器，布局都一模一样。
• 原因： 这是应用中的落地页模板问题：布局凭记忆挑选，而非根据屏幕所支持的工作来设计。只需替换标签，它就适用于任何产品。
• 修复： 说清屏幕的工作职责，以及用户要在其中做出的一个决策，然后围绕它构建层级结构（C-3、R-20）。如果屏幕的工作是“发现失败的任务并重试”，那么失败的任务才是页面主体，统计行只是脚注。那些仅仅因为仪表板通常都有才保留下来的版块，应予以删减（C-3）。

编造数字的统计卡片

• 表现： 一排四张卡片，显示 12,483 / 94.2% / $48.2K / 1,204，每张都有绿色的“本周 +12%”变化值。
• 原因： 这些数字只是装饰，而变化值更糟：它声称存在趋势，却没有任何数据序列作为依据。真实的仪表板既有重要指标，也有无关紧要的指标，因此四张卡片地位相同，本身就说明层级设计失败。
• 修复： 显示真实数字，否则就不显示（R-17、R-38）。让卡片连接真实数据，或者只展示那个真实存在的指标。只有在比较周期真实且明确标注时，才显示变化值。如果屏幕是原型，就在用户看得到的地方将数值标明为占位值（R-38）。

凑数的活动动态

• 表现： “Sarah Chen 于 2 小时前更新了一份文档”，搭配轮换出现的姓名和头像，反复展示。
• 原因： 虚构的人物、虚构的事件。这只是换了布局的客户评价版块，让空荡荡的产品看起来很热闹。
• 修复： 动态必须展示真实事件，否则就不要发布（R-18、R-38）。诚实的空状态胜过编造的动态，还能告诉用户首先该做什么（R-27）。

没有待回答问题的图表

• 表现： 因为页面看起来太空，就放上一张折线图或环形图，标题泛泛而谈（“概览”“性能”），也没有读者能据此采取行动的坐标轴。
• 原因： 图表应该提供答案。没有问题要回答，它就只是纹理，而且比一句话更耗费注意力。
• 修复： 先写出图表要回答的问题，再绘制图表，并将该问题写进标题（“过去 24 小时每小时失败的任务数”）。如果一句话能回答得更好，就写一句话（C-3）。图表分段与相邻分段之间的对比度仍须达到 3:1（R-25）。

通用表格列

• 表现： 列名是名称、状态、日期、操作之类的通用字段，不管行数据实际是什么；每一行都有一个三点菜单。
• 原因： 列是根据表格组件而非数据确定的。用户想查找决定下一步行动的字段，却发现表格里没有。
• 修复： 根据用户在这张表中要做出的决策来选择列，并将决定性字段放在靠前的位置。行菜单只保留确实存在的操作；无效操作应移除（R-26）。

字段和列中的填充数据

• **表现：**空表单字段和表格列中填入了虚假但看似合理的数据：John Doe、[email protected]、"Let's build something"、并不属于任何人的电话号码和日期。
• **原因：**伪造的内容被伪装成真实数据。在样稿中看起来没问题，但真实用户一看就露馅：这个名字不是客户，这个邮箱不是潜在客户，这条消息只是标语。这是最明显的迹象，说明这个界面是生成出来的，而不是实际构建的。
• **修正：**让空单元格保持空白，或使用明确说明应填入什么的占位符：Your Name、[email protected]、Drop your message here...，或者在需要填写值时使用 [REAL DATA]（R-23、R-38）。有了真实数据再填入。像 "Let's build something" 这样的通用填充文案属于空洞的流行语，不该出现在数据列中（R-16）。

占位式空状态和加载状态

• **表现：**显示一幅插图的 "No data available"、一个光秃秃的加载指示器，或一个模仿实际数据永远不会填满的布局的整页骨架屏。
• **原因：**R-27 要求提供这些状态，而这些实现从技术上说确实提供了。可它们仍然没有告诉用户任何信息：没有说明原因、没有下一步操作，也没有说明这是否正常。
• **修正：**空状态要说明为什么为空，并给出能填充内容的唯一操作（"No jobs yet. Run a sync to see results here"）。加载状态要说明正在加载什么。错误状态要说明出了什么问题，以及接下来该怎么做（R-27）。首次运行、筛选后无结果和权限被拒绝是不同的屏幕，表达方式也应有所不同。

动效

无限脉冲和循环动画

• **表现：**元素在没有用户触发的情况下永远脉冲、弹跳或浮动。
• **原因：**持续不断的动效只会制造干扰。它会与内容争夺注意力，也不会停下来让用户稍作喘息。
• **修正：**动效必须有明确的 UX 目的，并记录下来（R-19）。动画用于引导用户关注某个时刻，而不是循环播放。如果 MOTION 刻度为 1（仅悬停状态），无限循环动画就违背了已声明的刻度，属于不合格。

叠加模板动画

• **表现：**每个元素同时使用 Fade Up + Fade In + Floating + Scale + Bounce。
• **原因：**所有元素都在动的页面没有视觉焦点。动效会变成背景装饰。
• **修正：**根据目的和 MOTION 刻度编排动效（R-19）。不要让所有元素都动。主视觉部分可以表达内容，其余元素保持平静。声称采用“电影感”效果的页面必须真的动起来；声称采用“静态”效果的页面则不应动。

UI 技能检查清单

如果任务涉及 UI，请将此清单与核心交付门槛一同使用。所有答案都必须为是：

• 配色是否源自 DESIGN.md 或书面品牌标识，而不是默认渐变配色？（R-01、R-29）
• 是否只在关键时刻使用强调色，而非铺满所有元素？（核心第 3 部分，有意使用一次强调色）
• 文案是否没有在标题、项目符号和按钮中随意散布装饰性表情符号？（R-04）
• 各个版块的布局是否根据声明的 RHYTHM 刻度变化，而非重复同一模板？（R-05）
• 布局是否避开默认 AI 造型：便当盒网格拼贴、假终端窗口、三列定价布局，以及毫无意义的左侧边缘色条？（R-05、R-01）
• H1 上方是否没有放置标签胶囊，而其中的文字已在标题中出现？（R-09）
• 每个导航项和交互元素是否都有实际目标或行为，或者带有清晰可见的“即将推出”标签？（R-24、R-26）
• 动效是否遵循声明的 MOTION 刻度，并服务于书面说明的目的，且没有无限循环？（R-19）
• 玻璃质感、光晕、阴影和圆角是否控制在各自的用量上限内，而非全页默认使用？（R-10、R-11、R-12、R-13）
• 每个彩色圆点和状态指示灯是否都标示真实状态，且没有装饰性光晕或无限脉动？（R-13、R-19、R-31）
• 在应用屏幕上，布局是否围绕用户在此处要做的决策构建，而非默认采用侧边栏加统计行、图表和表格的布局？（C-3、R-20）
• 每个数字、变化量、动态条目和表格行是否都是真实内容或明确标注的占位内容，没有虚构指标？（R-17、R-18、R-38）
• 空表单字段和表格单元格是否保持空白或使用诚实的占位内容（Your Name、[email protected]），而非看似真实的虚假数据（John Doe、[email protected]）？（R-23、R-38）
• 空内容、加载和错误状态是否说明原因及下一步操作，而不是只说“No data”？（R-27）
• 页面是否在所有断点、主题和状态下都表现良好，并且支持仅用键盘操作？（R-03、R-34、C-4）