Skip to content

CH 26 · dsh + Remotion: 1 文から 1 本の動画へ

全文字数1647 字予測所要時間約 30 分前提CH 03、CH 04、CH 14難易度再現可能

本章の目標

この章では dsh を使って完全な動画を 1 本生成します。Remotion 動画作成プラグインをインストールし、テーマを 1 つ与えれば、スクリプトからアニメーション、字幕、ナレーションまで全部やってくれ、最後に MP4 にレンダリングします。この章を終えると、dsh に動画を作ってもらう方法と、初期版の微調整・書き出し方法がわかります。

どのプラグインを使うか: dsh-remotion

この章では dsh-remotion を使います――Remotion 公式のスキルを dsh に移植した動画作成プラグイン、MIT オープンソース、GitHub リポジトリ

Remotion は React でプログラム的に動画を作るフレームワークです――コードを書けばアニメーション、字幕、トランジションを生成し、最終的に MP4 にレンダリングできます。dsh-remotion は Remotion 公式の 38 のルールファイル(アニメーション、音声、字幕、3D、チャート、フォント、トランジションなど)を dsh に登録し、インストール後「Remotion を使って動画を作って」と言うだけでトリガーできます。

ステップ 1: プラグインをインストールする

今回は CH 17 でインストールしたプラグインマーケット(dsh-market)からビジュアルにインストールします――設定 → プラグインマーケットを開き、remotion を検索し、dsh-remotion を見つけて、インストールをクリック:

プラグインマーケットで dsh-remotion を検索

インストールをクリックすると、プラグインマーケットに「インストール済み」と表示され、上部に dsh の再起動が必要とのプロンプトが出ます――「今すぐ再起動」をクリック:

dsh-remotion のインストール成功、再起動で有効化

再起動後、プラグインが有効になります。

環境要件: Node.js ≥ 20;動画レンダリングには ffmpeg が必要(Remotion がインストール手順を用意)。

ステップ 2: 動画生成フローを理解する

インストール後、まず dsh に Remotion で動画を作るフローを簡単に説明させましょう。直接聞きます:

Remotion で動画を作るフローを簡単に紹介してください

Remotion で動画を作る典型的なフローを教えてくれます: スクリプトと絵コンテを書く → Remotion プロジェクト作成 → Composition と React コンポーネントを書く → アニメーション、字幕、音声を追加 → プレビューとデバッグ → MP4 レンダリング。Remotion のコアコンセプトは Composition(動画セグメントを登録し、幅、高さ、フレームレート、総フレーム数を指定)、Sequence(タイムライン、コンポーネントを時間順に並べる)、interpolate / spring(アニメーション)で、最後に npx remotion render で出力します。

dsh が Remotion 動画生成フローを紹介

ステップ 3: テーマを 1 つ与えて、動画を生成する

動画を作る前に、まずテーマを決めます。この章では 「すべてがプラグイン:DeepSeek Harness 1 分紹介」 というショート動画を作ります。

プロンプトは複雑に書く必要はありません、テーマと時間を与えれば、残りの絵コンテ、スクリプト、アニメーションは dsh が自分で計画します:

Remotion を使って紹介動画を作ってください。テーマは「すべてがプラグイン:DeepSeek Harness 入門紹介」、対象は dsh に初めて触れる開発者です。

要件:
- スタイルはミニマル白、アニメーションのデモンストレーション感
- 字幕とナレーション付き(中文ナレーション)
- アニメーション効果を含む(テキストのフェードイン、エレメント遷移)
- トランジション効果を含む(シーン間で異なるトランジションを使用)
- チャートを含む(例: dsh のプラグイン階層を示す簡単なアーキテクチャ図)
- 等幅フォント使用、技術テーマに合う
- 最終的に MP4 にレンダリング

ffmpeg などのレンダリング依存パッケージが不足していれば、自分でインストールしてから続行してください。

このメッセージを dsh に送ります。dsh は Remotion のフローに従いステップごとに進みます――まずスクリプトと絵コンテを書き、次に Remotion プロジェクトを作成し、React コンポーネントを書き、アニメーション、字幕、ナレーションを追加し、最後にレンダリングします。

以下は生成完了後の結果サマリー――実装の要点、5 幕構造、使用技術をすべて明確に記載:

生成完了: 実装ポイントのサマリー

プロンプト送信からレンダリング済みの MP4 を受け取るまで、合計 36 分 50 秒――動画レンダリングは PPT より遅いです、全フレームを計算する必要があるためです。これは単にテーマを軽く与えただけの場合の効果です――プラグインがフローを固定化してくれるので、dsh はステップごとに進めるだけで、毎回ゼロから何を最初にすべきかを探る必要はありません:

生成完了: 5 幕構造と所要時間

ステップ 4: 完成品を受け取る

満足したら、MP4 ファイルはワークスペース内にあり、すぐに使えます。動画プラットフォームに投稿したり、PPT に埋め込んだり、友達に送ったりできます。

以下が完成した動画です――1920×1080、30fps、約 60 秒、H.264 + AAC ステレオ、中文字幕とナレーション付き:

この章で学んだこと

以下の項目を完了できれば合格です:

  • [ ] dsh-remotion プラグインを web profile にインストールできる
  • [ ] dsh に完全な動画を生成させるプロンプトを書ける
  • [ ] Remotion 動画生成の基本フローを知っている
  • [ ] プレビュー結果に基づいて dsh に動画を微調整させられる
  • [ ] レンダリング済みの MP4 ファイルを見つけて再生できる

Open Source · MIT · Community Driven