如何根据 Apple HIG 设计状态与进度 UI 组件 #

解决 UI 设计不统一的问题：通过引入 Apple HIG 的官方规范，让 AI 能够准确判断在不同场景下应使用确定性进度条、加载转轮（Spinner）还是状态栏，确保应用在 iOS/watchOS 上的原生体验。

为什么需要这个技能 #

在开发 Apple 生态应用时，进度与状态的表达方式直接影响用户的心理预期。如果将不确定的网络请求用百分比进度条表示，或者在不需要沉浸式体验的界面中隐藏状态栏，都会导致用户困惑。

本技能为 AI 提供了严格的判断逻辑：何时使用 Determinate（确定性）与 Indeterminate（不确定性）指示器、如何处理状态栏安全区域，以及如何正确使用 watchOS 的活动圆环。这避免了开发者在设计时凭感觉拍脑袋，确保产品符合 Apple 的工业设计标准。

适用场景 #

• 定义加载状态：当 AI 帮你设计某个功能模块的加载界面，需要决定是使用进度条还是加载转轮时。
• 状态栏适配：在设计全屏沉浸式页面（如视频播放、游戏）时，确定状态栏的可见性与样式。
• 健康类应用开发：在 watchOS 应用中设计运动目标追踪，确保活动圆环的颜色与逻辑符合 HealthKit 规范。
• 无障碍审计：检查进度组件是否支持 VoiceOver 播报及实时区域更新。

核心工作流 #

1. 分析操作时长与确定性：
   • 耗时 > 2 秒 $\to$ 必须显示进度指示器。
   • 时长/百分比已知 $\to$ 使用确定性进度条（Progress Bar）。
   • 时长未知 $\to$ 使用不确定性转轮（Spinner）。
2. 确定组件位置与层级：
   • 优先将指示器放置在内容即将出现的位置（Inline），而非使用模态弹窗。
   • 避免堆叠多个指示器，应将并发操作聚合为一个整体表示。
3. 状态栏与安全区域核对：
   • 仅在沉浸式体验中隐藏状态栏。
   • 确保交互元素不与状态栏重叠，严格遵守 Safe Area 规范。
4. 输出设计建议：
   • AI 将提供：组件类型建议 $\to$ 动画与时机指导 $\to$ 无障碍（Accessibility）实现方案 $\to$ 跨平台行为差异。

下载和安装 #

下载 hig-components-status 中文版 Skill ZIP

解压后将目录放入你的 AI 工具 skills 文件夹，重启工具后即可使用。具体路径参考内附的 USAGE.zh.md。

你可能还需要 #

暂无推荐