WWDC Quick Look 💓 By SwiftGGTeam
CarPlayアプリを加速する

CarPlayアプリを加速する

元の動画を見る

ハイライト

iOS 27はCarPlayに、動画アプリ、音声対話アプリ、ナビゲーションパネル、ルート共有という4つの大きな新機能を導入します。開発者はCarPlayフレームワークを使い、車載画面上に動画ブラウズUI、音声操作インターフェイス、より柔軟なナビゲーションパネルを直接構築できます。同時に、車両の運転支援システムがナビゲーションルートを読み取れるようになります。

主要内容

動画アプリ: AirPlayからネイティブブラウズへ

以前、ユーザーが車内で動画を見たい場合、iPhoneで再生してからAirPlayで車載画面へ投影するしかありませんでした。操作経路は長く、車載画面で直接コンテンツをブラウズすることもできませんでした。

iOS 27ではCarPlay動画アプリカテゴリが追加されました。車両がvideo in car機能をサポートしていれば、アプリは車載画面上で動画リスト、サムネイル、詳細ページを直接表示できます。駐車中、ユーザーは充電待ちに動画を見るような場面で、ブラウズから再生までの一連の流れを車載画面で完結できます。

動画アプリには2つの条件があります。AirPlay動画ストリーミングをサポートすること、そしてCarPlayフレームワークを使ってブラウズインターフェイスを提供することです。車両が現在動画再生を許可していない場合、コンテンツは自動的にaudio-only再生へ降格します。これはポッドキャストやスポーツライブ配信に便利です。

音声対話アプリ: ナビゲーション専用から全カテゴリへ

音声対話アプリは年初にすでに登場していましたが、当初は特定カテゴリに限定されていました。iOS 27では、すべてのCarPlayアプリカテゴリへ開放されます。

アプリは車載画面上で音声指示に応答し、操作を実行できるようになりました。Voice Controlテンプレートはフルスクリーンと浮動レイヤーの2種類の表示方式に対応します。浮動レイヤーモードは特にナビゲーションアプリに適しており、マップテンプレートの上に重ねて表示できるため、ユーザーは地図を見ながら音声で操作できます。

ナビゲーションパネル: 固定テンプレートから自由な組み合わせへ

以前のCarPlayナビゲーションアプリは固定テンプレートの流れに制約され、ルート選択肢や行程情報を柔軟に表示しにくいものでした。

iOS 27のPanelにより、ナビゲーションアプリはマップのメイン画面上で、trip、grid、route choice、waypoint、リスト項目など、複数のUI要素を自由に組み合わせられます。パネル下部には「開始」や「終了」などの操作ボタンも構成できます。地図は常に表示され、コンテンツがその上に重なります。

ルート共有: 車両の運転支援システムにナビゲーションを理解させる

これは見落とされやすいものの、影響の大きい機能です。運転支援システムを備えた多くの車両は、自動車線変更、誘導システムの調整、電気自動車向けの充電ステーション計画のために、走行ルートを知る必要があります。

以前はCarPlayナビゲーションアプリと車両システムが分断されていました。iOS 27のRoute Sharingにより、ナビゲーションアプリは地理座標配列の形式でルートを車両へ同期できます。車両はそれに基づいて充電ステーションなどの経由地を提案できます。ナビゲーションアプリは提案を受け取った後、自動的にユーザーへ確認を促すことも、自分で確認フローを管理することもできます。

詳細

動画ブラウズUIの新API

02:16)CarPlayフレームワークは、動画ブラウズ向けの完全なUIコンポーネントを提供します。

リストは縦横2種類のアスペクト比の画像をサポートします。Card要素はさらに進み、サムネイルのオーバーレイ、再生進捗、モーション情報に対応します。

// オーバーレイ付きサムネイルを作成する
let overlay = CPImageOverlay(image: badgeImage)
let thumbnail = CPImageSet(
    light: landmarkImage,
    dark: landmarkImage
)

// 再生メタデータを設定する
let playbackConfig = CPPlaybackConfiguration(
    elapsedTime: 120,
    duration: 600,
    playbackAction: .play
)
playbackConfig.preferredPresentation = .video

// リスト項目にまとめる
let item = CPListItem(
    text: "Alps",
    detailText: "Switzerland"
)
item.setImage(thumbnail)
item.imageOverlay = overlay
item.playbackConfiguration = playbackConfig

重要ポイント:

  • CPImageOverlayは文字または画像で、「新着」や「ライブ中」などの状態を示すために使える
  • CPPlaybackConfigurationpreferredPresentationは、コンテンツを動画優先で再生するか、音声優先で再生するかを決める
  • playbackActionはタップ後の挙動を制御する。再生、一時停止、リプレイなど
  • 再生状態が変わったらplaybackConfigurationをすぐに更新し、サムネイル上の進捗バーが同期されるようにする

