Opus 5.5 でモーショングラフィックスが作れる時代に。いい作品を引き出すコツ

まずは、実際に何が起きているのか

多くの人が見落としているポイントがあります。Opus 5.5 は MP4 を渡してはくれません。読めるのはテキストと画像で、書けるのはテキストです。つまりあの動画はどれも、実は Opus が書いた小さなプログラムで、そのプログラムを別の何かがフレームに変えているのです。

コツは、たった一つの問いに答える関数です。「時刻 t のとき、画面はどう見える？」。ヘッドレスブラウザーがフレームごとにこの問いを投げ（60 fps で 15 秒なら 900 回）、そのたびにスクリーンショットを撮り、ffmpeg がそれをつなげて動画にします。絵が時刻だけで決まるので、何回実行してもまったく同じ動画ができます。一つのショットだけ変えたい？ 一行直して、もう一度書き出せばいいんです。

何も言わなければ、Opus はいちばんシンプルな道を選びがちです。HTML ファイル一つ、フレームワークなし、スクリーンショットは Playwright、動画は ffmpeg。Remotion（React）や HyperFrames（HTML と GSAP）で作りたいなら、プロンプトでそう伝えるだけで大丈夫です。

道具をそろえる: 準備は 10 分ほど

チャットアプリでもアニメーションは書けます。でも本当に面白くなるのは、Opus が自分で書き出して、結果を見て、直せるようになってからです。そのためにはターミナルが必要です。つまり Claude Code か、コマンドを実行できるほかのエージェントですね。

もう一つのコツ: プロジェクトのフォルダーに、短いハウスルールのファイル（CLAUDE.md）を置いておきましょう。Claude Code は毎回これを読むので、同じことを何度も言わずに済みます。最初のルールとしておすすめなのはこんなところです。絵は時刻だけで決まり、タイマーもシードなしの乱数も使わない。グラデーションの上に中央ぞろえのタイトルを置かない、何もかもフェードインさせない、四隅に小さなラベルを置かない。数秒ごとに何か新しいことが起きる。そして何かを見せる前に、静止画を並べたシートを書き出して自分で見て、ひどい問題を三つ直す。

それから、エフォート（考える深さの設定）を上げてください。みんながシェアした出来のいい一発作品は、xhigh（とても高い）か max（最大）のエフォートで作られていました。medium（中くらい）は、ちょっとした調整や再書き出し用に取っておきましょう。

レベル 1: 一行のショーリール

話題になったクリップの多くは、同じ小さなプロンプトから始まりました。Opus に、自分にできることを見せつける、キレのある 15 秒のモーショングラフィックス動画を頼みます。「履歴書に添えるショーリールのつもりで」（"showreel for a résumé"）と伝え、全力を出すように言うだけです。max エフォートで作られた Stephan Livera の動画は、このブームの火付け役になった投稿の一つです。

こんなに短いのに、なぜこれほどうまくいくのでしょう？ 「ショーリール」は Opus がもともと知っているジャンルです。速いカット、ショットごとに新しい技、いちばんいいものを最初に。しかも主役は Opus 自身なので、間違えようのある商品がありません。15 秒は一回で仕上げられるくらい短く、それでいて 6〜8 ショットが入るくらいの長さです。そして「全力で」のひとことは、エフォートを上げるブースターのように効きます。

ただし落とし穴があります。何百人もが同じプロンプトを実行したので、結果が似たり寄ったりになってきたのです。一行プロンプトはセットアップの動作確認に使って、そのあとは先に進みましょう。これで試せるのはエンジンであって、あなたのアイデアではありません。そもそもアイデアが入っていないのですから。

レベル 2: 自分の商品に向ける

何かを売っている人にとっては、ここからが実用的です。個人開発者の Tony Dinh は、1 年前にこういうローンチ動画に約 1,000 ドル払ったけれど、Opus 5.5 なら似たものを 30 分もかからずに作れた、と投稿しました。リプライではそのプロンプトも公開しています。ショーリールのアイデアに商品のリンクを加え、本物のスクリーンショット、ロゴ、素材を使うよう指示し、動きがついていく音楽を求めたものです。

ほかにも役立つ習慣が二つあります。同じブランドなら同じチャットで続けること。書き出しとサウンドの仕組みがもうあるので、2 本目はもっと早くできます。そして API キーは .env ファイルに入れ、Opus には変数名だけを伝えること。スクリーンショットを撮るかもしれないプロンプトに、本物のキーを貼り付けてはいけません。

その考え方で書いた、アレンジして使えるプロンプトがこちらです。Brewline は架空のカフェアプリなので、あなたの商品に置き換えてください。

Brewline（カフェの注文アプリ、brewline.example）の、キレのある 20 秒の縦型（1080 x 1920）ローンチ動画を作ってください。ショーリールのような勢いで。

