MCP HubMCP Hub
Вернуться к навыкам

hig-patterns

raintree-technology
Обновлено 5 days ago
78
9
78
Посмотреть на GitHub
Метаdesigndata

О программе

Этот навык предоставляет рекомендации Apple HIG по распространенным UX-шаблонам и взаимодействиям, таким как онбординг, состояния загрузки, поиск и обработка ошибок. Используйте его, когда разработчики спрашивают, как реализовать конкретные пользовательские сценарии или решить проблемы проектирования взаимодействий в приложениях Apple. Он ссылается на другие навыки HIG для получения основополагающих принципов, особенностей платформы и деталей компонентов.

Быстрая установка

Claude Code

Рекомендуется
Основной
npx skills add raintree-technology/claude-starter -a claude-code
Команда плагинаАльтернативный
/plugin add https://github.com/raintree-technology/claude-starter
Git клонированиеАльтернативный
git clone https://github.com/raintree-technology/claude-starter.git ~/.claude/skills/hig-patterns

Скопируйте и вставьте эту команду в Claude Code для установки этого навыка

Документация

Apple HIG: Interaction Patterns

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

Key Principles

  1. Minimize modality. Use modality only when it is critical to get attention, a task must be completed or abandoned, or saving changes is essential. Prefer non-modal alternatives.

  2. Provide clear feedback. Every action should produce visible, audible, or haptic response. Activity indicators for indeterminate waits, progress bars for determinate, haptics for physical confirmation.

  3. Support undo over confirmation dialogs. Destructive actions should be reversible when possible. Undo is almost always better than "Are you sure?"

  4. Launch quickly. Display a launch screen that transitions seamlessly into the first screen. No splash screens with logos. Restore previous state.

  5. Defer sign-in. Let users explore before requiring account creation. Support Sign in with Apple and passkeys.

  6. Keep onboarding brief. Three screens max. Let users skip. Teach through progressive disclosure and contextual hints.

  7. Use progressive disclosure. Show essentials first, let users drill into details. Don't overwhelm with every option on one screen.

  8. Respect user attention. Consolidate notifications, minimize interruptions, give users control over alerts. Never use notifications for marketing.

Reference Index

ReferenceTopicKey content
charting-data.mdCharting DataData visualization patterns, accessible charts, interactive elements
collaboration-and-sharing.mdCollaboration & SharingShare sheets, activity views, collaborative editing, SharePlay
drag-and-drop.mdDrag and DropDrag sources, drop targets, spring loading, multi-item drag, visual feedback
entering-data.mdEntering DataText fields, pickers, steppers, input validation, keyboard types, autofill
feedback.mdFeedbackAlerts, action sheets, haptic patterns, sound feedback, visual indicators
file-management.mdFile ManagementDocument browser, file providers, iCloud integration, document lifecycle
going-full-screen.mdGoing Full ScreenFull-screen transitions, immersive content, exiting full screen
launching.mdLaunchingLaunch screens, state restoration, cold vs warm launch
live-viewing-apps.mdLive Viewing AppsLive content display, real-time updates, Live Activities, Dynamic Island
loading.mdLoadingActivity indicators, progress views, skeleton screens, lazy loading, placeholders
managing-accounts.mdManaging AccountsSign in with Apple, passkeys, account creation, credential autofill, account deletion
managing-notifications.mdManaging NotificationsPermission requests, grouping, actionable notifications, provisional delivery
modality.mdModalitySheets, alerts, popovers, full-screen modals, when to use each
multitasking.mdMultitaskingiPad Split View, Slide Over, Stage Manager, responsive layout, size class transitions
offering-help.mdOffering HelpContextual tips, onboarding hints, help menus, support links
onboarding.mdOnboardingWelcome screens, feature highlights, progressive onboarding, skip options
playing-audio.mdPlaying AudioAudio sessions, background audio, Now Playing, audio routing, interruptions
playing-haptics.mdPlaying HapticsCore Haptics, UIFeedbackGenerator, haptic patterns, custom haptics
playing-video.mdPlaying VideoVideo player controls, picture-in-picture, AirPlay, full-screen video
printing.mdPrintingPrint dialogs, page setup, AirPrint integration
ratings-and-reviews.mdRatings & ReviewsSKStoreReviewController, timing, frequency limits, in-app feedback
searching.mdSearchingSearch bars, suggestions, scoped search, results display, recents
settings.mdSettingsIn-app vs Settings app, preference organization, toggles, defaults
undo-and-redo.mdUndo and RedoShake to undo, undo/redo stack, multi-level undo
workouts.mdWorkoutsWorkout sessions, live metrics, Always On display, summaries, HealthKit

