ryux-ui

ryux-ui 是 RYUX 设计智能体系下的一个 UI 设计技能，归属 Group UI · Delivery Gate area UI · RX-2.0，其中层级定义位于 ryux-core。

用途 用于进行视觉设计或视觉细化，处理界面层级、字体、间距、布局、密度、色彩、容器、图像与动效等视觉问题。核心要求是区分功能性 UI 与装饰性 UI：功能性 UI 帮助用户阅读、决策或行动；装饰性 UI 需要给出明确理由（参见 ryux-anti-slop 中的目的闸门）。

主要能力与工作顺序

1. 层级：确定第一、第二、第三阅读顺序，主操作与关键信息优先。
2. 布局与对齐：使用共享网格，按含义分组，保持边缘一致。
3. 间距与字体：使用统一尺度，用字号与字重承载层级，而非仅靠颜色。
4. 密度：重复性工作用紧凑密度，首次使用或高风险决策用更宽松密度。
5. 色彩：先定义角色（表面、文本、主操作强调色、状态色），并检查对比度。
6. 容器：仅在需要分组或分隔时使用容器。
7. 图标：与标签相邻，来自同一套图标，尺寸一致。
8. 动效：只用于解释变化，时长简短，绝不阻塞操作。

取值需给理由 每个取值应来自尺度并能用一句话说明，例如“这两个字段之间 12px 因为它们属于同一组；下一组之前用 24px 因为是新主题”。组内更紧、组间更松，密度随任务而定。若说不出为何用 8 而非 12，则尚不构成决策。

规则要点

• RX-UI-01（必需，质量锁定）层级服从优先级：主操作与关键信息在每区域最突出，有单一明确焦点；不要平均加权或让装饰盖过内容。适用于多个平等对象的仪表盘时，可在每张卡片内使用一致层级。
• RX-UI-03（优选，质量锁定）统一间距与字体尺度：使用项目尺度或定义尺度（如 4 或 8 的倍数）并对齐共享网格；例外需书面理由。
• RX-UI-04（优选，质量锁定）带角色的调色板：少量颜色并定义角色（表面、文本、主操作强调色、状态色）；不要每组件引入新颜色或用强调色做装饰。数据可视化不适用，需自己的分类或顺序色板。
• RX-UI-05（优选）布局来自内容而非模板：根据内容、任务与参考屏选择布局，不要默认 hero、三张功能卡与 logo 墙；当用户预期的标准模式（设置列表、表格）契合内容时，熟悉度是正确选择。
• RX-UI-07（情境性）图像须名副其实：使用真实产品界面或明确为插画的图形；不要把陌生人图库照片呈现为客户或用户。

证据来源 可从可比屏幕提取设计方向（extract_design_direction，含模式、原则、陷阱及背后的 screen_ids）。没有 ryux MCP 时，应说明证据仅来自设计与标准本身。

硬性闸门 无论加载哪些技能，硬性闸门始终适用：不得编造数字、人物、紧迫感、业务规则或术语；不得将占位内容作为最终内容交付；不得缺少关键状态。详见 ryux-core。

限制 不覆盖组件复用与设计令牌（见 ryux-design-system）。