ios-hig

Name: ios-hig
Author: pproenca

github.com/pproenca设计与 UI218299 次安装11 周前更新

代码仓库

关于 ios-hig

面向使用 SwiftUI 构建 iOS 应用的开发者，提供 Apple Human Interface Guidelines 实践规则，涵盖导航、交互、无障碍、反馈、UX 模式和视觉设计，并基于模块化 MVVM-C 架构约定。

主要功能

01覆盖 6 类 HIG 规则
02导航与交互设计建议
03无障碍与用户反馈指引
04UX 模式和视觉设计规则
05采用模块化 MVVM-C 架构约定

适用场景

01设计标签栏和层级导航
02检查 VoiceOver 与 Dynamic Type 支持
03规划加载、错误和空状态
04评审 iOS 应用的 HIG 合规性

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/pproenca/dot-skills --skill ios-hig

安装后在 Claude Code 中输入/ios-hig确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

metadata.json

assets/templates/

_template.md

references/

_sections.md

acc-color-contrast.md

acc-color-independent.md

acc-dynamic-type.md

acc-focus-management.md

acc-labels.md

acc-reduce-motion.md

acc-scaled-metric.md

acc-view-that-fits.md

feed-empty-states.md

feed-error-states.md

feed-loading-states.md

feed-notifications.md

feed-success-confirmation.md

inter-drag-drop.md

inter-gesture-patterns.md

inter-haptic-feedback.md

inter-keyboard-handling.md

inter-list-search.md

inter-pull-to-refresh.md

inter-swipe-actions.md

inter-touch-targets.md

nav-navigation-stack.md

nav-tab-bar.md

nav-toolbar-placement.md

ux-confirmation-dialog.md

ux-data-entry.md

ux-modality.md

详细介绍

Apple iOS HIG 最佳实践

全面指南，帮助使用 SwiftUI 构建的 iOS 应用符合 Apple 人机界面指南。包含 34 条规则，涵盖导航、交互设计、无障碍功能、用户反馈、UX 模式和视觉设计，共 6 个类别。

Clinic 架构约定（iOS 26 / Swift 6.2）

本技能中的所有指导均基于 Clinic 模块化 MVVM-C 架构：

功能模块仅导入 Domain + DesignSystem（绝不导入 Data，也不导入同级功能模块）
App 目标是汇聚点，负责管理 DependencyContainer、具体协调器和 Route Shell 连接
Domain 保持纯 Swift，并定义模型以及 repository、*Coordinating、ErrorRouting 和 AppError 契约
Data 负责 SwiftData/网络/同步/重试/后台 I/O，并实现 Domain 协议
读写流程默认采用过时数据优先、后台重新验证的读取方式，以及乐观排队写入
ViewModel 直接调用 repository 协议（默认不设置 use-case/interactor 层）

适用场景

在以下情况下，请参考这些指南：

使用标签栏、NavigationStack 或分栏视图构建导航层级
设计触控交互、手势和触觉反馈
确保 VoiceOver、Dynamic Type 和色彩对比度方面的无障碍支持
实现加载状态、错误处理和空状态
构建引导流程、权限请求和确认对话框
支持深色模式、SF Symbols 和标准布局边距
审查应用是否符合 HIG

按优先级划分的规则类别

优先级	类别	影响	前缀
1	导航	严重	`nav-`
2	交互设计	严重	`inter-`
3	无障碍功能	严重	`acc-`
4	用户反馈	高	`feed-`
5	UX 模式	高	`ux-`
6	视觉设计	高	`vis-`

快速参考

1. 导航（严重）

nav-tab-bar - 为顶层导航设计标签栏
nav-navigation-stack - 使用 NavigationStack 实现层级导航
nav-toolbar-placement - 使用标准位置在工具栏中放置操作

2. 交互设计（严重）

inter-touch-targets - 将触控目标的最小尺寸设为 44pt
inter-gesture-patterns - 使用标准手势模式
inter-haptic-feedback - 为有意义的事件添加触觉反馈
inter-keyboard-handling - 妥善处理键盘弹出
inter-drag-drop - 支持拖放传输内容
inter-pull-to-refresh - 为列表支持下拉刷新
inter-swipe-actions - 添加滑动操作以执行上下文相关操作
inter-list-search - 使用 searchable 实现内置搜索

3. 无障碍功能（严重）

acc-labels - 提供有意义的无障碍标签
acc-dynamic-type - 为所有文本支持 Dynamic Type
acc-color-contrast - 保持足够的色彩对比度
acc-reduce-motion - 尊重减少动态效果偏好
acc-color-independent - 绝不只依赖颜色传达信息
acc-focus-management - 为辅助技术管理焦点
acc-scaled-metric - 使用 ScaledMetric 实现自适应尺寸
acc-view-that-fits - 使用 ViewThatFits 实现自适应布局

4. 用户反馈（高）

feed-loading-states - 显示恰当的加载指示器
feed-error-states - 处理错误并提供清晰的恢复操作
feed-notifications - 谨慎使用通知
feed-success-confirmation - 以恰当的方式确认操作成功
feed-empty-states - 设计有帮助的空状态

5. UX 模式（高）

ux-onboarding - 设计精简的引导流程
ux-permissions - 在适当的情境下请求权限
ux-modality - 恰当使用模态
ux-confirmation-dialog - 对破坏性操作使用确认对话框
ux-data-entry - 减少数据录入阻力
ux-undo - 支持撤销破坏性操作
ux-settings - 以合乎逻辑的方式组织设置

6. 视觉设计（高）

vis-dark-mode - 使用语义化颜色支持深色模式
vis-sf-symbols - 使用 SF Symbols，并设置正确的渲染模式和字重
vis-layout-margins - 使用标准布局边距和安全区域

使用方法

阅读各参考文件，了解详细说明和代码示例：

章节定义 - 类别结构和影响级别
规则模板 - 添加新规则时使用的模板

参考文件

文件	描述
references/_sections.md	类别定义和排序
assets/templates/_template.md	新规则模板

支持 Markdown

登录后评论