SkyWay

戻る

配信 β版

開発者ドキュメントユーザーガイド配信 β版合成結果プレビューツール

1. アプリケーション概要

本アプリケーションは、複数の映像や音声ストリームをサーバー側でひとつに合成する際の設定や結果を、ローカル環境でシミュレーションできるツールです。

サーバー上で最終的に行う合成の事前確認やレイアウト調整を行うことを目的としています。(音声は出力されません)

最終的に確定した合成の設定は、LiveStreaming API に渡して映像・音声合成に利用できます。

プレビューツール画面

本ツールでは、以下のような操作を行います。

  1. 合成の設定（Composite Setting）の編集
  2. 入力される映像・音声（Publication）のオン/オフ・パラメータ管理
  3. 最終的なレイアウト・プレビューの確認

2. 画面構成

画面は大きく次の2つのエリアに分かれています。

  1. 左側：Composite Setting（JSONエディター）
  2. 右側：Input Publication の管理とプレビュー

2.1. 左側：Composite Setting

  • 目的 サーバー側で合成するための設定を直接編集します。ここで編集した内容がプレビューやサーバーの合成結果に反映されます。

  • 操作方法

    1. プリセット設定（presets）
      • エディター上部にある「presets」ドロップダウンから、あらかじめ用意された合成の設定（例：side by side など）を選択できます。
      • プリセットを選択すると、その設定がテキストエリアに反映されます。
      • プリセットを自由に編集して、お好みの配置に調整することも可能です。
    2. 背景画像の設定（backgroundImage）
      • backgroundImage ボタンから画像ファイルを指定すると、テキストエリア内の合成設定に背景画像の設定が追加されます。
      • テキストエリアへ PNG 画像の Base64 文字列を直接指定することもできます。
      • 背景画像を使用しない場合は省略可能です。
    3. JSONエディターでの編集
      • テキストエリア内に表示されている合成設定を直接編集できます。
      • 合成ルールの詳細については、合成のルールのドキュメントをご参照ください
      • 編集内容は常時プレビューに反映されます。
    4. format ボタン
      • 画面下部の「format」ボタンをクリックすると、エディター内の JSON を整形できます。
    5. エラー時の挙動
      • JSON の記述に誤り（シンタックスエラーなど）がある場合、プレビューは反映されません。
      • エラーメッセージが表示された場合は、内容を確認して原因を特定してください。

2.2. Input Publication

右側エリアの下部には、映像・音声の入力（Publication）を管理するためのリストが表示されています。

  • 各 Publication の操作
    • published: 0から49の数字が割り当てられたボタンをクリックするとボタンの色が反転し Channel に Publish されているものとして扱われ、合成対象に含まれます。
    • disabled: チェックを入れると Publication の state パラメータが disabled になり、合成対象には含まれるが映像・音声はオフ（出力されない）状態になります。
    • detail: パラメータ編集用のモーダルウィンドウを開きます（後述「2.4. detail 編集画面」参照）。

2.3. Preview

右側エリアの上部では、合成結果の見た目を確認するプレビュー画面が表示されます。

  • 左側の JSON エディターで編集した合成設定を元に、Input Publication の設定内容がリアルタイムに合成され、反映されます。

2.4. detail 編集画面（モーダルウィンドウ）

詳細編集モーダル

「detail」ボタンをクリックすると、対象の Publication に紐づくパラメータを編集するモーダルウィンドウが表示されます。

以下のような項目を必要に応じて編集し、「Save」ボタンで確定します。

  • contentType: メディアの種類（例: Video, Audio）
  • originPublisherId: 映像・音声を Publish した Person の ID
  • originPublisherName: 映像・音声を Publish した Person の Name
  • originPublisherMetadata: 映像・音声を Publish した Person の Metadata
  • publicationId: Publication の ID
  • metadata: Publication の Metadata

3. 基本的な操作の流れ

以下は、ツールを使って合成設定を作成・調整する際のおおまかな手順です。

3.1. Composite Setting の編集

  1. プリセット選択: presets から用途に近い合成設定を選択する（ゼロから作る場合は plain など）。
  2. JSON 編集: 左側のテキストエリアで合成の設定を編集する。
  3. format ボタン: 必要に応じて JSON を整形する。

3.2. Input Publication の設定

  1. 右側の「Input Publication」一覧で合成対象に含めたい映像・音声の Publication にて "published" ボタンをクリックする。
  2. 一時的に映像・音声をオフにしたい場合は disabled にチェックを入れて出力をオフにする。
  3. さらに詳細を設定したい場合は「detail」ボタンでモーダルを開き、各種パラメータを編集して「Save」。

3.3. プレビューの確認

  • 右側の「Preview」で、設定したレイアウトで合成した際の画面イメージを確認。
  • Input Publication のオン/オフ変更や、detail モーダルでのパラメータ変更が想定通り反映されているかチェックする。

3.4. 合成設定の確定・API への連携

  • 合成の設定が固まったら、テキストエリアの JSON をコピーして LiveStreaming API で利用できます。
  • 実際の合成結果はライブストリーミングサービスの配信画面などでご確認ください。

開発ガイド

概要