Vonage Video Reference App (Web) v1.5.0 リリースと日本語対応パッチ

本記事では、2026年6月にリリースされた Vonage Video Reference App (Web) v1.5.0 のアップデートのサマリーとその日本語対応（フロントエンド画面およびライブ文字起こし機能）パッチを作成しましたのでご案内します。

1. Vonage Video Reference App (Web) v1.5.0 概要

（2026年6月リリース）

Vonage Video Reference App (Web) v1.5.0 では、ビデオ通話体験の向上、セキュリティの強化、および最新の Vonage Video API（旧 TokBox OpenTok）の新機能への対応が行われました。

🚀 主な新機能と改善点

レイアウト管理の最適化: 複数人の参加者がいるカンファレンスにおけるグリッドレイアウトのレンダリングパフォーマンスが大幅に向上しました。
Audio/Video トグルの挙動安定化: デバイスの切り替えや、ネットワーク瞬断時の再接続ロジックが強化され、音声・映像の途切れが軽減されました。
最新SDKへの追従: @opentok/client（Vonage Video Express / WebRTC SDK）の最新パッチバージョンに対応し、ブラウザ互換性（特に Safari および Chromium 系最新版）が向上しています。
UI/UXのクリーンアップ: 設定画面やコントロールバーのコンポーネントが整理され、モダンなデザインにブラッシュアップされました。

Video API Reference App for Desktop (Web) Release Notes

2. 日本語対応（Front ＆文字起こし）パッチの紹介

公式のリファレンスアプリはデフォルトで英語環境を前提としていますが、日本のビジネスシーンやコミュニティでの利用を想定し、フロントエンドの完全日本語化および日本語文字起こしに対応させるパッチ（ブランチ）をご紹介します。

リポジトリ・対象ブランチ: masayukimiyazawa/vonage-video-react-app (JP-language-support)

🛠️ パッチによる主な変更・追加機能

① フロントエンド UI の完全日本語化 (`Front`)

メニュー・設定画面のローカライズ:
- ボタン、ダイアログ、ツールチップ、設定メニュー（カメラ・マイク選択など）がすべて自然な日本語に翻訳されています。
- エラーメッセージ（「カメラのアクセスが拒否されました」など）も日本語化され、一般ユーザーがトラブルシューティングしやすくなりました。
レイアウト調整: 英語から日本語への変更に伴うフォントの崩れや、テキスト長の変更によるボタンのレイアウト崩れが綺麗に調整されています。

② リアルタイム日本語文字起こし機能 (`Transcription`)

Vonage Live Captions (Audio-to-Text) の日本語最適化:
- Vonage Video API が提供するリアルタイム文字起こし機能において、言語コードを ja-JP（日本語）に最適化。
- ミーティング中の発言が即座に日本語のテキストとして画面下部に字幕表示されます。
文字起こしログの表示・保存:
- 会話の流れを後から追えるよう、サイドパネルにタイムスタンプ付きの日本語文字起こしログが一覧表示される機能が追加されています。
- これにより、ミーティングの簡易的な議事録作成としても活用可能です。

3. クイックスタート（導入方法）

この日本語対応パッチをローカル環境で試すための手順です。

# 1. リポジトリのクローン
git clone [https://github.com/masayukimiyazawa/vonage-video-react-app.git](https://github.com/masayukimiyazawa/vonage-video-react-app.git)
cd vonage-video-react-app

# 2. 日本語対応パッチブランチへの切り替え
git checkout JP-language-support

# 3. 依存関係のインストール
npm install

# 4. 環境変数の設定 (.env の作成)
# 取得した Vonage Video API の API Key, Session ID, Token などを設定します
cp .env.example .env

# 5. アプリケーションの起動
npm start

4. VCR (Vonage Cloud Runtime) への展開方法

本アプリケーションを Vonage が提供するサーバーレスプラットフォーム VCR (Vonage Cloud Runtime) へ展開し、クラウド上で一般公開する手順です。

📋 前提条件

Vonageアカウントの作成および Vonage CLI のインストール・初期設定が完了していること
VCRプラグインがインストールされていること（vcr コマンドが使用可能な状態）

🛠️ 展開ステップ

# 1. Vonage CLI へのログイン（未ログインの場合）
vonage login

# 2. プロジェクトルートにある vcr.yml の確認・編集
# 必要に応じて、リージョンやインスタンスのスペック、環境変数のマッピングを調整します。

# 3. VCR上でのシークレット・環境変数の設定
# アプリケーションの実行に必要な Video API の認証情報を VCR 側に登録します。
vcr secret:set VIDEO_API_KEY="あなたのAPIキー"
vcr secret:set VIDEO_API_SECRET="あなたのAPIシークレット"

# 4. クラウドへのデプロイ実行
vcr deploy

🔗 展開完了の確認

デプロイが成功すると、ターミナルに以下のようなアプリケーションの公開URL（Live URL）が表示されます。

Deployment successful!
Your application is live at: [https://vcr-xxxxx-xxxxx.env.vonage.com](https://vcr-xxxxx-xxxxx.env.vonage.com)

5. まとめ

Vonage Video Reference App v1.5.0 の堅牢なベースの上にこの日本語対応パッチを適用し、VCR (Vonage Cloud Runtime) へ展開することで、サーバーなどのインフラ管理を一切することなく、日本国内向けのビデオ通話ソリューションや内製化アプリのプロトタイプを簡単に構築できるようになります。

フロントエンドの分かりやすさと、日本語文字起こし（Live Captions）によるアクセシビリティおよび議事録作成の利便性を、ぜひクラウド環境で体験してみてください。