mcpField
H
hig-components-system

hig-components-system

github.com/sickn33デザイン・UI48.7k50 回インストール今日更新
リポジトリ

hig-components-system について

hig-components-systemは、アプリのメイン画面以外にあるAppleのシステム画面を設計する開発者向けのスキルです。ウィジェット、Live Activities、通知、コンプリケーション、App Clipsなどについて、表示内容、更新、操作の指針を提供します。

主な機能

  1. 01Appleシステム体験の設計指針
  2. 02ウィジェットとLive Activitiesを網羅
  3. 03通知とコンプリケーションの助言
  4. 04App Clipsとショートカットの設計情報
  5. 05プラットフォーム別のコンテンツと操作の指針

活用シーン

  1. 01ひと目で分かるウィジェットの計画
  2. 02配送追跡Live Activityの設計
  3. 03通知の内容とアクションの確認
  4. 04アプリ機能に適したAppleシステム画面の選定

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill hig-components-system

インストール後、Claude Code で/hig-components-systemを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
complications.md
top-shelf.md
home-screen-quick-actions.md
watch-faces.md
notifications.md
app-clips.md
app-shortcuts.md
widgets.md
live-activities.md

詳細

Apple HIG:システムエクスペリエンス

プロジェクトに .claude/apple-design-context.md が含まれている場合は、プロジェクトのコンテキストとして読み込んでください。このスキルの使用に、そのファイルを必須にしたり、グローバル設定を作成したりしないでください。確認するのは、まだ不足している対象プラットフォーム、コンテンツ、制約だけです。

主な原則

全般
  1. 一目でわかり、すぐに価値が伝わること。 システムエクスペリエンスは、アプリを起動せずにユーザーが目にする画面へ、アプリの最も重要なコンテンツを表示します。数秒の注目で伝わるように設計してください。

  2. プラットフォームのコンテキストを尊重すること。 ロック画面ウィジェットには、ホーム画面ウィジェットとは異なる制約があります。コンプリケーションは、トップシェルフの項目よりはるかに小さいものです。

ウィジェット
  1. すべてではなく、関連性の高い情報を表示すること。 最も役立つ情報に絞って表示し、適切に更新してください。

  2. サイズごとに異なるレイアウトで複数のサイズに対応すること。 各サイズは、別のサイズを拡大・縮小したものではなく、よく考えられたデザインにしてください。

  3. タップ時にディープリンクすること。 ユーザーをアプリのルート画面ではなく、関連するコンテンツに移動させてください。

ライブアクティビティ
  1. 開始と終了が明確なイベントを追跡すること。 配達、スコア、タイマー、乗車などが対象です。Dynamic Island とロック画面の両方に対応するよう設計してください。

  2. 最新の状態を保ち、適切なタイミングで更新すること。 古いデータは信頼を損ないます。イベントが終了したら、速やかに終了してください。

通知
  1. ユーザーの注意を尊重すること。 ユーザーが本当に必要とする情報だけを通知してください。価値の低い通知は避けてください。プロモーション通知には、明示的なオプトインと現行プラットフォームルールへの準拠が必要です。アプリのインストールを同意とみなしてはいけません。

  2. 実用的で、通知だけで内容が完結していること。 アプリを開かなくても理解して操作できるだけのコンテキストを含めてください。通知アクションに対応し、スレッド化とグループ化を活用してください。

コンプリケーション
  1. 文字盤に表示するデータを絞ること。 最新のコンプリケーションには WidgetKit を使用してください。従来の ClockKit テンプレートは、WidgetKit のレイアウトに一対一で対応するものではありません。実用性を保てる最小の表現を設計してください。複数のファミリーに対応し、更新予算を賢く配分してください。
ホーム画面のクイックアクション
  1. 最もよく使われるタスクを 3~4 個用意すること。 短いタイトル、必要に応じたサブタイトル、関連性の高い SF Symbol アイコンを使ってください。
トップシェルフ
  1. tvOS のショーケースです。 新しいエピソード、おすすめの項目、最近のコンテンツなど、ユーザーの関心を引くコンテンツを取り上げてください。
App Clips
  1. 厳しいサイズ制限のもとで、すぐに使える目的に特化した機能を提供すること。 アプリ全体をインストールせずに、小さな App Clip をダウンロードして起動できるようにしてください。目の前のタスクに必要なものだけを含め、その後、フルアプリのインストールを案内してください。
