技能 设计创意 苹果HIG导航组件设计指南

苹果HIG导航组件设计指南

v20260406
hig-components-search
本技能基于苹果HIG指南,提供了关于核心导航组件(如搜索框、页面控制和路径控制)的详细设计规范。它指导开发者如何理解组件的最佳实践,确保应用在搜索、流程步骤和文件层级导航方面具备一致性、可用性和跨平台的最佳用户体验。
获取技能
374 次下载
概览

Apple HIG: Navigation Components

Check for .claude/apple-design-context.md before asking questions. Use existing context and only ask for information not already covered.

Key Principles

  1. Search: discoverable with instant feedback. Place search fields where users expect them (top of list, toolbar/navigation bar). Show results as the user types.

  2. Page controls: position in a flat page sequence. For discrete, equally weighted pages (onboarding, photo gallery). Show current page and total count.

  3. Path controls: file hierarchy navigation. macOS path controls display location within a directory structure and allow jumping to any ancestor.

  4. Search scopes narrow large result sets. Provide scope buttons so users can filter without complex queries.

  5. Clear empty states for search. Helpful message suggesting corrections or alternatives, not a blank screen.

  6. Page controls are not for hierarchical navigation. Flat, linear sequences only. Use navigation controllers, tab bars, or sidebars for hierarchy.

  7. Keep path controls concise. Show meaningful segments only. Users can click any segment to navigate directly.

  8. Support keyboard for search. Command-F and system search shortcuts should activate search.

Reference Index

Reference Topic Key content
search-fields.md Search fields Scopes, tokens, instant results, placement
page-controls.md Page controls Dot indicators, flat page sequences
path-controls.md Path controls Breadcrumbs, ancestor navigation

Output Format

  1. Component recommendation -- search field, page control, or path control, and why.
  2. Behavior specification -- interaction model (search-as-you-type, swipe for pages, click-to-navigate for paths).
  3. Platform differences across iOS, iPadOS, macOS, visionOS.

Questions to Ask

  1. What type of content is being searched or navigated?
  2. Which platforms?
  3. How large is the dataset?
  4. Is search the primary interaction?

Related Skills

  • hig-components-menus -- Toolbars and menu bars hosting search and navigation controls
  • hig-components-controls -- Text fields, pickers, segmented controls in search interfaces
  • hig-components-dialogs -- Popovers and sheets for expanded search or filtering
  • hig-patterns -- Navigation patterns and information architecture
  • hig-foundations -- Typography and layout for navigation components

Built by Raintree Technology · More developer tools

When to Use

This skill is applicable to execute the workflow or actions described in the overview.

信息
Category 设计创意
Name hig-components-search
版本 v20260406
大小 13.08KB
更新时间 2026-04-17
语言