mcpField
H
hig-patterns

hig-patterns

github.com/sickn33デザイン・UI48.7k64 回インストール1 日前に更新
リポジトリ

hig-patterns について

Appleプラットフォームの操作フローを設計・レビューするためのガイドで、デザイナーや開発者を対象とします。フィードバック、取り消し、オンボーディング、通知などを扱い、プラットフォームやユーザーの制約に応じた提案を行います。

主な機能

  1. 01Appleの操作パターンに関するガイド
  2. 02フィードバック、取り消し、モダリティの選択
  3. 03オンボーディング、サインイン、権限要求の助言
  4. 04パターン選定と実装手順の提示
  5. 05プラットフォーム差と一般的な注意点

活用シーン

  1. 01アプリのオンボーディングフローの設計・レビュー
  2. 02データ入力や権限要求の改善
  3. 03文書編集における保存と取り消しの設計
  4. 04検索、メディア再生、アカウント管理フローの設計

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill hig-patterns

インストール後、Claude Code で/hig-patternsを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
loading.md
collaboration-and-sharing.md
charting-data.md
live-viewing-apps.md
going-full-screen.md
drag-and-drop.md
launching.md
feedback.md
file-management.md
entering-data.md
modality.md
managing-notifications.md
multitasking.md
managing-accounts.md
playing-haptics.md
onboarding.md
playing-video.md
offering-help.md
playing-audio.md
printing.md
searching.md
undo-and-redo.md
settings.md
workouts.md
ratings-and-reviews.md

詳細

Apple HIG:インタラクションパターン

プロジェクトに .claude/apple-design-context.md がある場合は読み込み、必須の全体設定ではなくプロジェクトのコンテキストとして扱います。不足しているプラットフォーム、タスク、ユーザーの制約についてのみ確認します。

主な原則

  1. モダリティを最小限にします。 注意を引くことが不可欠な場合、タスクを完了または中止する必要がある場合、あるいは変更の保存が重要な場合にのみモダリティを使用します。モーダルではない方法を優先します。

  2. 明確なフィードバックを提供します。 重要な状態の変化には、知覚できるフィードバックが必要です。アクセシブルな視覚表示やステータステキストに、任意のサウンドや触覚フィードバックを組み合わせ、何気ない操作のたびに通知することは避けます。時間が不定の待機にはアクティビティインジケーター、所要時間が決まっている処理にはプログレスバーを使い、物理的な確認には触覚フィードバックを使います。

  3. 確認ダイアログより取り消しを優先します。 破壊的な操作は、可能な場合、元に戻せるようにします。操作を実際に元に戻せる場合は、確認より取り消しを優先します。取り消せない削除、支払い、外部への共有では、対象範囲を明確に示した確認が必要な場合もあります。

  4. すばやく起動します。 起動画面を表示し、最初の画面へシームレスに移行させます。ブランディングだけの起動画面は避けます。起動後に短いスプラッシュ画面を表示するのは、タスクを妨げなければ適切な場合があります。以前の状態を復元します。

  5. サインインを後回しにします。 アカウントの作成を求める前に、ユーザーがアプリを試せるようにします。「Apple でサインイン」とパスキーに対応します。

  6. オンボーディングは簡潔にします。 タスクに必要な範囲でフローを短く保ちます。画面は3つというのは目安であり、Apple の要件ではありません。スキップできるようにします。段階的な開示や状況に応じたヒントを通じて使い方を伝えます。

  7. 段階的な開示を活用します。 まず必要な情報を表示し、ユーザーが詳細を確認できるようにします。1つの画面にすべての選択肢を詰め込んで、ユーザーに負担をかけないようにします。

  8. ユーザーの注意を尊重します。 通知をまとめ、中断を最小限にし、アラートをユーザーが制御できるようにします。マーケティング通知には明示的なオプトインと簡単なオプトアウト手段が必要です。マーケティング通知を「Time Sensitive」としてマークしてはいけません。

リファレンス一覧

リファレンストピック主な内容
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ライブ視聴アプリテレビ/動画のライブ再生、チャンネルの閲覧、EPG、クラウド DVR
loading.md読み込みアクティビティインジケーター、進捗ビュー、スケルトンスクリーン、遅延読み込み、プレースホルダー
managing-accounts.mdアカウント管理Apple でサインイン、パスキー、アカウント作成、認証情報の自動入力、アカウント削除
managing-notifications.md通知管理許可のリクエスト、グループ化、アクション可能な通知、暫定配信
modality.mdモダリティシート、アラート、ポップオーバー、フルスクリーンモーダル、それぞれの使いどころ
multitasking.mdマルチタスクiPad の Split View、Slide Over、Stage Manager、レスポンシブレイアウト、サイズクラスの遷移
offering-help.mdヘルプの提供コンテキストに応じたヒント、オンボーディングのヒント、ヘルプメニュー、サポートリンク
onboarding.mdオンボーディングウェルカム画面、機能の紹介、段階的なオンボーディング、スキップオプション
playing-audio.mdオーディオ再生オーディオセッション、バックグラウンドオーディオ、再生中、オーディオルーティング、中断
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ワークアウトワークアウトセッション、リアルタイム指標、常時表示、概要、HealthKit

