Apple HIG: Layout and Navigation Components
Concevoir des mises en page adaptatives pour applications Apple avec des modèles de navigation HIG
Le développement d'applications pour plusieurs plateformes Apple nécessite de comprendre des modèles de navigation complexes et l'adaptation des mises en page. Cette compétence fournit les directives officielles Apple Human Interface Guidelines pour les barres latérales, les vues partagées, les barres d'onglets, et plus encore, afin de garantir que votre application respecte les conventions de chaque plateforme.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "Apple HIG: Layout and Navigation Components". Je développe un éditeur de documents avec un panneau d'inspection. Dois-je utiliser une barre latérale ou un panneau ?
Résultat attendu:
Pour un éditeur de documents avec un inspecteur, utilisez un panneau (et non une barre latérale) sur macOS. Les barres latérales sont destinées à la navigation principale entre les sections, tandis que les panneaux sont pour les contrôles secondaires et les propriétés qui complètent le contenu principal. Sur iPad, présentez l'inspecteur comme un popover ou une sheet. Référence : panels.md pour les modèles d'inspecteur, sidebars.md pour les modèles de navigation principale.
Utilisation de "Apple HIG: Layout and Navigation Components". Comment gérer les barres d'onglets lorsque j'ai 6 sections de premier niveau ?
Résultat attendu:
Les barres d'onglets iOS prennent en charge un maximum de 5 onglets visibles. Avec 6 sections, utilisez un onglet 'More' pour les sections supplémentaires. Cependant, envisagez si 6 sections de premier niveau indique une opportunité de restructurer avec une barre latérale (iPad) ou une navigation imbriquée. Pour iPadOS 18+, utilisez .sidebarAdaptable pour afficher automatiquement la barre latérale sur iPad et la barre d'onglets sur iPhone. Référence : tab-bars.md pour les conseils sur le nombre d'onglets, sidebars.md pour les modèles alternatifs.
Audit de sécurité
SûrThis 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.
Score de qualité
Ce que vous pouvez construire
Conception de navigation pour application iOS
Un développeur créant sa première application iPad doit choisir entre barres d'onglets et barres latérales pour la navigation. La compétence explique quand utiliser chaque modèle et comment NavigationSplitView s'adapte aux différentes size classes.
Stratégie de mise en page multiplateforme
Une équipe lançant une application sur iPhone, iPad et Mac a besoin d'une stratégie de navigation unifiée. La compétence fournit la checklist d'adaptation et le tableau de sélection des modèles pour planifier des mises en page adaptatives.
Mise en page spatiale visionOS
Un développeur créant sa première application visionOS doit comprendre les fenêtres, volumes et ornaments. La compétence explique le positionnement spatial et les modèles d'attachement des ornaments.
Essayez ces prompts
Je construis une application avec 4 sections principales : Home, Search, Library et Settings. Quel modèle de navigation devrais-je utiliser pour iPhone vs iPad ?
Mon application utilise une mise en page à trois colonnes sur iPad mais ne fonctionne pas sur iPhone. Comment adapter cela avec NavigationSplitView ?
Quelles sont les différences entre les barres latérales macOS et les barres latérales iPad ? Quand utiliser chaque modèle ?
Mon application iPad doit prendre en charge Split View, Slide Over et Stage Manager. Quelles transitions de size classes dois-je tester et comment les gérer ?
Bonnes pratiques
- Toujours vérifier l'existence de apple-design-context.md avant de poser des questions - utiliser les informations déjà disponibles
- Adapter le modèle de navigation à la profondeur de l'architecture de l'information : les structures peu profondes utilisent les barres d'onglets, les hiérarchies profondes utilisent les barres latérales
- Tester l'adaptation de la mise en page à chaque transition de size class et à chaque ratio de multitâche iPad
Éviter
- Utiliser des barres d'onglets sur iPad lorsqu'une barre latérale gérerait mieux les hiérarchies profondes
- Créer des mises en page à largeur fixe qui ne s'adaptent pas aux size classes compact vs regular
- Ignorer les conventions spatiales visionOS lors du ciblage d'Apple Vision Pro