05:29)Details Headerは、リスト上部で1つのコンテンツを目立たせるのに向いています。

let header = CPDetailsHeader(
    title: "Eiffel Tower",
    subtitle: "Paris, France",
    body: "Completed in 1889...",
    image: thumbnail
)
header.playbackConfiguration = playbackConfig
header.actionButtons = [
    CPBarButton(type: .text, title: "Play", handler: { _ in }),
    CPBarButton(type: .text, title: "Add to Playlist", handler: { _ in })
]

let template = CPListTemplate(title: "Landmarks", sections: [
    CPListSection(items: relatedVideos, header: header)
])

重要ポイント:

  • Details Headerはサムネイル、タイトル、本文、再生構成、操作ボタンをまとめる
  • 再生進捗は最初の操作ボタンと自動的に組み合わされて表示される
  • 状態が変わったらplaybackConfigurationを更新し、ユーザーが戻ったときに正しい進捗が見えるようにする

MiniPlayer制御

06:22)iOS 27ではNow PlayingテンプレートにMiniPlayerが追加され、Now Playingを使うすべてのアプリが自動的にこの機能を得ます。大画面デバイスではMiniPlayer上で直接、再生、一時停止、スキップができます。

アプリにMiniPlayerが不要な場合は、無効にできます。

// MiniPlayer を無効にし、代わりにナビゲーションバーアイコンを使う
CPNowPlayingTemplate.shared.allowsMiniPlayer = false

重要ポイント:

  • デフォルトで有効で、追加コードは不要
  • 無効にすると、Now Playing入口はナビゲーションバーアイコンとして表示される

Voice Controlテンプレート

07:08)Voice Controlテンプレートはすべてのアプリカテゴリに開放され、フルスクリーンと浮動レイヤーの2つのモードをサポートします。

// 音声コントロールをオーバーレイとして表示する
let voiceTemplate = CPVoiceControlTemplate(
    title: "Ask about landmarks",
    subtitle: nil,
    image: nil,
    actionButtons: [
        CPBarButton(type: .text, title: "Navigate", handler: { _ in })
    ]
)
interfaceController.presentTemplate(voiceTemplate, animated: true)

// オーバーレイとして表示する
interfaceController.presentTemplate(
    voiceTemplate,
    animated: true,
    presentationStyle: .overlay
)

重要ポイント:

  • 浮動レイヤーモードでは利用できる空間が小さいため、文言はより短くする
  • 最大2つの操作ボタンに加えて、ナビゲーションバーのleading/trailingボタンも使える
  • URLを開く方式でナビゲーションや電話発信を起動できる: CPTemplateApplicationScene.shared.open(url)
  • AVAudioSessionをplayAndRecordカテゴリで構成し、音声フィードバックで対話状態を示すことが推奨される

ナビゲーションPanel

12:03)ナビゲーションアプリはPanelを使って複数の要素を組み合わせられます。

let panel = CPPanel(
    items: [
        trip,
        routeChoice,
        waypointList,
        gridItem
    ],
    buttonConfiguration: CPButtonConfiguration(
        primaryAction: .go,
        secondaryAction: .end
    )
)
mapTemplate.pushPanel(panel, animated: true)

重要ポイント:

  • PanelのitemsにはCPTripCPRouteChoiceCPWaypointCPGridButtonなど複数の型を混在させられる
  • buttonConfigurationはパネル下部の操作ボタンを構成する
  • Panelをpushした後、ナビゲーションアプリはマップテンプレートのメイン画面領域を制御する
  • 地図は常に見え、Panelの内容がその上に重なる

ルート共有

15:06)ナビゲーションアプリはMap Templateのdelegateメソッドでルート共有を有効にします。

// ルート共有を有効にする
func mapTemplateShouldProvideRouteSharing(_ mapTemplate: CPMapTemplate) -> Bool {
    return true
}

単一のtripで無効にする場合:

// この行程はルート共有に参加しない
trip.routeSegmentsAvailableForRegion = false

重要ポイント:

  • iOS 26.4以上と対応車両が必要
  • ユーザーは車両を初めてペアリングするときにルート共有を許可する必要がある
  • ルートは地理座標配列(route segments)の形式で車両へ送信される
  • 車両は充電ステーションなどの経由地を提案でき、CPMapTemplateのdelegateメソッドで受け取る
  • ナビゲーションアプリが更新後の行程推定時間を返すと、マップテンプレートが自動的にユーザーへ確認を促す。推定時間を返さず、自分で確認フローを管理することもできる

