
关于
Apple 人机界面指南设计基础,涵盖颜色、排版、间距、图标和交互设计原则。
name: hig-foundations description: "Apple人机界面指南设计基础。" risk: unknown source: community date_added: '2026-02-27'
Apple HIG:设计基础
在提问前检查 .claude/apple-design-context.md。使用现有上下文,只询问未涵盖的信息。
核心原则
-
内容优先于装饰。 减少视觉杂乱。使用系统提供的材质和微妙分隔符,而非厚重边框和背景。
-
从一开始就内置无障碍性。 从第一天起就为VoiceOver、动态字体、减少动效、增强对比度和开关控制进行设计。每个交互元素都需要无障碍标签。
-
使用系统颜色和材质。 系统颜色适应浅色/深色模式、增强对比度和活力效果。优先使用语义颜色(
label、secondaryLabel、systemBackground)而非硬编码值。 -
使用平台字体和图标。 默认使用SF Pro、SF Compact、SF Mono。衬线体使用New York。按推荐尺寸遵循字体层次。使用SF Symbols作为图标。
-
匹配平台惯例。 使外观和行为与系统标准一致。提供直接、响应式的操作和每个动作的清晰反馈。
-
尊重隐私。 仅在需要时请求权限,清楚解释原因,在请求数据前提供价值。设计最小数据收集。
-
支持国际化。 适应文本扩展、从右到左书写和不同的日期/数字格式。使用Auto Layout进行动态内容尺寸调整。
-
有目的地使用动效。 动画应传达含义和空间关系。通过提供淡入淡出替代方案来尊重"减少动效"设置。
参考索引
| 参考 | 主题 | 关键内容 | |------|------|----------| | accessibility.md | 无障碍性 | VoiceOver、动态字体、颜色对比度、运动无障碍、开关控制 | | app-icons.md | 应用图标 | 图标网格、平台特定尺寸、单一焦点、无透明度 | | branding.md | 品牌 | 在Apple设计语言中整合品牌标识、微妙品牌化 | | color.md | 颜色 | 系统颜色、动态颜色、语义颜色、自定义调色板、对比度比率 | | dark-mode.md | 深色模式 | 提升表面、语义颜色、适配调色板、活力效果 | | icons.md | 图标 | 字形图标、SF Symbols集成、自定义图标设计、图标粗细 | | layout.md | 布局 | 边距、间距、对齐、安全区域、自适应布局 | | materials.md | 材质 | 活力效果、模糊、半透明、系统材质 | | motion.md | 动效 | 动画曲线、过渡、连续性、减少动效支持 | | privacy.md | 隐私 | 权限请求、使用说明、隐私标签、最小数据收集 | | right-to-left.md | 从右到左 | RTL布局镜像、双向文本、翻转图标 | | sf-symbols.md | SF Symbols | 符号类别、渲染模式、可变颜色、自定义符号 | | spatial-layout.md | 空间布局 | visionOS窗口放置、深度、人体工学区域 | | typography.md | 排版 | SF Pro、动态字体尺寸、文本样式、字重层次 | | writing.md | 文案 | UI文案指南、语气、大写规则、错误消息、按钮标签 |
综合应用基础原则
考虑原则之间的交互:
-
颜色 + 深色模式 + 无障碍性 -- 自定义调色板必须在两种模式下工作,同时保持WCAG对比度比率。从系统语义颜色开始。
-
排版 + 无障碍性 + 布局 -- 动态字体必须在不破坏布局的情况下缩放。使用文本样式和Auto Layout适应全范围字号。
-
图标 + 品牌 + SF Symbols -- 自定义图标应匹配SF Symbols的粗细和光学尺寸。品牌元素应整合而不覆盖系统惯例。
-
动效 + 无障碍性 + 反馈 -- 每个动画必须有减少动效的替代方案。反馈应通过多种通道传达(视觉、触觉、音频)。