1. まずサイトを見てください。本物のスクリーンショット、ロゴ、色、フォントを集めて ./assets に保存し、見つけたものを一覧にしてください。画面を勝手に作らないこと。
2. ストーリーは 2〜4 秒ごとに一つの見せ場: 大きな文字のつかみ、アプリの登場、三つの機能（それぞれカーソルが実際にタップして見せる）、効果を証明する数字を一つ、最後にロゴと "Try it free"（無料で試す）。
3. 120 BPM 前後のオリジナル音楽をコードで作り、ビートに合わせて小さなクリック音やシュッという効果音を入れてください。
4. 本番の書き出しの前に、見せ場ごとに静止画を一枚ずつ見せてください。流れを確認します。

• 彼がリプライで公開したプロンプト

レベル 3: まねしたい見た目を見せる

参考がないと、Opus はいつもの安全地帯に戻ってしまいます。そう、中央ぞろえの文字、グラデーション、フェードです。解決策は、スタイルを言葉で説明するのではなく、見せることです。

フレーム一枚でも効果があります。好きな動画のワンシーンをスクリーンショットして添付し、取り入れるもの（色、文字、質感）と取り入れないもの（被写体）を伝えましょう。動画まるごとでも大丈夫です。コードを書く前に、ffmpeg でフレームを抜き出してショットごとのテンポを説明するよう Opus に頼みます。いちばんいいのは自分のライブラリです。ほかの誰にもまねできませんから。まず Opus に短い style_guide.md と shotlist.md を書いてもらい、アニメーションのコードを書く前に両方を承認しましょう。参考から借りるのは文法だけ。ロゴやキャラクターは借りないでください。

ここは Ciyo を気軽に使える場面です。Ciyo でキーフレームをいくつか、あるいはすっきりしたロゴを生成して、それを参考としてOpus に渡しましょう。そうすれば、動きをつける前から見た目はあなたのものになります。

• Claude Opus 5.5 でロゴを動かす
• Claude Opus 5.5 は画像を生成できる？

レベル 4: 雰囲気ではなく状態を並べる

その週にいちばん保存されたモーションのプロンプトは、一行ではありませんでした。一つの形が一度もカットされない、なめらかな UI アニメーションのための構造化された仕様書だったのです。形はひたすら変形し続けます。ボタンがローダーになり、チェックマークになり、カードになり、グラフになって、最後は最初に戻ってループします。その変化をすべてカーソルが動かしていきます。

うまくいった理由は、魔法の言葉ではありません。わかりやすいリストでした。あなたに何を聞くか（商品、画面、色、音楽トラック）、方向性（落ち着いた背景、アクセントカラーは一色、弾むイージングなし、光るエフェクトなし）、ビートのグリッドに並べた状態（ビートごとに何かが起きるように）、作り方のルール（ファイルは一つ、時刻ベース、最後のフレームは最初のフレームと一致）、そして既知のハマりどころ。状態を並べられれば、Opus はそれを動かせます。

レシピを試してみた: 6 秒のティーザー

ここまでの話が本当に通用するのか確かめるため、2026年9月28日に Claude Code と Opus 5.5 で基本のレシピを組みました。seek(t) 関数を持つ HTML ファイル一つ、時間を一歩ずつ進める Playwright のスクリプト、そしてエンコード用の ffmpeg です。作品は、架空の Brewline アプリのための 6 秒の縦型ティーザー。暗い色の形が一度もカットされずに、点から湯気の立つコーヒーカップへ、チェックのついた注文カードへと変わり、最後は行動を促す文言の入った小さなピル型に戻ります。

180 フレーム（30 fps で 6 秒、1080 x 1920）の書き出しにかかったのは、MacBook で約 9 秒でした。2 回書き出したところ、二つの MP4 ファイルは同じハッシュになりました。時刻だけから絵を描くのは、まさにこのためです。

次に、下のコンタクトシート（1 秒あたり静止画 2 枚）を作り、うるさ型のモーションディレクターのつもりで見てみました。本当の問題が三つありました。湯気が "Order ahead"（事前に注文）という見出しにぶつかっていたこと、最初の 1.5 秒は点が止まっているだけだったこと、そして "Try it"（試してみる）ボタンが小さすぎてスマホでは読めなかったことです。

本当の秘訣: Opus に自分のフレームを見させる

Opus 5.5 は画像を読めます。つまり、自分が作ったばかりのものを見られるということです。私たちの経験では、この習慣一つのほうが、プロンプトのどんな気の利いた言い回しよりも品質を上げてくれます。

三つの修正は、一回の編集と一回の再書き出しで済みました。見出しを上に動かして湯気を短くし、最初のビートの間に点がピル型に伸びるようにし、最後のピルを広げて文字を大きくしました。2 枚目のコンタクトシートを見ると、三つとも直っています。コードは同じ、書き出し時間も同じ約 9 秒です。

繰り返すのはズルではありません。それこそがやり方です。水彩アニメーターの Mable Joseph は、手描きの Opus 5.5 の短編が一発で出たものではないと、気持ちいいほど率直に明かしています。続く投稿で彼女は、よく練ったキャラクターファイル、アニメーションのメモ、キャラクターデザイン、そしてストーリーのプロンプトが必要だったと語りました。

