hig-patterns
について
このスキルは、オンボーディング、ローディング状態、検索、エラー処理など、一般的なUXパターンとインタラクションに関するApple HIG(ヒューマンインターフェースガイドライン)のガイダンスを提供します。開発者がAppleアプリで特定のユーザーフローを実装する方法やインタラクションデザインの問題を解決する方法を尋ねた際にご利用ください。基礎原則、プラットフォーム固有の詳細、コンポーネントの詳細については、他のHIG関連スキルを参照しています。
クイックインストール
Claude Code
推奨npx skills add raintree-technology/claude-starter -a claude-code/plugin add https://github.com/raintree-technology/claude-startergit clone https://github.com/raintree-technology/claude-starter.git ~/.claude/skills/hig-patternsこのコマンドをClaude Codeにコピー&ペーストしてスキルをインストールします
ドキュメント
Apple HIG: Interaction Patterns
Check for .claude/apple-design-context.md before asking questions. Use existing context and only ask for information not already covered.
Key Principles
-
Minimize modality. Use modality only when it is critical to get attention, a task must be completed or abandoned, or saving changes is essential. Prefer non-modal alternatives.
-
Provide clear feedback. Every action should produce visible, audible, or haptic response. Activity indicators for indeterminate waits, progress bars for determinate, haptics for physical confirmation.
-
Support undo over confirmation dialogs. Destructive actions should be reversible when possible. Undo is almost always better than "Are you sure?"
-
Launch quickly. Display a launch screen that transitions seamlessly into the first screen. No splash screens with logos. Restore previous state.
-
Defer sign-in. Let users explore before requiring account creation. Support Sign in with Apple and passkeys.
-
Keep onboarding brief. Three screens max. Let users skip. Teach through progressive disclosure and contextual hints.
-
Use progressive disclosure. Show essentials first, let users drill into details. Don't overwhelm with every option on one screen.
-
Respect user attention. Consolidate notifications, minimize interruptions, give users control over alerts. Never use notifications for marketing.
Reference Index
| Reference | Topic | Key content |
|---|---|---|
| charting-data.md | Charting Data | Data visualization patterns, accessible charts, interactive elements |
| collaboration-and-sharing.md | Collaboration & Sharing | Share sheets, activity views, collaborative editing, SharePlay |
| drag-and-drop.md | Drag and Drop | Drag sources, drop targets, spring loading, multi-item drag, visual feedback |
| entering-data.md | Entering Data | Text fields, pickers, steppers, input validation, keyboard types, autofill |
| feedback.md | Feedback | Alerts, action sheets, haptic patterns, sound feedback, visual indicators |
| file-management.md | File Management | Document browser, file providers, iCloud integration, document lifecycle |
| going-full-screen.md | Going Full Screen | Full-screen transitions, immersive content, exiting full screen |
| launching.md | Launching | Launch screens, state restoration, cold vs warm launch |
| live-viewing-apps.md | Live Viewing Apps | Live content display, real-time updates, Live Activities, Dynamic Island |
| loading.md | Loading | Activity indicators, progress views, skeleton screens, lazy loading, placeholders |
| managing-accounts.md | Managing Accounts | Sign in with Apple, passkeys, account creation, credential autofill, account deletion |
| managing-notifications.md | Managing Notifications | Permission requests, grouping, actionable notifications, provisional delivery |
| modality.md | Modality | Sheets, alerts, popovers, full-screen modals, when to use each |
| multitasking.md | Multitasking | iPad Split View, Slide Over, Stage Manager, responsive layout, size class transitions |
| offering-help.md | Offering Help | Contextual tips, onboarding hints, help menus, support links |
| onboarding.md | Onboarding | Welcome screens, feature highlights, progressive onboarding, skip options |
| playing-audio.md | Playing Audio | Audio sessions, background audio, Now Playing, audio routing, interruptions |
| playing-haptics.md | Playing Haptics | Core Haptics, UIFeedbackGenerator, haptic patterns, custom haptics |
| playing-video.md | Playing Video | Video player controls, picture-in-picture, AirPlay, full-screen video |
| printing.md | Printing | Print dialogs, page setup, AirPrint integration |
| ratings-and-reviews.md | Ratings & Reviews | SKStoreReviewController, timing, frequency limits, in-app feedback |
| searching.md | Searching | Search bars, suggestions, scoped search, results display, recents |
| settings.md | Settings | In-app vs Settings app, preference organization, toggles, defaults |
| undo-and-redo.md | Undo and Redo | Shake to undo, undo/redo stack, multi-level undo |
| workouts.md | Workouts | Workout sessions, live metrics, Always On display, summaries, HealthKit |
Pattern Selection Guide
| User Goal | Recommended Pattern | Avoid |
|---|---|---|
| First app experience | Brief onboarding (max 3 screens) + progressive disclosure | Long tutorials, mandatory sign-up |
| Waiting for content | Skeleton screens or progress indicators | Blocking spinners with no context |
| Confirming destructive action | Undo support | Excessive "Are you sure?" dialogs |
| Collecting user input | Inline validation, smart defaults, autofill | Modal forms for simple inputs |
| Requesting permissions | Contextual, just-in-time with explanation | Requesting all permissions at launch |
| Providing feedback | Haptics + visual indicator | Silent actions with no confirmation |
| Organizing preferences | In-app settings for frequent items | Burying all settings in system Settings app |
Output Format
- Recommended pattern with rationale, citing the relevant reference file.
- Step-by-step implementation covering each screen or state.
- Platform variations for targeted platforms.
- Common pitfalls that violate HIG for this pattern.
Questions to Ask
- Where in the app does this pattern appear? What comes before and after?
- Which platforms?
- Designing from scratch or improving an existing flow?
- Does this involve sensitive actions? (Destructive operations, payments, permissions)
Related Skills
- hig-foundations -- Accessibility, color, typography, and privacy principles underlying every pattern
- hig-platforms -- Platform-specific pattern implementations
- hig-components-layout -- Structural components (tab bars, sidebars, split views) for navigation patterns
- hig-components-content -- Content display within patterns (charts, collections, search results)
Built by Raintree Technology · More developer tools
GitHub リポジトリ
関連スキル
content-collections
メタこのスキルは、Content Collections(Markdown/MDXファイルを型安全なデータコレクションに変換するTypeScriptファーストのツール)の本番環境でテストされた設定を提供します。Zodバリデーションによる型安全性を実現し、ブログ、ドキュメントサイト、コンテンツ重視のVite + Reactアプリケーション構築時にご利用ください。Viteプラグインの設定、MDXコンパイルから、デプロイ最適化、スキーマバリデーションまで、すべてを網羅しています。
polymarket
メタこのスキルは、開発者がPolymarket予測市場プラットフォームを活用したアプリケーション構築を可能にします。API統合による取引や市場データの取得に加え、WebSocketを介したリアルタイムデータストリーミングにより、ライブ取引や市場活動を監視できます。取引戦略の実装や、ライブ市場更新を処理するツールの作成にご利用ください。
creating-opencode-plugins
メタこのスキルは、開発者がコマンド、ファイル、LSP操作など25種類以上のイベントタイプにフックするOpenCodeプラグインを作成することを支援します。JavaScript/TypeScriptモジュール向けに、プラグイン構造、イベントAPI仕様、および実装パターンを提供します。カスタムイベント駆動ロジックでOpenCode AIアシスタントのライフサイクルをインターセプト、監視、または拡張する必要がある場合にご利用ください。
sglang
メタSGLangは、高性能なLLMサービングフレームワークであり、RadixAttentionプレフィックスキャッシュを活用したJSON、正規表現、エージェントワークフロー向けの高速で構造化された生成を特長とします。特にプレフィックスが繰り返されるタスクにおいて、大幅に高速な推論を実現し、複雑な構造化出力やマルチターン対話に最適です。制約付きデコードが必要な場合や、広範なプレフィックス共有を伴うアプリケーションを構築する場合は、vLLMなどの代替案ではなくSGLangを選択してください。