パターン選択ガイド

ユーザーの目標推奨パターン避けること
アプリを初めて使う体験簡潔で任意のオンボーディング+段階的な情報開示長いチュートリアル、必須のサインアップ
コンテンツの読み込み待ちスケルトンスクリーンまたは進行状況インジケーター説明のない、操作を妨げるスピナー
取り消し可能な操作取り消し可能なら「取り消す」機能、取り消せない場合は対象範囲が明確な確認取り消しによって外部への影響や永続的な変更も元に戻せると主張すること
ユーザー入力の収集インライン検証、スマートなデフォルト値、自動入力単純な入力にモーダルフォームを使うこと
権限の要求理由を説明したうえで、状況に応じて必要なタイミングで要求起動時にすべての権限を要求すること
フィードバックの提供触覚フィードバック+視覚的なインジケーター確認なしの無反応な操作
環境設定の整理使用頻度の高い項目をアプリ内設定に配置すべての設定をシステムの「設定」アプリに埋もれさせること

出力形式

  1. 推奨パターンとその理由。関連するリファレンスファイルを引用します。
  2. 段階的な実装手順。各画面または状態を網羅します。
  3. プラットフォームごとの違い。対象プラットフォームに合わせます。
  4. よくある落とし穴。このパターンに関する HIG に反する事項を説明します。

確認する質問

  1. このパターンはアプリのどこに登場しますか?その前後には何がありますか?
  2. 対象となるプラットフォームはどれですか?
  3. 新規に設計しますか、それとも既存のフローを改善しますか?
  4. 機密性の高い操作が関係しますか?(破壊的な操作、支払い、権限)

関連スキル

  • hig-foundations -- あらゆるパターンの基盤となる、アクセシビリティ、色、タイポグラフィ、プライバシーの原則
  • hig-platforms -- プラットフォーム固有のパターンの実装
  • hig-components-layout -- ナビゲーションパターンに使う構造コンポーネント(タブバー、サイドバー、分割ビュー)
  • hig-components-content -- パターン内のコンテンツ表示(グラフ、コレクション、検索結果)

Raintree Technology が制作 · その他の開発者ツール

使用する場面

オンボーディング、データ入力、ドキュメントの取り扱い、検索、メディア再生、アカウント管理、取り消しなど、Apple のインタラクションフローを設計またはレビューするときに使用します。リファレンスを適用する前に、対象のプラットフォームと OS のリリースを選択してください。

例

ユーザーのリクエスト:

iPad のドキュメントエディターで、自動保存、バックグラウンドへの移行、取り消しのフローをレビューしてください。

復元可能な編集内容、目に見える保存失敗の表示、安全な競合状態、アクセシブルな操作を説明します。関連するローカルリファレンスを引用し、どの動作にネイティブ環境でのテストがまだ必要かを明示してください。

制限事項

  • このスキルは、タスクが上記の対象範囲に明確に合致する場合にのみ使用してください。
  • 出力を、環境固有の検証、テスト、専門家によるレビューの代わりとして扱わないでください。
  • 必要な入力、権限、安全上の境界、成功基準が不足している場合は、作業を止めて確認を求めてください。

実装上の境界

HIG のデザインガイダンスは、API の利用可能性やセキュリティを証明するものではありません。外部からのドラッグ&ドロップで受け取るファイルと URL を検証し、共有やディープリンクに対してアカウントおよびテナントの認可を適用してください。また、機密性の高いコンテンツを検索インデックス、プレビュー、ログに含めないでください。フィールドをマスクしてもデータは暗号化されません。また、クライアント側の形式検証はサーバー側の検証ではありません。

バックグラウンド処理、通知、音声、触覚フィードバックは、OS の機能、ユーザー設定、システムのリソース上限に依存します。処理の完了、中断のない再生、通知の配信を保証しないでください。作業内容を保持し、再試行、オフライン、失敗の状態を表示してください。デザインリファレンスに機能が記載されているというだけで、エージェントが通知を送信したり、アカウントを削除したり、ファイルを共有したり、音声を録音したり、デバイス設定を変更したりしてはいけません。これらの操作には、ユーザーのタスク範囲内であることが必要です。

コメント