ブログに戻る
制作と編集 · 14 / 19

初めての15秒 Claude Motion 動画を作る

オープンソース Claude Motion ツールキットで、制作要件、絵コンテ、修正指示、ローカル書き出しの確認まで進める実践ガイド。

この練習では、架空のノートアプリ Fieldnote を紹介するオリジナルの15秒動画を設計します。使用するのは whaleyxbt の Claude Motion ツールキットと Remotion です。推奨する制作手順であり、この例を実際にレンダリングしたという報告ではありません。Anthropic Motion、このツールキット、本サイトの Claude Motion Skills は別の製品です。

小さく明確な目標を決める

視聴者に伝える動作は一つです。散らばったノートを週次サマリーにまとめます。複雑な操作録画から始めず、三つの場面、一つの強調色、文字を使います。この練習では 1080 × 1920、30 fps、15秒、合計450フレームを指定します。生成前に、スマートフォンですべての文言が読める、最後の行動案内が見える、裏付けのない性能を主張しないという合格条件を決めます。承認済みの文言と所有するロゴをプロジェクトに置いてから制作を依頼します。

出典と参考資料: whaleyxbt

アイデアを三つの場面に分ける

0〜4秒は問題提起です。「ノートがあちこちに?」という文字を三枚のカードで囲みます。4〜10秒は説明で、カードが一枚の週次サマリーにまとまります。10〜15秒は Fieldnote と「週の振り返りを、もっと穏やかに」を表示します。これは例示の文言であり、実在製品の約束ではありません。30 fps での境界は0、120、300、450フレームです。登場後は読める静止時間を確保します。文字が画面に収まっても、動き続けていては読みにくくなります。

出典と参考資料: whaleyxbt

最初の指示を具体的に渡す

導入済みのツールキットを開き、下のオリジナルプロンプトを使います。studio コマンドはローカルプレビューを開きます。サンプルの build コマンドは、すべての新規コンポジションを出力する汎用コマンドではありません。

AGENTS.md とプロジェクトのスキルを読んでください。上記の三場面で、15秒、1080 × 1920、30 fps の Fieldnote 紹介動画を制作してください。背景はクリーム色、文字はチャコール、強調色は緑一色。提供した文字と所有素材だけを使用します。絵コンテと名前付きの時点を先に作り、実装、草稿、フレーム確認、切れの修正へ進んでください。初版は無音にし、コンポジションIDと実際の出力先を報告してください。

npm run studio
出典と参考資料: whaleyxbt

確認できる修正を一つ依頼する

草稿を止めずに一度見てから、場面の境目と最も長い文字を確認します。中央のカードの登場が遅ければ、下の修正用プロンプトで調整を依頼します。見える結果と維持事項が明確になります。修正区間を再レンダリングし、エージェントの完了報告だけで判断しないようにします。

第二場面のカードの登場を4.8秒までに完了し、サマリーを9.5秒まで完全に表示してください。第一場面、配色、文言、全体15秒は維持してください。修正した切り替えと影響する時間配置を確認してください
出典と参考資料: whaleyxbt

実際に作ったコンポジションを書き出す

Remotion Studio の Render ダイアログで新しいコンポジションを選ぶか、CLI に実際のIDを指定します。MP4 を書き出し、通常のプレイヤーで寸法、長さ、最初と最後のフレーム、文字の読みやすさを確認します。ソースを残し、完成版には別名を付けます。本サイトを使う場合は編集可能なプロジェクトをダウンロードし、付属の HyperFrames ローカルレンダリング手順に従ってください。上の Remotion の手順はオープンソースツールキット用です。HTML プレビューは確認用であり、投稿する MP4 そのものではありません。

次のステップ

まず明快で読みやすい15秒の物語を完成させてから、場面、ナレーション、別の画面比率を追加しましょう。制作要件を完成ファイルと一緒に保存すると、後の修正で基準を共有できます。

制作ワークスペースを見る

出典と参考資料

出典は公式資料や制作者の公開ページです。提供状況は変わるため、契約やインストールの前にリンク先を確認してください。

  1. Claude Motion toolkitwhaleyxbt
  2. Visual review loopwhaleyxbt
  3. Render your videoRemotion
  4. Claude Motion Skills public CLIClaude Motion Skills