Design Patterns

Vertically scrolling rows of content, supporting selection, swipe actions, and reordering.

Two-dimensional layouts for visually browsing collections, especially media.

Full content display after selecting an item from a list or grid.

Structured layouts for collecting user input using grouped lists with various control types.

Edit content directly where it appears, without navigating to a separate editing mode.

Cards that slide up from the bottom to present secondary content or tasks. Support multiple detents for different content heights.

Modal dialogs that interrupt the current task to deliver important information and request a decision.

Floating views that appear from a specific element, showing additional content or options. Automatically become sheets on iPhone.

Covers the entire screen for immersive tasks like composing content, media capture, or multi-step processes.

Drill-down navigation structure where users make one choice per screen until reaching their destination. Uses NavigationStack/NavigationController.

Tab-based navigation where main sections are peers. Users can switch between sections at any time from the tab bar.

A persistent sidebar shows primary navigation on larger screens, collapsing to tabs or sheets on smaller screens.

First-run experience introducing the app's key features and value proposition.

Explain why permissions are needed before showing system permission dialogs.

Show tips and hints about features when users first encounter them.

Allow users to find content quickly using text queries, with suggestions, scopes, and filters.

Allow users to narrow down content by selecting criteria like date, type, tags, or other attributes.