skills.rest
raintree-technology
raintree-technologyOFFICIAL
Explore all skills by this author →
Website𝕏@raintree_techGitHub

hig-components-layout

Guide designers to apply Apple HIG layout and navigation rules across iPhone, iPad, macOS, and visionOS.

102|6|Updated Feb 9, 2026
Search Tags:#layout#navigation#split-view#apple-hig#sidebars#tab-views
One-click install
npx skills add https://github.com/raintree-technology/hig-doctor --skill hig-components-layout-raintree-technology
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hig-components-layout
Source: https://github.com/raintree-technology/hig-doctor/tree/main/skills/hig-components-layout
Command: npx skills add https://github.com/raintree-technology/hig-doctor --skill hig-components-layout-raintree-technology

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Provides guidance on layout and navigation components per Apple HIG to help design coherent, adaptable interfaces.

Core Features & Use Cases

  • Guidance on layout structures (sidebars, split views, tab bars, tab views, scroll views, windows) and recommended patterns for different devices.
  • Cross-reference to hig-foundations, hig-platforms, hig-patterns, and hig-components-content for deeper design principles.
  • Useful in planning app architectures and ensuring consistency across platforms.

Quick Start

Ask for Apple HIG layout guidance when planning sidebars, split views, or tab-based navigation to ensure platform-adaptive design.

Frequently Asked Questions about hig-components-layout

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I apply Apple HIG layout patterns for sidebars and split views across different devices?▼

Apple HIG layout patterns define how to structure sidebars and split views across iPhone, iPad, macOS, and visionOS. This guidance helps you select the correct container structures to ensure interfaces remain coherent and adaptable across different screen sizes.

What is the best way to design navigation structures for an app that targets both iPhone and iPad?▼

Design cross-platform navigation by using Apple HIG container patterns like tab bars and split views. It provides specific recommendations for adapting navigation hierarchies based on the targeted iPhone and iPad scenarios.

When should I use a split view versus a sidebar in macOS app interfaces?▼

Use a split view for two-column hierarchical content navigation, and a sidebar for persistent app-level navigation. Apple HIG guidance clarifies these container patterns to help you structure app architectures effectively.

Does this Apple HIG layout guidance cover tab views and tab bars for visionOS?▼

Yes, this Apple HIG layout guidance covers tab bars and tab views specifically for visionOS scenarios. It scopes layout and navigation rules to ensure consistency across iPhone, iPad, macOS, and visionOS platforms.

Why does my app layout feel inconsistent when moving from iPad to macOS?▼

Your layout feels inconsistent because different platforms require distinct Apple HIG container patterns, like transitioning from tab bars to sidebars. It references foundational design principles to help resolve these cross-platform architecture mismatches.

Related Skills

Explore More Design & Creative Skills→
exiaoexiao
37

apple-ux-guidelines

Provide Apple Human Interface Guidelines guidance for designing platform-consistent interfaces.

Community
Advanced
pyronaurpyronaur

hig-components-menus

Guides designers to align menus and buttons with Apple HIG.

Community
Intermediate
wanghaishengwanghaisheng
10

ipados-design-guidelines

Design iPad-native interfaces with multitasking, Split View, and pointer interactions.

Community
Intermediate
MuhamadAnangMuhamadAnang

responsive-design

Implement responsive designs with container queries, fluid typography, and CSS Grid.

Community
Intermediate