hig-patterns について
Apple Human Interface Guidelinesのインタラクションパターンを扱う設計スキルです。オンボーディング、フィードバック、入力、通知などのユーザーフローについて、実装資料やプラットフォームごとの考慮事項とともに選択を支援します。
主な機能
- 01インタラクションパターンの選択指針
- 02フィードバック、読み込み、取り消しのパターン
- 03オンボーディングとアカウントフローの指針
- 04入力、通知、権限のパターン
- 05インタラクション分野別のリファレンス一覧
活用シーン
- 01簡潔なオンボーディングフローの設計
- 02ユーザー操作へのフィードバック選定
- 03権限リクエストと入力フォームの計画
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ raintree-technology/ hig-doctor --skill hig-patternsインストール後、Claude Code で/hig-patternsを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/charting-data.mdcollaboration-and-sharing.mddrag-and-drop.mdentering-data.mdfeedback.mdfile-management.mdgoing-full-screen.mdlaunching.mdlive-viewing-apps.mdloading.mdmanaging-accounts.mdmanaging-notifications.mdmodality.mdmultitasking.mdoffering-help.mdonboarding.mdplaying-audio.mdplaying-haptics.mdplaying-video.mdprinting.mdratings-and-reviews.mdsearching.mdsettings.mdundo-and-redo.mdworkouts.md詳細
Apple HIG: インタラクションパターン
質問する前に .claude/apple-design-context.md を確認してください。既存のコンテキストを使用し、まだカバーされていない情報についてのみ質問してください。
主要な原則
-
モダリティを最小限に抑える。 モダリティは、注意を引くことが重要である場合、タスクを完了または中止する必要がある場合、または変更の保存が不可欠である場合にのみ使用してください。非モーダルの代替手段を優先してください。
-
明確なフィードバックを提供する。 すべてのアクションは、視覚的、聴覚的、または触覚的な応答を生み出すべきです。不確定な待機にはアクティビティインジケーター、確定した待機にはプログレスバー、物理的な確認にはハプティクスを使用してください。
-
確認ダイアログよりも取り消しをサポートする。 破壊的なアクションは、可能な場合は元に戻せるようにすべきです。取り消しは、ほとんどの場合「よろしいですか?」よりも優れています。
-
すばやく起動する。 最初の画面へシームレスに遷移する起動画面を表示してください。ロゴ付きのスプラッシュスクリーンは使用しないでください。以前の状態を復元してください。
-
サインインを後回しにする。 アカウント作成を要求する前に、ユーザーが探索できるようにしてください。Sign in with Apple とパスキーをサポートしてください。
-
オンボーディングは簡潔に保つ。 最大3画面まで。ユーザーがスキップできるようにしてください。段階的な開示とコンテキストに応じたヒントを通じて教えてください。
-
段階的な開示を使用する。 まず必須のものを表示し、ユーザーが詳細を掘り下げられるようにしてください。すべてのオプションを1つの画面に詰め込んで圧倒しないでください。
-
ユーザーの注意を尊重する。 通知を統合し、中断を最小限に抑え、アラートをユーザーが制御できるようにしてください。マーケティングに通知を決して使用しないでください。
リファレンス索引
| リファレンス | トピック | 主な内容 |
|---|---|---|
| charting-data.md | データのグラフ化 | データ可視化パターン、アクセシブルなグラフ、インタラクティブな要素 |
| collaboration-and-sharing.md | コラボレーションと共有 | 共有シート、アクティビティビュー、共同編集、SharePlay |
| drag-and-drop.md | ドラッグ&ドロップ | ドラッグソース、ドロップターゲット、スプリングローディング、複数項目のドラッグ、視覚的フィードバック |
| entering-data.md | データの入力 | テキストフィールド、ピッカー、ステッパー、入力の検証、キーボードの種類、自動入力 |
| feedback.md | フィードバック | アラート、アクションシート、ハプティクスパターン、音によるフィードバック、視覚的インジケーター |
| file-management.md | ファイル管理 | ドキュメントブラウザ、ファイルプロバイダ、iCloud 連携、ドキュメントのライフサイクル |
| going-full-screen.md | フルスクリーンへの移行 | フルスクリーンへの遷移、没入型コンテンツ、フルスクリーンの終了 |
| launching.md | 起動 | 起動画面、状態の復元、コールド起動とウォーム起動 |
| live-viewing-apps.md | ライブ表示アプリ | ライブコンテンツの表示、リアルタイム更新、Live Activities、Dynamic Island |
| loading.md | 読み込み | アクティビティインジケーター、プログレスビュー、スケルトン画面、遅延読み込み、プレースホルダー |
| managing-accounts.md | アカウント管理 | Sign in with Apple、パスキー、アカウント作成、認証情報の自動入力、アカウント削除 |
| managing-notifications.md | 通知の管理 | 権限のリクエスト、グループ化、アクション可能な通知、仮配信 |
| modality.md | モーダリティ | シート、アラート、ポップオーバー、フルスクリーンモーダル、それぞれを使うべき場面 |
| multitasking.md | マルチタスキング | iPad の Split View、Slide Over、Stage Manager、レスポンシブレイアウト、サイズクラスの遷移 |
| offering-help.md | ヘルプの提供 | 状況に応じたヒント、オンボーディングのヒント、ヘルプメニュー、サポートリンク |
| onboarding.md | オンボーディング | ウェルカム画面、機能のハイライト、段階的なオンボーディング、スキップオプション |
| playing-audio.md | オーディオの再生 | オーディオセッション、バックグラウンドオーディオ、Now Playing、オーディオルーティング、割り込み |
| playing-haptics.md | ハプティクスの再生 | Core Haptics、UIFeedbackGenerator、ハプティクスパターン、カスタムハプティクス |
| playing-video.md | ビデオの再生 | ビデオプレーヤーのコントロール、ピクチャーインピクチャー、AirPlay、フルスクリーンビデオ |
| printing.md | 印刷 | 印刷ダイアログ、ページ設定、AirPrint 連携 |
| ratings-and-reviews.md | 評価とレビュー | SKStoreReviewController、タイミング、頻度の制限、アプリ内フィードバック |
| searching.md | 検索 | 検索バー、サジェスチョン、スコープ検索、結果の表示、最近の項目 |
| settings.md | 設定 | アプリ内設定と設定アプリ、環境設定の整理、トグル、デフォルト |
| undo-and-redo.md | 取り消しとやり直し | シェイクで取り消し、取り消し/やり直しスタック、多段階の取り消し |
| workouts.md | ワークアウト | ワークアウトセッション、ライブ指標、Always On ディスプレイ、サマリー、HealthKit |
パターン選択ガイド
| ユーザーの目的 | 推奨パターン | 避けること |
|---|---|---|
| アプリの初回利用体験 | 簡潔なオンボーディング(最大3画面)+段階的な情報開示 | 長いチュートリアル、必須のサインアップ |
| コンテンツの読み込み待ち | スケルトン画面または進行状況インジケーター | 状況を説明しないブロッキングスピナー |
| 破壊的な操作の確認 | 取り消し機能 | 過剰な「本当によろしいですか?」ダイアログ |
| ユーザー入力の収集 | インライン検証、スマートなデフォルト、自動入力 | 簡単な入力のためのモーダルフォーム |
| 権限のリクエスト | 説明を添え、必要なタイミングで状況に応じてリクエスト | 起動時にすべての権限をリクエスト |
| フィードバックの提供 | 触覚フィードバック+視覚的なインジケーター | 確認のない無反応な操作 |
| 環境設定の整理 | 頻繁に使う項目はアプリ内の設定に配置 | すべての設定をシステムの「設定」アプリ内に埋もれさせる |
出力形式
- 推奨パターンとその根拠。関連するリファレンスファイルを挙げてください。
- 実装手順。各画面または状態を網羅してください。
- プラットフォームごとの違い。対象プラットフォームに応じて説明してください。
- よくある落とし穴。このパターンにおける HIG 違反を示してください。
確認する質問
- アプリ内のどこにこのパターンが登場しますか?その前後には何がありますか?
- 対象プラットフォームはどれですか?
- 新規に設計しますか、それとも既存のフローを改善しますか?
- 機密性の高い操作が含まれますか?(破壊的な操作、支払い、権限)
関連スキル
- hig-foundations -- あらゆるパターンの基盤となる、アクセシビリティ、色、タイポグラフィ、プライバシーの原則
- hig-platforms -- プラットフォーム固有のパターン実装
- hig-components-layout -- ナビゲーションパターン向けの構造コンポーネント(タブバー、サイドバー、分割ビュー)
- hig-components-content -- パターン内のコンテンツ表示(グラフ、コレクション、検索結果)