App Shortcuts
  1. Siri と Spotlight から重要なアクションを呼び出せるようにすること。 よく使われるタスクのショートカットを定義してください。自然な会話で使える呼び出しフレーズを使ってください。

リファレンス一覧

リファレンストピック主な内容
widgets.mdウィジェット一目でわかる情報、サイズ、ディープリンク、タイムライン
live-activities.mdライブアクティビティリアルタイム追跡、Dynamic Island、ロック画面
notifications.md通知注意、アクション、グループ化、コンテンツ
complications.mdコンプリケーション文字盤のデータ、ファミリー、更新予算
home-screen-quick-actions.mdクイックアクションHaptic Touch、よく使われるタスク、SF Symbols
top-shelf.mdトップシェルフおすすめコンテンツ、ショーケース
app-clips.mdApp Clipsすぐに使えること、軽量であること、目的に特化したタスク、NFC/QR
watch-faces.md文字盤カスタムコンプリケーション、文字盤の共有
app-shortcuts.mdApp ShortcutsSiri、Spotlight、音声による呼び出し

出力形式

  1. システムエクスペリエンスの推奨 -- ユースケースに最適な画面。
  2. コンテンツ戦略 -- 表示する内容、優先順位、省く内容。
  3. 更新頻度 -- システムの予算制約を含む更新レート。
  4. サイズ/ファミリーごとのバリエーション -- 対応するものと、レイアウトの調整方法。
  5. ディープリンクの動作 -- タップしたときにユーザーが移動する先。

確認する質問

  1. アプリの外部にどの情報を表示する必要がありますか?
  2. 対象プラットフォームはどれですか?
  3. データはどのくらいの頻度で更新されますか?
  4. ひと目で確認する必要がある主な情報は何ですか?

関連スキル

  • hig-components-status -- ウィジェットや Live Activities の進行状況インジケーター
  • hig-inputs -- システム機能の操作パターン(コンプリケーションでの Digital Crown など)
  • hig-technologies -- App Shortcuts の Siri、コンプリケーションの HealthKit、App Clips の NFC

制作:Raintree Technology · その他の開発者向けツール

使用する場面

メインアプリの外にある Apple のシステム機能(ウィジェット、Live Activities、通知、Apple Watch のコンプリケーション、ホーム画面のクイックアクション、tvOS Top Shelf、App Clips、App Shortcuts)を設計するときに使用します。リファレンスを適用する前に、対象プラットフォームと OS のバージョンを選択してください。

例

ユーザーのリクエスト:

iPhone 向けの配送追跡 Live Activity を設計してください。古い情報を明確に示す状態、アクセシブルなラベル、プライバシーに配慮したロック画面の表示、明示的な終了状態を含めてください。

対応する表示形式、データのタイムスタンプ、ActivityKit による更新と終了の処理、デバイスのテストマトリクスを提案してください。デザイン依頼の一環として、リアルタイム配送を約束したり、プッシュ通知キャンペーンを開始したりしないでください。

制限事項

  • タスクが上記の説明に明確に合致する場合に限り、このスキルを使用してください。
  • 出力を、環境固有の検証、テスト、専門家によるレビューの代わりとして扱わないでください。
  • 必要な入力、権限、安全上の境界、成功条件が不足している場合は、作業を中断して確認してください。

実装上の境界

インポートされたリファレンスは、ローカルで修正されたスナップショットであり、Apple の推奨を意味するものではありません。現在の SDK の提供状況を確認してください。過去のプラットフォーム概要を、API が利用できないことの証明として解釈しないでください。ウィジェットは予算内でタイムラインを使用し、Live Activities は ActivityKit とシステム/APNs の配信制限に従います。どちらもリアルタイム監視を保証するものではありません。古い情報やオフラインの状態を示し、重要な情報はアプリ内でも確認できるようにしてください。App Shortcuts のフレーズに関する制約と、基盤となる App Intent が受け付けるパラメーターを区別してください。

ウォッチフェイスの共有では、既存の対応フェイスにコンプリケーションを設定できますが、サードパーティが任意のフェイスをレンダリングできるようになるわけではありません。プレビューには合成データを使用し、ロック画面、共有テレビ、ウォッチフェイス、Siri の応答では機密情報を伏せてください。Intent やディープリンクのハンドラーでは、認証と認可を再検証してください。起動 URL、通知アクション、ウィジェットのタップによって、購入、アカウント変更、データ開示が許可されるわけではありません。通知の送信、App Clips の公開、バックエンドサービスのデプロイには、それぞれに対応するユーザータスクの範囲が必要です。

コメント