hig-components-dialogs について
アラート、アクションシート、ポップオーバー、シート、数字入力ビューなど、Apple の画面表示コンポーネントを選ぶためのスキルです。タスクやプラットフォームに応じた選択と、不要な中断の削減を支援します。
主な機能
- 01アラート、シート、ポップオーバーの使い分け
- 02アクションシートと数字入力の指針
- 03タイトルやボタンラベルの作成指針
- 04閉じ方と非モーダルな代替案
活用シーン
- 01破壊的操作の確認フロー設計
- 02設定編集に適した表示形式の選択
- 03PIN 入力画面の計画
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ sickn33/ agentic-awesome-skills --skill hig-components-dialogsインストール後、Claude Code で/hig-components-dialogsを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/action-sheets.mdalerts.mddigit-entry-views.mdpopovers.mdsheets.md詳細
Apple HIG: プレゼンテーションコンポーネント
質問をする前に .claude/apple-design-context.md を確認してください。既存のコンテキストを使用し、まだカバーされていない情報についてのみ質問してください。
主な原則
-
アラート: 控えめに、重大な状況に対して。 注意が必要なエラー、破壊的な操作の確認、または承認を必要とする情報。これらはフローを中断し、応答を要求します。
-
シート: コンテキストを維持する集中したタスク。 画面の端からスライドインします(または macOS ではウィンドウに付随します)。項目の作成、設定の編集、複数ステップのフォームに使用します。
-
ポップオーバー: iPad と Mac では非モーダル。 トリガー要素の隣に表示され、外側をタップすると閉じます。画面を占有することなく、追加情報、オプション、またはコントロールを提供します。
-
アクションシート: アクションの中からの選択。 複数のアクションから選択する場合、特にそのうちの 1 つが破壊的な場合に提示します。iPhone: 下部からスライドアップします。iPad: ポップオーバーとして表示されます。
-
中断を最小限に抑える。 モーダルに頼る前に、インラインでの提示や、操作を元に戻せるようにすることを検討してください。
-
簡潔で実行可能なアラートテキスト。 短く説明的なタイトル。必要に応じて簡潔なメッセージ本文。ボタンのラベルは「OK」ではなく、具体的な動詞(「削除」、「保存」)にしてください。
-
破壊的な操作を明確に示す。 破壊的ボタンのスタイル(赤いテキスト)。破壊的なボタンは、ユーザーが反射的にタップしにくい場所に配置してください。
-
複数のアクションがあるアラートとアクションシートにはキャンセルオプションを提供する。 アクションシートでは、キャンセルは下部に区切って表示されます。
-
数字入力: 集中しやすくアクセシブルに。 適切なサイズの入力フィールド、桁間の自動移動、貼り付けと自動入力のサポート。
-
プラットフォームに合わせて提示方法を適応させる。 同じインタラクションでも、iPhone、iPad、Mac、visionOS では異なるコンポーネントを使用することがあります。
リファレンスインデックス
| リファレンス | トピック | 主な内容 |
|---|---|---|
| alerts.md | アラート | ボタンの順序、タイトル/メッセージテキスト、確認、破壊的な操作 |
| action-sheets.md | アクションシート | 複数のアクション、キャンセルオプション、破壊的な操作の扱い |
| popovers.md | ポップオーバー | 非モーダル、外側をタップで閉じる、iPad/Mac |
| sheets.md | シート | モーダルタスク、コンテキストの維持 |
| digit-entry-views.md | 数字入力 | PIN 入力、自動入力、自動移動 |
出力形式
- 推奨される提示タイプとその根拠、および代替案がなぜあまり適していないのか。
- コンテンツのガイドライン -- Apple のトーンと簡潔さのルールに沿ったタイトル、メッセージ、ボタンのラベル。
- 閉じる動作 -- ユーザーがどのように閉じるのか、そして何が起こるのか(保存、破棄、キャンセル)。
- 代替案 -- シナリオによってはモーダルがまったく不要な場合(インラインフィードバック、元に戻す、段階的な開示)。
質問すべきこと
- この提示で伝える必要がある情報または操作は何ですか?
- ブロッキングか非ブロッキングか?
- どのプラットフォームですか?
- これはどのくらいの頻度で表示されますか?
関連スキル
- hig-components-menus -- プレゼンテーションをトリガーするボタンとツールバー項目
- hig-components-controls -- シートとポップオーバー内の入力コントロール
- hig-components-search -- 提示されたビュー内での検索とナビゲーション
- hig-patterns -- モダリティ、中断、ユーザーフローの管理
- hig-foundations -- プレゼンテーションコンポーネントのための色、タイポグラフィ、レイアウト
Built by Raintree Technology · More developer tools
使用する場合
このスキルは、概要に記載されているワークフローまたはアクションを実行する場合に適用されます。
例
ユーザーのリクエスト:
このタスクに @hig-components-dialogs を使用してください: アラート、アクションシート、ポップオーバー、シート、数字入力ビューを含むプレゼンテーションコンポーネントに関する Apple HIG ガイダンス。
制限事項
- このスキルは、タスクが上記のスコープに明確に一致する場合にのみ使用してください。
- 出力を、環境固有の検証、テスト、専門家によるレビューの代替として扱わないでください。
- 必要な入力、権限、安全境界、成功基準が欠けている場合は、作業を中断して確認を求めてください。