hig-components-menus について
hig-components-menusは、メニューとボタンの設計にApple HIGを適用するスキルです。デザイナーや開発者向けに、コンポーネントの選択、操作の整理、プラットフォームごとの動作、キーボードショートカットを案内します。
主な機能
- 01メニューとボタンの選択指針
- 02メニュー階層と操作のグループ化
- 03プラットフォーム別の動作指針
- 04キーボードショートカットの提案
- 05既存のApple設計コンテキストを確認
活用シーン
- 01画面上の操作に適したメニューの選択
- 02ツールバーとメニューへのコマンド配置
- 03Apple各プラットフォームのメニュー動作への対応
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ raintree-technology/ hig-doctor --skill hig-components-menusインストール後、Claude Code で/hig-components-menusを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/action-button.mdbuttons.mdcontext-menus.mddisclosure-controls.mddock-menus.mdedit-menus.mdmenus.mdpop-up-buttons.mdpull-down-buttons.mdthe-menu-bar.mdtoolbars.md詳細
Apple HIG:メニューとボタン
質問する前に .claude/apple-design-context.md を確認してください。既存のコンテキストを利用し、そこに記載されていない情報だけを質問してください。
主な原則
-
メニューは状況に応じた、予測しやすいものにします。 標準項目は標準の場所に配置します。順序やグループ分けにはプラットフォームの慣習に従います。
-
標準のボタンスタイルを使用します。 システム定義のスタイルは、操作できることを伝え、視覚的な一貫性を保ちます。カスタムデザインよりも優先してください。
-
頻繁に使う操作にはツールバーを使用します。 最もよく使うコマンドをツールバーに配置します。使用頻度の低い操作はメニューに配置します。
-
macOS ではメニューバーが主要なコマンドインターフェイスです。 すべてのコマンドにメニューバーからアクセスできるようにします。ツールバーやコンテキストメニューは補助的に使い、置き換えるものではありません。
-
コンテキストメニューは副次的な操作に使用します。 右クリックまたは長押しで表示し、ポインタの下にある項目に関連する操作を提示します。コマンドをコンテキストメニューだけに配置しないでください。
-
ポップアップボタンは相互に排他的な選択肢に使用します。 一連の選択肢から必ず1つを選択します。
-
プルダウンボタンは操作の一覧に使用します。 現在の選択項目はなく、一連のコマンドを提示します。
-
アクションボタンは関連する操作をまとめ、 ツールバーやタイトルバーの単一のアイコンから利用できるようにします。
-
開示コントロールは段階的な情報開示に使用します。 追加コンテンツを表示または非表示にします。
-
Dock メニューは、アプリの実行中に最も役立つ操作に絞り、簡潔にします。
リファレンス一覧
| リファレンス | トピック | 主な内容 |
|---|---|---|
| menus.md | メニュー全般のデザイン | 項目の順序、グループ分け、ショートカット |
| context-menus.md | コンテキストメニュー | 右クリック、長押し、副次的な操作 |
| dock-menus.md | Dock メニュー | macOS のアプリレベルの操作、実行状態 |
| edit-menus.md | 編集メニュー | 取り消し、コピー、ペースト、標準項目 |
| the-menu-bar.md | メニューバー | macOS の主要なコマンドインターフェイス、構成 |
| toolbars.md | ツールバー | 頻繁に使う操作、カスタマイズ、配置 |
| buttons.md | ボタン | システムスタイル、サイズ、操作可能であることの伝達 |
| action-button.md | アクションボタン | 副次的な操作のグループ化、ツールバーでの使用 |
| pop-up-buttons.md | ポップアップボタン | 相互に排他的な選択肢の選択 |
| pull-down-buttons.md | プルダウンボタン | 操作の一覧、現在の選択項目なし |
| disclosure-controls.md | 開示コントロール | 段階的な情報開示、表示/非表示 |
出力形式
- コンポーネントの推奨 -- どの種類のメニューまたはボタンを、なぜ推奨するか。
- 視覚的な階層 -- インターフェイス内での配置、サイズ、グループ分け。
- プラットフォーム固有の動作 -- iOS、iPadOS、macOS、visionOS での動作。
- キーボードショートカット(macOS) -- メニュー項目やツールバーの操作に使う標準およびカスタムのショートカット。
質問項目
- 対象のプラットフォームはどれですか?
- 主要な操作ですか、それとも副次的な操作ですか?
- 利用可能にする必要がある操作はいくつありますか?
- macOS のメニューバーアプリですか?
関連するスキル
- hig-components-search -- ツールバーやメニューと併用する検索フィールド、ページコントロール
- hig-components-controls -- ボタンを補完するトグル、ピッカー、セグメントコントロール
- hig-components-dialogs -- メニュー項目やボタンから表示するアラート、シート、ポップオーバー
- hig-inputs -- メニューやツールバーでのキーボードショートカットとポインタ操作