Pattern Selection Guide

User GoalRecommended PatternAvoid
First app experienceBrief onboarding (max 3 screens) + progressive disclosureLong tutorials, mandatory sign-up
Waiting for contentSkeleton screens or progress indicatorsBlocking spinners with no context
Confirming destructive actionUndo supportExcessive "Are you sure?" dialogs
Collecting user inputInline validation, smart defaults, autofillModal forms for simple inputs
Requesting permissionsContextual, just-in-time with explanationRequesting all permissions at launch
Providing feedbackHaptics + visual indicatorSilent actions with no confirmation
Organizing preferencesIn-app settings for frequent itemsBurying all settings in system Settings app

Output Format

  1. Recommended pattern with rationale, citing the relevant reference file.
  2. Step-by-step implementation covering each screen or state.
  3. Platform variations for targeted platforms.
  4. Common pitfalls that violate HIG for this pattern.

Questions to Ask

  1. Where in the app does this pattern appear? What comes before and after?
  2. Which platforms?
  3. Designing from scratch or improving an existing flow?
  4. Does this involve sensitive actions? (Destructive operations, payments, permissions)

Related Skills

  • hig-foundations -- Accessibility, color, typography, and privacy principles underlying every pattern
  • hig-platforms -- Platform-specific pattern implementations
  • hig-components-layout -- Structural components (tab bars, sidebars, split views) for navigation patterns
  • hig-components-content -- Content display within patterns (charts, collections, search results)

Built by Raintree Technology · More developer tools

GitHub репозиторий

raintree-technology/claude-starter
Путь: templates/.claude/skills/hig-patterns
0
ai-toolsanthropicclaudeclaude-aiclaude-codedeveloper-tools

Похожие навыки

content-collections

Мета

Этот навык предоставляет проверенную в продакшене настройку для Content Collections — TypeScript-ориентированного инструмента, который преобразует файлы Markdown/MDX в типобезопасные коллекции данных с валидацией Zod. Используйте его при создании блогов, сайтов документации или контентных приложений на Vite + React для обеспечения типобезопасности и автоматической проверки содержимого. Он охватывает всё: от настройки плагина Vite и компиляции MDX до оптимизации развертывания и валидации схем.

Просмотреть навык

polymarket

Мета

Этот навык позволяет разработчикам создавать приложения на платформе прогнозных рынков Polymarket, включая интеграцию с API для торговли и получения рыночных данных. Он также обеспечивает потоковую передачу данных в реальном времени через WebSocket для отслеживания текущих сделок и рыночной активности. Используйте его для реализации торговых стратегий или создания инструментов, обрабатывающих обновления рынка в реальном времени.

Просмотреть навык

creating-opencode-plugins

Мета

Этот навык помогает разработчикам создавать плагины OpenCode, которые подключаются к более чем 25 типам событий, таким как команды, файлы и операции LSP. Он предоставляет структуру плагина, спецификации API событий и шаблоны реализации для модулей на JavaScript/TypeScript. Используйте его, когда вам нужно перехватывать, отслеживать или расширять жизненный цикл ассистента OpenCode AI с помощью пользовательской событийно-ориентированной логики.

Просмотреть навык

sglang

Мета

SGLang — это высокопроизводительный фреймворк для обслуживания больших языковых моделей (LLM), специализирующийся на быстрой структурированной генерации JSON, regex и рабочих процессов агентов с использованием кэширования префиксов RadixAttention. Он обеспечивает значительно более высокую скорость вывода, особенно для задач с повторяющимися префиксами, что делает его идеальным для сложных структурированных результатов и многократных диалогов. Выбирайте SGLang вместо альтернатив, таких как vLLM, когда вам требуется ограниченное декодирование или вы создаете приложения с интенсивным совместным использованием префиксов.

Просмотреть навык