MCP HubMCP Hub
← スキル一覧に戻る

hig-platforms

raintree-technology
更新日 4 days ago
78
9
78
GitHubで表示
メタdesign

について

このスキルは、iOS、iPadOS、macOS、tvOS、visionOS、watchOSにわたるデザインのための、Appleプラットフォーム固有のヒューマンインターフェースガイドラインを提供します。異なる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-platforms

このコマンドをClaude Codeにコピー＆ペーストしてスキルをインストールします

ドキュメント

Apple HIG: Platform Design

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

Key Principles

  1. Each platform has a distinct identity. Do not port designs between platforms. Respect each platform's conventions, interaction models, and user expectations.

  2. iOS: touch-first. Direct manipulation on a handheld screen. Optimize for one-handed use. Navigation uses tab bars and push/pop stacks.

  3. iPadOS: expanded canvas. Support Split View, Slide Over, and Stage Manager. Use sidebars and multi-column layouts. Support pointer and keyboard alongside touch.

  4. macOS: pointer and keyboard. Dense information display is acceptable. Use menu bars, toolbars, and keyboard shortcuts extensively. Windows are resizable with precise control.

  5. tvOS: remote and focus. Viewed from a distance. Design for the Siri Remote with focus-based navigation. Large text, simple layouts, linear navigation.

  6. visionOS: spatial interaction. 3D environment using windows, volumes, and spaces. Eye tracking for targeting, indirect gestures for interaction. Respect ergonomic comfort zones.

  7. watchOS: glanceable and brief. Information consumable at a glance. Brief interactions. Digital Crown, haptics, and complications for timely content.

  8. Games: own paradigm. Free to define in-game interaction models, but still respect platform conventions for system interactions (notifications, accessibility, controllers).

Reference Index

ReferenceTopicKey content
designing-for-ios.mdiOSTouch, tab bars, navigation stacks, gestures, screen sizes, safe areas
designing-for-ipados.mdiPadOSMultitasking, sidebars, pointer, keyboard, Apple Pencil, Stage Manager
designing-for-macos.mdmacOSMenu bars, toolbars, window management, keyboard shortcuts, dense layouts, Dock
designing-for-tvos.mdtvOSFocus engine, Siri Remote, lean-back experience, content-forward, parallax
designing-for-visionos.mdvisionOSSpatial computing, windows/volumes/spaces, eye tracking, hand gestures, depth
designing-for-watchos.mdwatchOSGlanceable UI, Digital Crown, complications, notifications, haptics
designing-for-games.mdGamesControllers, immersive experiences, platform-specific conventions, accessibility

Decision Framework

  1. Identify the primary use context. On the go (iOS/watchOS), at a desk (macOS), on the couch (tvOS), spatial environment (visionOS)?

  2. Match input to interaction. Touch for direct manipulation, pointer for precision, gaze+gesture for spatial, Digital Crown for quick scrolling, remote for focus navigation.

  3. Adapt, don't replicate. A macOS sidebar becomes a tab bar on iPhone. A visionOS volume has no equivalent on watchOS. Translate intent, not implementation.

  4. Leverage platform strengths. Live Activities on iOS, Desktop Widgets on macOS, complications on watchOS, immersive spaces on visionOS.

  5. Maintain brand consistency while respecting each platform's visual language and interaction patterns.

Output Format

  1. Platform-specific recommendations citing relevant HIG sections.
  2. Platform differences table comparing navigation, input, layout, and conventions.
  3. Implementation notes per platform including recommended APIs and adaptation strategies.

Questions to Ask

  1. Which platforms are you targeting?
  2. New app or adapting an existing one? If existing, which platform is the base?
  3. SwiftUI or UIKit/AppKit?
  4. Need to support older OS versions?
  5. Primary use context? (On the go, desk, couch, spatial, glanceable?)

Related Skills

  • hig-foundations -- Shared principles (color, typography, accessibility, layout) across platforms
  • hig-patterns -- Interaction patterns that manifest differently per platform
  • hig-components-layout -- Navigation structures (tab bars, sidebars, split views) that vary by platform
  • hig-components-content -- Content display that adapts across platforms

Built by Raintree Technology · More developer tools

GitHub リポジトリ

raintree-technology/claude-starter
パス: templates/.claude/skills/hig-platforms
0
ai-toolsanthropicclaudeclaude-aiclaude-codedeveloper-tools

関連スキル

content-collections

メタ

このスキルは、Content Collections（Markdown/MDXファイルを型安全なデータコレクションに変換するTypeScriptファーストのツール）の本番環境でテストされた設定を提供します。Zodバリデーションによる型安全性を実現し、ブログ、ドキュメントサイト、コンテンツ重視のVite + Reactアプリケーション構築時にご利用ください。Viteプラグインの設定、MDXコンパイルから、デプロイ最適化、スキーマバリデーションまで、すべてを網羅しています。

スキルを見る

polymarket

メタ

このスキルは、開発者がPolymarket予測市場プラットフォームを活用したアプリケーション構築を可能にします。API統合による取引や市場データの取得に加え、WebSocketを介したリアルタイムデータストリーミングにより、ライブ取引や市場活動を監視できます。取引戦略の実装や、ライブ市場更新を処理するツールの作成にご利用ください。

スキルを見る

creating-opencode-plugins

メタ

このスキルは、開発者がコマンド、ファイル、LSP操作など25種類以上のイベントタイプにフックするOpenCodeプラグインを作成することを支援します。JavaScript/TypeScriptモジュール向けに、プラグイン構造、イベントAPI仕様、および実装パターンを提供します。カスタムイベント駆動ロジックでOpenCode AIアシスタントのライフサイクルをインターセプト、監視、または拡張する必要がある場合にご利用ください。

スキルを見る

sglang

メタ

SGLangは、高性能なLLMサービングフレームワークであり、RadixAttentionプレフィックスキャッシュを活用したJSON、正規表現、エージェントワークフロー向けの高速で構造化された生成を特長とします。特にプレフィックスが繰り返されるタスクにおいて、大幅に高速な推論を実現し、複雑な構造化出力やマルチターン対話に最適です。制約付きデコードが必要な場合や、広範なプレフィックス共有を伴うアプリケーションを構築する場合は、vLLMなどの代替案ではなくSGLangを選択してください。

スキルを見る