Opus 5.5 サーバーレスエージェントによる動画生成システム解説

Opus 5.5 は、LLM が脚本を執筆し、サーバーレスエージェントがそれをそのまま動画としてレンダリングする新しいアプローチです。

基本概要・事例

• URL 投入方式: Web サイトの URL を入力または製品説明を受け付けると処理を開始します。
• 単一プロセス: すべてが 1 つの実行プロセス内で完結し、後からの編集は一切不要です。
  • 入力: URL またはプロンプト
  • 出力: MP4 ファイル
• リソース目安: 動画 1 本あたり約 4 分、消費トークン数約 10 万。
• 事例作品: TypeSafe AI による

  typesafe.ai

  の制作。

動作原理・アーキテクチャ

OpenComputer を基盤としたサーバーレスエージェントがすべてを制御します。ワンクリックでローカル環境へ展開可能です。

システム構成

製品は以下の要素だけで構成されています：

• エージェント定義ファイル
• ツール 3 つ
• 入力フォーム

OpenComputer 内の役割分担:

• エージェントの実行
• 動画レンダリング用マイクロ VM の管理
• モデルゲートウェイの提供
• セッション API（ページからのポーリング対応）

アーキテクチャの特徴

• 言語: TypeScript
• 依存関係: 独自のフレームワーク、キュー、サーバーは一切使用しません。
• 展開コマンド:

  opencomputer deploy
  

モデル・実行環境

使用モデル

• モデル名:

  anthropic/claude-opus-5.5

• トークン消費量 (動画あたり):
  • 入力: 約 9 万トークン（大部分は HTML 生成）
  • 出力: 約 1.5 万トークン

実行環境（マイクロ VM）

各タスクは新規のマイクロ仮想マシンで独立して処理されます。

• OS: Amazon Linux 2023 (arm64)
• CPU: 4 コア (vCPU)
• メモリ: 8GB
• ランタイム: Node.js 22

セットアップフロー:

1. 最初のツールコールで Playwright (Headless Chromium) と ffmpeg をインストール（約 1 分）。
2. タスク終了後、VM は即座に破棄されます。

ツール定義

エージェントが使用可能な 3 つの関数：

web_fetch

check_scene

render_video

レンダリング技術詳細

生成モデルは直接使用せず、仮想クロック技術により決定論的な再生を実現しています。

• 時空制御:

  requestAnimationFrame

  、タイマー、

  Date

  オブジェクト、CSS、Web Animations API を仮想クロックで置き換えます。これによりフレームを任意のポイントからシーク可能になります。
• 解像度・フレームレート: 1920x1080 / 30fps
• エンコーダ: JPEG フレームを

  libx264

  にパイプし、CRF (品質設定) を 18 に固定します。

セキュリティ・ストレージ管理

• 秘密情報の保持: エージェント自体は機密情報を保持しません。
• 認証トークン管理:
  • Vercel Blob がアップロードトークンを発行。
  • スコープ：特定のパスに制限され、3 時間有効期間を持つ。
  • メリット：各タスクのマニフェストに保存され、ツール側で

    taskId

    を指定して安全に取得可能。
• 公開アクセス: 完了した MP4 ファイルは、パブリックな Blob URL で公開されます。

管理平面（コントロールプレーン）

CLI と同等の API を利用し、以下のような監視が可能です：

• セッション作成・ターン送付
• イベントストリーミングによる進行状況表示 (

  tool.started

  ,

  tool.completed

  ,

  turn.completed

  など)
• MP4 ファイルが Blob にアップロードされた時点で完了と判定

実装コード例 (TypeScript)

エージェントの定義は以下の通りです。

// opencomputer/agents/director/agent.ts
import { useInput, useModel, useTool } from "@opencomputer/agent";
import { checkScene, renderVideo } from "./tools/scene.js";
import { webFetch } from "./tools/web.js";

export default function Agent() {
  const input = useInput();           // フォームの JOB ブロックから入力取得
  useModel("anthropic/claude-opus-5.5");
  
  useTool(webFetch);                  // 製品サイトを読み取る
  useTool(checkScene);                // HTML 読み込み、エラー・表示テキスト報告
  useTool(renderVideo);               // ヘッドレス Chromium → ffmpeg → Blob
  
  return `あなたはコードを書くモーションデザイナーです。...`; // プロンプト設定
}

ワンクリック展開コマンド例：

npx opencomputer template deploy https://github.com/diggerhq/shipvideo

背景とインサイト

このプロジェクトのアイデアは、Deedy 氏の投稿に由来します。

• 核心概念: モデルがコード形式で脚本を執筆し、そのコードに基づいて毎回同じ結果（動画）をレンダリングさせる仕組みです。