mcpField
T
tvos

tvos

github.com/fusengine開発3447 回インストール2 週間前に更新
リポジトリ

tvos について

Apple TV アプリ開発向けの tvOS スキルで、フォーカス操作、メディア再生、リモコン操作、マルチユーザー対応を扱います。tvOS 26 の Liquid Glass の動作や、リビング向け UI の設計指針も説明します。

主な機能

  1. 01フォーカスシステムと視覚的なフィードバック
  2. 02tvOS 26 の Liquid Glass 指針
  3. 03AVKit によるメディア再生
  4. 04Siri Remote のジェスチャー
  5. 05マルチユーザーとコントローラー対応

活用シーン

  1. 01Apple TV アプリの開発
  2. 02フォーカス操作によるナビゲーション設計
  3. 03動画・音声再生の実装
  4. 04リモコン操作とマルチユーザーへの対応

インストール

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

$npx skills add https://github.com/fusengine/claude-plugins --skill tvos

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

詳細

Apple TV のリビングルーム体験に向けた tvOS 固有の開発を扱います。大画面ナビゲーションのフォーカスシステム、TV での Liquid Glass スタイル(tvOS 26)、AVKit によるメディア再生、Siri Remote のジェスチャー処理、マルチユーザー対応、ゲームコントローラーとの連携を取り上げます。

tvOS 26 以降でシステムが適用する Liquid Glass のガイダンス(ボタンや画像はフォーカス時に適用され、手動では追加しない)と、フォーカス状態に応じた拡大エフェクトについて説明します。

ベストプラクティス:10 フィート離れた場所からでも読みやすい UI 要素のサイズ、明確な視覚的フォーカスフィードバック、最小限のナビゲーション階層、リモコンで操作しやすいジェスチャー、メディアを最優先にしたコンテンツの設計、ユーザー切り替えへの対応。

tvOS プラットフォーム

Apple TV のリビングルーム体験に向けた tvOS 固有の開発です。

エージェントのワークフロー(必須)

実装の前に、必ず 3 つのエージェントを並行して起動してください。それぞれ 1 回の Agent 呼び出しで、name を指定します。

  1. fuse-ai-pilot:explore-codebase - 既存の tvOS パターンを分析します
  2. fuse-ai-pilot:research-expert - Context7/Exa で最新の tvOS 27 ドキュメントを確認します
  3. mcp__apple-docs__search_apple_docs - tvOS のパターンを確認します

実装後、検証のために fuse-ai-pilot:sniper を実行してください。


概要

使用する場面
  • Apple TV アプリケーションの構築
  • 動画や音声のストリーミング
  • フォーカスベースのナビゲーション
  • Siri Remote とのインタラクション
  • マルチユーザー体験
  • ゲームコントローラーのサポート
tvOS スキルを使う理由
機能メリット
フォーカスシステム大画面でのナビゲーション
Liquid Glassモダンな TV UI(tvOS 26)
メディア再生AVKit との統合
リモコン操作Siri Remote のジェスチャー

tvOS 26 の機能

TV での Liquid Glass

tvOS では、ナビゲーションやシステム体験全体に Liquid Glass が表示されます。ボタンや画像ビューは、フォーカスを得ると自動的に適用されます(HIG https://developer.apple.com/design/human-interface-guidelines/materials)。`glassEffect` を手動で追加しないでください。標準のスタイルとコンポーネントを使用します。

TabView {
    Tab("Home", systemImage: "house") { HomeView() }   // system tab bar gets glass
}

Button("Watch Now") { }
    .buttonStyle(.bordered)   // standard style: system handles the focused appearance

コンテンツレイヤーのオーバーレイには、ガラスではなく標準のマテリアルを使用します。

フォーカスシステム
struct ContentView: View {
    @FocusState private var focused: Bool

    var body: some View {
        Button("Play") { }
            .focused($focused)
            .scaleEffect(focused ? 1.1 : 1.0)
    }
}

リファレンスガイド

必要な情報リファレンス
フォーカス、選択状態focus-system.md
AVKit、動画再生media-playback.md
Siri Remote、ジェスチャーremote-control.md

ベストプラクティス

  1. 大きな UI 要素 - コントロールは標準で 66x66 pt、最小で 56x56 pt、本文テキストは標準で 29 pt、最小で 23 pt(HIG アクセシビリティ)
  2. フォーカスフィードバック - 明確な視覚的表示(HIG フォーカス)
  3. シンプルなナビゲーション - 階層を最小限にする
  4. リモコンで操作しやすく - Siri Remote のジェスチャーに対応する
  5. メディアを最優先 - 動画や音声に合わせて最適化する
  6. マルチユーザー - ユーザー切り替えに対応する

コメント