主な示唆

充電待ち向けの動画コンテンツを作る

何をするか: 電気自動車の充電は通常20-40分かかります。アプリに動画コンテンツ(チュートリアル、ニュース、スポーツなど)があるなら、CarPlay動画アプリとして作り、ユーザーが充電待ちに車載画面で直接ブラウズして再生できるようにします。

なぜやる価値があるか: 充電待ちは車内スクリーン利用の高頻度シーンですが、以前はAirPlayミラーリングしかできず、操作経路が長く、車載画面で直接ブラウズできませんでした。ネイティブCarPlay動画アプリなら、ブラウズから再生までの完全な流れを車載画面で完結できます。

始め方: CarPlay video entitlementを申請し、CPTabBarTemplateで動画タブを追加し、アプリがAirPlay動画ストリーミングにも対応していることを確認します。

複雑なリスト操作を音声対話に置き換える

何をするか: 運転中は、リストを何階層もタップするより、「お気に入りのポッドキャストを再生して」と話すほうが安全です。CPVoiceControlTemplateを使い、検索や推薦機能を音声操作にします。

なぜやる価値があるか: 運転中に画面を操作することには安全上のリスクがあります。音声操作なら、ユーザーは視線を路面から離さずに操作を完了できます。浮動レイヤーモードは既存画面の上に重ねられ、現在の操作フローを中断しません。

始め方: CPVoiceControlTemplateで音声制御画面を作成し、AVAudioSessionをplayAndRecordカテゴリで構成し、音声フィードバックで対話状態を示します。

ナビゲーションアプリを車両の運転支援と連携させる

何をするか: ルート共有を有効にすると、運転支援システムを備えた車両は、あなたのルートに基づいて自動車線変更や充電計画を行えます。

なぜやる価値があるか: 以前はCarPlayナビゲーションアプリと車両システムが分断され、車両の運転支援はユーザーの走行ルートを知りませんでした。ルート共有によりナビゲーションアプリはルートを車両へ同期し、車両は充電ステーションなどの経由地を提案できるため、運転体験が向上します。

始め方: mapTemplateShouldProvideRouteSharingを実装してtrueを返し、CPTriprouteSegmentsを設定し、CPMapTemplateDelegateで車両から提案された経由地を受け取ります。

Details Headerでコンテンツ推薦を作る

何をするか: 動画または音声アプリでは、CPDetailsHeaderを使ってリスト上部に「今日のおすすめ」や「続きを見る」を目立たせ、その下に関連コンテンツを並べます。

なぜやる価値があるか: 平坦なリストには階層感がなく、ユーザーは重要なコンテンツを見つけるために長くスクロールしなければなりません。Details Headerはサムネイル、タイトル、本文、再生構成、操作ボタンをまとめ、ユーザーが一目で重要な項目を見つけられるようにします。

始め方: CPDetailsHeaderインスタンスを作成し、タイトル、サブタイトル、本文、画像を設定し、playbackConfigurationactionButtonsを構成し、CPListSectionのheaderとして使います。

Panelでより豊かなナビゲーション画面を作る

何をするか: ナビゲーションアプリは固定されたルートプレビューや選択フローに制限されなくなりました。Panelを使って、地図上にルート概要、経由地リスト、クイック操作ボタンを同時に表示します。

なぜやる価値があるか: 以前のCarPlayナビゲーションアプリは固定テンプレートに制限され、ルート選択肢や行程情報を柔軟に表示しにくいものでした。Panelは複数のUI要素を自由に組み合わせられ、地図は常に表示されたままなので、ユーザーは1画面でより多くの情報を確認できます。

始め方: CPPanelを作成し、itemsCPTripCPRouteChoiceCPWaypointなどの型を混在させ、buttonConfigurationで下部の操作ボタンを構成し、mapTemplate.pushPanelを呼び出して表示します。

関連セッション

  • SwiftUI — CarPlayアプリにiPhone版もある場合、SwiftUIでUIコードを共有できる
  • Live Activities — CarPlayはすべてのアプリのLive Activitiesとウィジェットをサポートし、専用のCarPlay対応は不要
  • デザイン原則 — 車載画面の設計では、特定の安全性と可読性の原則に従う必要がある
  • App Intentsの新機能 — 音声対話アプリはApp Intentsと組み合わせることで、Siriにより複雑なユーザー指示を理解させられる
  • Xcode 27 — CarPlay SimulatorはDevice Hubに統合されており、Xcode 27で直接テストできる

コメント

GitHub Issues · utterances