mcpField
I
ios-hig

ios-hig

github.com/pproencaデザイン・UI218299 回インストール11 週間前に更新
リポジトリ

ios-hig について

SwiftUIでiOSアプリを開発する人向けの、Apple Human Interface Guidelinesの実践ガイドです。6分野のルールをまとめ、モジュール型MVVM-Cアーキテクチャを前提としています。

主な機能

  1. 016分野のHIGルール
  2. 02ナビゲーションと操作設計の指針
  3. 03アクセシビリティとフィードバックの指針
  4. 04UXパターンとビジュアルデザインのルール
  5. 05モジュール型MVVM-Cの設計契約

活用シーン

  1. 01タブバーと階層型ナビゲーションの設計
  2. 02VoiceOverとDynamic Type対応の確認
  3. 03読み込み・エラー・空状態の設計
  4. 04iOSアプリの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 Human Interface Guidelines 準拠のための包括的なガイドです。ナビゲーション、インタラクションデザイン、アクセシビリティ、ユーザーフィードバック、UX パターン、ビジュアルデザインの 6 カテゴリーにわたる 34 のルールを収録しています。

Clinic アーキテクチャ契約（iOS 26 / Swift 6.2）

このスキルのすべてのガイダンスは、Clinic のモジュール型 MVVM-C アーキテクチャを前提としています。

  • Feature モジュールがインポートするのは Domain と DesignSystem のみです（Data は不可、兄弟 Feature も不可）
  • App ターゲットは集約点であり、DependencyContainer、具象コーディネーター、Route Shell の配線を所有します
  • Domain は純粋な Swift を維持し、モデルと、リポジトリ、*Coordinating、ErrorRouting、AppError の各コントラクトを定義します
  • Data は SwiftData／ネットワーク／同期／再試行／バックグラウンド I/O を担当し、Domain のプロトコルを実装します
  • 読み取り／書き込みフローでは、デフォルトで stale-while-revalidate 方式の読み取りと、キューに入れた楽観的書き込みを使用します
  • ViewModel はリポジトリのプロトコルを直接呼び出します（デフォルトのユースケース／インタラクター層は設けません）

適用する場面

次のような場合は、これらのガイドラインを参照してください。

  • タブバー、NavigationStack、または分割ビューを使ったナビゲーション階層を構築するとき
  • タッチ操作、ジェスチャ、触覚フィードバックを設計するとき
  • VoiceOver、Dynamic Type、カラーコントラストを使ってアクセシビリティを確保するとき
  • 読み込み状態、エラー処理、空の状態を実装するとき
  • オンボーディングフロー、権限リクエスト、確認ダイアログを構築するとき
  • ダークモード、SF Symbols、標準レイアウトマージンに対応するとき
  • HIG 準拠についてアプリをレビューするとき

優先度別ルールカテゴリー

優先度カテゴリー影響度プレフィックス
1ナビゲーションCRITICALnav-
2インタラクションデザインCRITICALinter-
3アクセシビリティCRITICALacc-
4ユーザーフィードバックHIGHfeed-
5UX パターンHIGHux-
6ビジュアルデザインHIGHvis-

クイックリファレンス

1. ナビゲーション（CRITICAL）
  • nav-tab-bar - トップレベルのナビゲーション用にタブバーを設計します
  • nav-navigation-stack - 階層型ナビゲーションには NavigationStack を使用します
  • nav-toolbar-placement - 標準の配置方法を使ってツールバーにアクションを配置します
2. インタラクションデザイン（CRITICAL）
3. アクセシビリティ（CRITICAL）
4. ユーザーフィードバック（HIGH）
5. UX パターン（HIGH）
6. ビジュアルデザイン（HIGH）
  • vis-dark-mode - セマンティックカラーでダークモードをサポートする
  • vis-sf-symbols - 適切な描画モードとウェイトでSF Symbolsを使用する
  • vis-layout-margins - 標準のレイアウトマージンとセーフエリアを使用する

使用方法

詳しい説明とコード例については、各リファレンスファイルを参照してください。

リファレンスファイル

ファイル説明
references/_sections.mdカテゴリーの定義と順序
assets/templates/_template.md新しいルール用のテンプレート

コメント

Markdown 対応