Apple HIG: Layout and Navigation Components
HIGナビゲーションパターンで適応型Appleアプリレイアウトを設計する
複数のAppleプラットフォーム向けアプリを開発するには、複雑なナビゲーションパターンとレイアウト適応を理解する必要があります。このスキルでは、サイドバー、スプリットビュー、タブバーなど、公式のApple Human Interface Guidelinesを提供し、アプリがプラットフォームの規則に従うことを保証します。
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“Apple HIG: Layout and Navigation Components”。 インスペクターパネルを持つドキュメントエディタを開発しています。サイドバーとパネルのどちらを使用すべきですか?
预期结果:
インスペクターパネルを持つドキュメントエディタには、macOSでパネル(サイドバーではなく)を使用してください。サイドバーはセクション間の主ナビゲーション用であり、パネルはメインコンテンツを補完するセカンダリコントロールとプロパティ用です。iPadでは、インスペクターをポップオーバーまたはシートとして表示します。参照:panels.md(インスペクターパターン)、sidebars.md(主ナビゲーションパターン)
正在使用“Apple HIG: Layout and Navigation Components”。 トップレベルセクションが6つある場合、タブバーをどのように処理しますか?
预期结果:
iOSタブバーは最大5つの表示可能なタブをサポートします。6つのセクションがある場合は、追加のセクションに「More」タブを使用してください。ただし、6つのトップレベルセクションが、iPadでのサイドバーまたはネストされたナビゲーションで再構築する機会を示しているかどうかを検討してください。iPadOS 18+では、.sidebarAdaptableを使用して、iPadでは自動的にサイドバー、iPhoneではタブバーを表示できます。参照:tab-bars.md(タブ数ガイダンス)、sidebars.md(代替パターン)
安全审计
安全This skill contains only documentation markdown files referencing Apple Human Interface Guidelines. All 768 static analysis findings are false positives: backtick patterns are markdown code blocks with API names, URLs link to official Apple Developer documentation, and cryptographic/C2 keywords are spurious text matches in design documentation. No executable code, network calls, or system commands present.
质量评分
你能构建什么
iOSアプリナビゲーションデザイン
初めてiPadアプリを開発する開発者が、ナビゲーションにタブバーとサイドバーのどちらを使用するか決定する必要があります。このスキルでは、各パターンをいつ使用するか、NavigationSplitViewがサイズクラス間でどのように適応するかを説明します。
クロスプラットフォームレイアウト戦略
iPhone、iPad、Macでローンチするチームは統合されたナビゲーション戦略を必要とします。このスキルは、レスポンシブレイアウトを計画するための適応チェックリストとパターン選択テーブルを提供します。
visionOSスペースレイアウト
初めてvisionOSアプリを作成する開発者は、Windows、Volumes、Ornamentsを理解する必要があります。このスキルでは、空間的配置とオーナメント接続パターンを説明します。
试试这些提示
ホーム、検索、ライブラリ、設定の4つのメインセクションを持つアプリを開発しています。iPhoneとiPadでどのナビゲーションパターンを使用すべきですか?
アプリではiPadで3カラムレイアウトを使用していますが、iPhoneでは崩れます。NavigationSplitViewを使用してどのように適応させるべきですか?
macOSサイドバーとiPadサイドバーの違いは何ですか?各パターンをいつ使用すべきですか?
iPadアプリがSplit View、Slide Over、Stage Managerをサポートする必要があります。テストすべきサイズクラス遷移と、それらを処理する方法は?
最佳实践
- 質問する前に既存のapple-design-context.mdを必ず確認する - 既に使用可能な情報を使用する
- 情報構造の深さに応じてナビゲーションパターンを一致させる:浅い構造にはタブバー、深い階層にはサイドバー
- すべてのサイズクラス遷移とiPadマルチタスク比率でレイアウト適応をテストする
避免
- 深い階層により良い対応ができる場合にiPadでタブバーを使用する
- コンパクトvsレギュラーサイズクラスに適応しない固定幅レイアウトを構築する
- Apple Vision Proをターゲットにする際にvisionOSスペース規則を無視する