コンタクトシートは ffmpeg の一行で作れます: ffmpeg -i out/final.mp4 -vf "fps=2,scale=270:-1,tile=6x5" -frames:v 1 out/contact.png（6 x 5 のタイルなら、1 秒あたり静止画 2 枚で 15 秒分をカバーできます）。そのあと、下の批評プロンプトをOpus に渡しましょう。

out/contact.png を開いて、じっくり見てください。誇らしげな作者ではなく、厳しいモーションディレクターになってください。
次の項目を 1〜10 で採点してください: 最初の 2 秒のつかみ、スマホでの読みやすさ、動きの質、変化（2〜4 秒ごとに何か新しいことが起きるか）、ブランドらしさ、音との同期。
いちばんひどい問題を 3 つ、タイムスタンプつきで挙げてください。特に、重なっている文字、何も動かないショット、小さすぎて読めない文字を探してください。
それを直し、その秒だけ書き出し直して、新しいコンタクトシートと点数を見せてください。すべての点数が 8 以上になるまで繰り返してください。

• 実際に何が必要だったかを語った、彼女の続く投稿

動きを高級に見せる: スプリングと音

安っぽい動きは、決まったカーブで A から B へ滑るだけです。高級な動きには重さが感じられます。加速して、ほんの少し行き過ぎて、落ち着く。それがスプリング（ばね）です。スプリングは時刻のシンプルな式として書けるので、絵は相変わらず時刻だけで決まり、フレーム 0 から 811 を再生しなくても、いきなりフレーム 812 に飛べます。

カーソルや今回の変形する形のように、何かがいくつもの場所へ続けて動くときは、毎回スプリングをやり直さないでください。移動ごとにスプリングを一つずつ、それぞれの開始時刻から足していけば、動きは最後までなめらかなままです。普通の言葉で頼むこともできます。「すべての動きを時刻ベースのスプリングに切り替えて。ボタンとカードには少しだけ弾みをつけて、見出しには弾みをつけないで」。

そして音。ここから本物の映像らしくなってきます。選択肢は二つです。曲を用意して、短い Python スクリプトで Opus にビートを測らせ、すべてのカットとクリック音を実際のビートに合わせる。あるいは、映像と同じタイムラインの上で、音楽と効果音も Opus にコードで作らせる。私たちのティーザーは無音ですが、本物のローンチ動画ならそうはいきません。

// 時刻 t のとき、スプリングはどこにある？ 0 から始まり、1 で落ち着く。
function spring(t, stiffness = 170, damping = 26) {
  if (t <= 0) return 0;
  const w = Math.sqrt(stiffness);
  const z = damping / (2 * w);
  if (z >= 1) return 1 - Math.exp(-w * t) * (1 + w * t);
  const wd = w * Math.sqrt(1 - z * z);
  return 1 - Math.exp(-z * w * t) * (Math.cos(wd * t) + ((z * w) / wd) * Math.sin(wd * t));
}

// いくつもの目標へ動く値: 移動ごとにスプリングを一つずつ足し合わせる。
function track(t, keys, stiffness, damping) {
  let v = keys[0][1];
  for (let i = 1; i < keys.length; i++)
    v += (keys[i][1] - keys[i - 1][1]) * spring(t - keys[i][0], stiffness, damping);
  return v;
}

大作に挑む: 一晩がかりの映像

その週いちばんの大ヒットは donald（@donaldjewkes）の投稿でした。彼が言うには、コンピューターに 5 分話しかけたらClaude が 12 時間働き、朝起きたらミュージックビデオが完成していたそうです。

こういう長時間の任せきりの実行がうまくいくのは、指示書が動画の説明というより、小さなスタジオに任せる仕事の依頼書のように書かれているからです。私たちなら、四つの問いにまとめます。何のためのものか: 一文で言えるストーリーと、見終わったときに感じてほしいこと。何を使ってよいか: 参考資料、呼び出してよいツールとキー、そして予算。どう進めるか: 本番の書き出しの前に静止画と仮編集をチェックする区切りを設けた段階と、すべての段階での批評ループ。そして何を返してほしいか: 動画、ポスターフレーム、コンタクトシート、整理されたソースコード。

まねする価値のあるひと工夫: こうした映像の中には、難しい動きのあるラフなベースショットを動画モデルで作り、その上からすべてを Opus にコードで描き直させたものもあります。見る人の目に入るのは、コードで描いたきれいなレイヤーだけ。だから映像全体で見た目がそろうのです。

最後の仕上げ: 「ワンプロンプト」を本物にする

セットアップが動くようになったら、それを Claude Code のスキルとしてまとめましょう。スキルとは短い指示ファイルで、何を聞くか（商品、長さ、形式、色、参考、音楽）、制作の流れの各ステップ、そして絶対に守るルール（本物の商品画面だけを使う、書き出しモードではタイマーも乱数も使わない、など）を並べたものです。

そうすれば、次の動画は本当に一行で済みます。たとえば「/motion-reel brewline.example 向け、20 秒、縦型、見た目は ./refs/frame.png に合わせて」のような感じです。これこそ、みんなが話題にしていた「ワンプロンプト」です。ただ、それを手に入れるには、ちょっとした準備が必要だったというわけです。