由社区维护、审核后发布,并在 Agent 页面创作前被 RAG 检索为设计约束。
Dashboard KPI 分诊把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
指标卡不是数字展览,而是运营分诊入口。86%Visual Foundationscomparison / layout比较布局清晰度把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
比较的价值来自同一维度上的差异可见,而不是对象本身卡片更漂亮。85%Visual Foundationsdetail / object对象详情布局把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
详情页应围绕对象身份、状态、关键属性和可执行操作组织,而不是平均展示所有字段。85%Visual Foundationsdata / charts数据墨水优先级把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
图表和指标的视觉墨水应该先服务数据、阈值和异常,而不是装饰网格。85%Visual Foundationshierarchy / focus焦点经济把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
焦点越多,真正的重点越弱;视觉强调必须稀缺且服务主任务。85%Visual Foundationsmedia / crop媒体裁切意图把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
图片是信息对象,不只是纹理;裁切错误会损害信任和理解。84%Visual Foundationsmap / geospatial地图与地理空间布局把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
地理空间界面的核心是位置、范围、对象和选择状态之间的同步。84%Visual Foundationscharts / dashboard可读 Dashboard 图表把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
运营图表经常被快速扫读,小图可读性比表现形式更重要。84%Visual Foundationsactions / context上下文操作位置把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
按钮位置会被用户理解为作用范围:行内、卡片内、区块级、全局操作不可混淆。84%Visual Foundationsdensity / content内容密度阶梯把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
密度不是页面整体属性,而是随任务深度变化的阶梯。84%Visual Foundationsgrid / breakout网格中的突破区域把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
少量突破网格的媒体或证明区能制造节奏,但主体信息仍要回到稳定对齐。84%Visual Foundationsmotion / hierarchy用动效表达层级把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
有用的动效让用户理解发生了什么、从哪里来、要看哪里。84%Visual Foundationslayout / container全宽与容器布局选择把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
页面宽度本身就是信息架构决策,不能所有内容都塞进同一个最大宽度。84%Visual Foundationsicons / affordance图标与文字可供性平衡把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
图标不是万能语言;可供性来自图标、标签、位置和反馈共同作用。84%Visual Foundationsempty-state / onboarding空状态构图把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
空状态不是插画占位,而是用户进入工作流的第一步。84%Visual Foundationsdisclosure / layout空间渐进披露把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
渐进披露不只是隐藏内容,而是在空间上安排任务入口、关键结果和高级选项的先后层级。84%Visual Foundationsgrouping / labels视觉分组与标签把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
复杂页面中的分组需要短标签、稳定位置和可扫描边界来降低理解成本。84%Visual Foundationsrhythm / sections区块节奏变化把一个高频界面判断转成可执行约束,帮助 Agent 在生成前做出更具体的布局、交互或可访问性选择。
长页面需要在密度、对齐、媒体比例和留白上变化,但不能换掉整个设计系统。84%Visual Foundationscontainer / boundary容器边界用于表达对象和区域,不应变成页面装饰的默认手段。
边界、底色和阴影都在传达层级,过多容器会让页面显得碎。82%Visual Foundationsmodules / rhythm重复模块能降低认知成本,但需要用内容层级和节奏避免机械单调。
相同结构适合相同任务;变体应来自内容优先级,而不是随机样式。82%Visual Foundationsscan / layout页面应该支持用户按预期路径扫读,而不是让视线在多个焦点之间跳动。
视线通常沿标题、关键数据、分组和操作移动,布局应顺着这个路径组织。82%Visual Foundationswhitespace / structure留白不是空着,而是用空气建立分隔、呼吸和注意力路径。
有效留白能减少边框、分割线和装饰,让用户自然理解区块关系。82%Visual Foundationsdensity / dashboard高密度不是拥挤;低密度也不等于高级。密度要匹配用户任务频率和决策速度。
运营工具需要可扫描密度,营销页需要叙事节奏,两者不能混用。82%Visual Foundationsvisual-weight / balance颜色、面积、粗细、位置和阴影都会增加视觉重量,需要服务任务优先级。
视觉重量不是越大越好;它应该把注意力分配给最重要、最可操作的区域。82%Visual Foundationsalignment / layout对齐让用户少花力气理解页面边界、内容归属和操作对象。
多个微小的不对齐会迅速让界面显得不专业,即使颜色和字体都正确。82%Visual Foundationsspacing / rhythm少量可重复的间距刻度能让页面安静、可预测,也能减少 UI 临时感。
间距应表达结构关系,而不是凭感觉逐项微调。82%Visual Foundationsgrid / layout网格不是装饰线,而是决定内容跨度、对齐、响应式重排和密度的规则系统。
稳定网格能减少临时摆放,让复杂页面在桌面和移动端都保持结构感。82%Visual Foundationsgestalt / consistency看起来相同的元素应承担相同功能;功能不同的元素必须有清楚差异。
视觉相似性会被用户解释为功能相似性,混用样式会制造误读。82%Visual Foundationsgestalt / grouping距离决定归属:相关元素靠近,不相关元素拉开,分组比边框更先发生。
用户会先依据空间距离判断元素是否属于同一组,边框和标题只是第二层确认。82%Visual Foundationshierarchy / layout先确定用户要先看、再看和最后行动的内容,再决定字号、间距、颜色和组件强度。
有效界面不是把所有信息平均展示,而是用大小、位置、密度和对比建立清晰的阅读顺序。82%