用途:视觉强调与层级(Visual Emphasis and Hierarchy)是一项界面设计技能,帮助确保用户第一眼看到屏幕上最重要的内容。它适用于设计按钮组、CTA、卡片、仪表盘,以及任何包含主操作的布局。
主要能力:以层级阶梯划分主、次、三级与禁用态操作:主操作用填充品牌色且是组内最大按钮;次要操作用描边或幽灵样式与中性色;三级操作用文字链接或不显眼的幽灵样式;禁用态用低对比度且无悬停态。强调手段包括大小、颜色、字重、对比度和位置,并强调同一视图或逻辑分区最多一个主操作。
颜色方面,品牌色用于主操作时应节约使用,状态色不应出现在主 CTA 上;若品牌色用作大面积背景(如首屏、横幅),该区域上的按钮与链接应改用白色或高对比中性色。对比度与留白规则:用高对比元素搭配充足留白形成焦点,并让次要内容退后。字重方面:加粗承载观点的 2 至 5 个词,每段至多一处,不要加粗单个孤立词(除非是徽章、表格标签等 UI 元素);在数据密集界面加粗关键指标或行标识。
文本置于图片上时,可用轻微文字阴影、深色蒙版或渐变、选择带负空间的图片、局部遮罩来保证可读性。位置方面:主操作常置于表单或对话框右下、页头右上;最重要内容置顶;警告置于受影响区域顶部;破坏性操作与建设性操作分开。数据密集视图应决定单一关键数字并放大呈现,其余数据可折叠或隐藏,且降级或隐藏的决策应验证。多步骤流程每步一个主操作;优先级按视图而非绝对。可交互元素必须使用 cursor: pointer,文本输入除外。结论下的说明文字应补充数量而非同义词。
限制:该资料为设计指导,不含具体平台或安装方式,也不涉及收费信息(暂未提供)。