hig-components-content

Apple HIG：コンテンツコンポーネント

質問する前に .claude/apple-design-context.md を確認してください。既存のコンテキストを活用し、すでに説明されていない情報についてのみ質問してください。

主な原則

1. さまざまなサイズや状況に対応させます。 コンテンツコンポーネントは、画面サイズ、向き、マルチタスクの構成が異なっても動作する必要があります。フレームワークに適したレイアウトシステム（SwiftUI レイアウトまたは Auto Layout）を使い、利用可能な場合はサイズクラスを使います。

2. コンテンツをアクセシブルにします。 チャートの概要と適切なアクセシブルデータナビゲーションを提供します。Swift Charts には、デフォルトの Audio Graphs 実装が含まれています。意味のある画像には内容を説明するアクセシビリティラベルを設定し、装飾的または重複する画像は非表示にします。コレクションでは、VoiceOver でのナビゲーション順序を論理的にします。

3. 視覚的な階層を保ちます。 間隔、サイズ、グループ化を使って、明確な情報の階層を構成します。主要なコンテンツは視覚的に目立たせます。

4. まずシステムコンポーネントを使います。 カスタム実装を作成する前に、UICollectionView、SwiftUI Charts、WKWebView を検討してください。システムコンポーネントには、アクセシビリティと適応に関するデフォルト設定が用意されています。それでも、ラベル、インタラクション、対応プラットフォームのバージョンはテストしてください。

5. プラットフォームの慣習を尊重します。 tvOS のコレクションでは、視差効果のある大きなロックアップを使います。同じコレクションでも、iOS ではタッチターゲットを備えたコンパクトなセルを使います。visionOS では、コンテンツに奥行きとホバーエフェクトを加えます。

6. 空の状態に対応します。 空白の画面にするのではなく、コンテンツを追加する方法を案内する、意味のある空の状態を表示します。

7. パフォーマンスを最適化します。 大規模なデータセットには、遅延読み込み、セルの再利用、ページネーション、プリフェッチを使います。

リファレンス一覧

リファレンス	トピック	主な内容
charts.md	チャート	Swift Charts、棒・折れ線・面・点のマーク、チャートのアクセシビリティ、オーディオグラフ
collections.md	コレクション	グリッド／リストレイアウト、コンポジションレイアウト、選択、並べ替え、差分可能なデータソース
image-views.md	イメージビュー	アスペクト比の処理、コンテンツモード、SF Symbol 画像、アクセシビリティ
image-wells.md	イメージウェル	ドラッグ＆ドロップによる画像選択、macOS 固有の機能、プレースホルダーコンテンツ
color-wells.md	カラーウェル	色選択 UI、システムカラーピッカー、カスタム色空間
web-views.md	ウェブビュー	WKWebView、SFSafariViewController、ナビゲーションコントロール、コンテンツ制限
activity-views.md	アクティビティビュー	共有シート、アクティビティ項目、カスタムアクティビティ、アクションエクステンション
lockups.md	ロックアップ	画像とテキストの要素、tvOS カードレイアウト、フォーカスエフェクト、シェルフレイアウト

コンポーネント選択ガイド

コンテンツのニーズ	推奨コンポーネント	プラットフォームに関する注意事項
定量データの可視化	チャート（Swift Charts）	iOS 16 以降、macOS 13 以降、watchOS 9 以降
アイテムのグリッドまたはリストの閲覧	コレクションビュー	複雑な配置にはコンポジションレイアウトを使用
単一画像の表示	イメージビュー	アスペクト比に合わせて表示し、アクセシビリティ用の説明を提供
ドラッグまたはブラウズによる画像選択	イメージウェル	主に macOS 向け。iOS ではイメージピッカーを使用
色の選択	カラーウェル	システムカラーピッカーを起動。macOS、iOS 14 以降
ウェブコンテンツのインライン表示	ウェブビュー（WKWebView）	対応する UIKit プラットフォームでは SFSafariViewController を検討してください。macOS では外部リンクにデフォルトのブラウザーを使用してください
コンテンツをほかのアプリと共有	アクティビティビュー	アクティビティの種類を設定できるシステム共有シート
コンテンツカード（画像＋テキスト）	ロックアップ	TVUIKit のロックアップは tvOS 専用です。それ以外ではネイティブコンポーネントを使ってコンテンツカードのパターンに適応させてください

出力形式

1. コンポーネントの推奨と根拠：関連する HIG のリファレンスファイルを参照します。
2. 設定ガイダンス：主要なプロパティとセットアップについて説明します。
3. 推奨コンポーネントのアクセシビリティ要件。
4. 対象プラットフォームに関するプラットフォーム固有の注意事項。

確認する質問

1. コンテンツの種類は何ですか？（定量データ、画像、ウェブコンテンツ、閲覧可能なコレクション、共有アクションなど）
2. 対象プラットフォームはどれですか？
3. コンテンツは静的ですか、それとも動的ですか？
4. コンテンツの量はどのくらいですか？（数個か数百・数千個かによって、コンポーネントの選択と最適化が変わります。）

関連するスキル

• hig-foundations -- カラー、タイポグラフィ、アクセシビリティ、画像のガイドライン
• hig-patterns -- データの視覚化、共有、読み込みのパターン
• hig-components-layout -- コンテンツを格納する構造的なコンテナ（スクロールビュー、リスト、分割ビュー）
• hig-platforms -- プラットフォーム固有のコンポーネントの動作（tvOS のロックアップ、macOS のウェブビュー）

---

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

使用する場面

このスキルは、概要に記載されたワークフローまたはアクションを実行する場合に適用できます。

例

ユーザーのリクエスト：

このタスクには @hig-components-content を使用してください：コンテンツ表示コンポーネントに関する Apple Human Interface Guidelines。

制限事項

• 同梱されている HIG ページはリファレンスのスナップショットであり、最新の互換性マトリックスではありません。対象の SDK とデプロイバージョンで API が利用できることを確認してください。macOS では UIActivityViewController ではなくネイティブの共有 API を使用します。共通する視覚的パターンから API の移植性を推測しないでください。
• このスキルは、タスクが上記の範囲に明確に該当する場合にのみ使用してください。
• 出力を、環境固有の検証、テスト、専門家によるレビューの代わりとして扱わないでください。
• 必要な入力、権限、安全上の境界、成功基準が不足している場合は、作業を中断して確認してください。