動画編集ソフト、もう開かなくていいかもしれません。 いきなり何を言い出すんだという感じですが、割と本気で言っています。
0:01 / 0:30
今年の6月、世界中のAIエンジニアが集まるAI Engineer World's Fairという大きなイベントがありました。 そこで流れた公式のオープニング映像、実は編集ソフトを一度も開かずに作られています。 制作したのはAIアバターで有名なHeyGenのチーム。 使われたのがHyperFramesという仕組みです。 スポンサーのロゴが波のように現れて、無数の光の粒が集まってロゴを描く。 どこからどう見てもプロのモーショングラフィックスなんですが、あれ、プロンプトとHTMLでできているんですよね。
で、ここからが本題です。 このHyperFrames、オープンソースで無料公開されています。 しかもClaude CodeでもCodexでも動きます。 普段僕らが記事の下書きやコードを書かせているあのAIエージェントが、そのまま動画クリエイターになるということです。
あなたにも心当たりありませんか。 動画が伸びる時代なのは分かってる。 でもPremiere Proは3日で挫折したし、CapCutのテンプレはどこかで見た仕上がりになるし、外注の見積もりを見てそっ閉じした経験もある。 僕も長いことそこで足踏みしていました。
正直、HyperFramesを最初に見たときは「また海外の派手なデモか」と流しかけたんです。 でも一次情報を追いかけていくうちに、考えが変わりました。 これは大企業のためのものじゃなくて、個人の発信者にこそ効く仕組みだなと。 素材ゼロで動画が作れて、修正は一文で済んで、ブランドの統一感まで保てる。 外注費も、編集ソフトのサブスク代も、編集修行の時間も要りません。
0:01 / 0:30
この記事では、HyperFramesの正体から導入手順、素材ゼロで作る実践レシピ5つ、ターミナルすら不要のブラウザ版、修正指示の出し方、そして発信や仕事にどう繋げるかまでを日本語でまとめました。 英語の一次情報を追いかけるのがしんどい人ほど、読む価値があると思います。 必要なのは、Claude CodeかCodexが動くパソコンと、コピペする指だけ。 プログラミングの知識は前提にしません。 それでは始めていきます。
セットアップの方法など早く知りたい方はこちら
https://x.com/MakeAI_CEO/status/2027682940847898770?s=20
第1章：Claude Codeが動画編集ソフトになった日
0:00 / 0:30
まずは「いま何が起きているのか」を体感してもらうところからです。 理屈より先に事例を見てもらった方が、圧倒的に早いので。
世界最大級のAIイベントの公式映像の裏側
AI Engineer World's Fairは、名だたるAI企業のエンジニアや研究者が一堂に集まる世界最大級のカンファレンスです。 そのオープニング映像の制作を担当したのが、HyperFramesを開発しているHeyGenのチームでした。 彼らが制作の裏側を丸ごと公開しているんですが、これがなかなか衝撃的な内容でして。
目玉のひとつが、登壇者の顔写真が5×5で並んだ壁の演出です。 その壁が波のように左上から順番に開いていって、下から数百のスポンサーロゴが現れる。 さらに大手AIラボのロゴだけが浮き上がって回転するカルーセルになり、最後は「All because of you」という一文に着地します。 もうひとつがエンディングで、暗闇から光の粒がふわっと浮かび上がり、粒たちが自分でロゴの輪郭を見つけて集まっていき、最後に本物のロゴへ変わる。 文字で説明すると地味なんですが、映像で見ると完全にプロの仕事です。
で、この2つのショット、どちらも編集ソフトを開かずに作られています。 イベント側から共有されたデザインシステムを短いルールブックに変換して、公式サイトからロゴや登壇者の写真をエージェントに取得させて、あとはプロンプトで組み立てていく流れです。 芸が細かいのは、顔カードが消える直前に次のロゴが出始めるよう設計されていて、画面が一瞬も空白にならないところ。 こういう職人的な気配りまで、指示とルールで再現されているわけです。
しかも驚くのはここからで、エンディングの光の粒の演出は、彼らが無料公開しているスキル集にそのまま入っています。 任意のロゴを指定すれば、誰でも同じ演出を自分のブランドで再現できる。 世界最大級のイベントで流れた演出が、コマンド一発で自分のものになるんです。 この時点で、ちょっと話がおかしいんですよね。 念のため補足すると、これは密室のデモではなく、実際にイベントで上映された本番の映像です。 プロの現場の納品物が、この作り方で成立してしまった。 その事実だけでも、流れが変わったことが伝わると思います。
素材ゼロ、編集ソフト不要、修正は一文
HyperFramesの衝撃を僕なりに整理すると、ポイントは3つに絞られます。 素材がゼロで済むこと、編集ソフトが要らないこと、そして修正が一文で終わることです。
まず素材ゼロの話から。 HeyGenが公開している事例に、45秒の解説動画をプロンプト1回で作ったものがあります。 人間が渡したのはテーマとブランド設定のファイル、あとBGM用の曲だけ。 エージェントは指示を受けると自分でGitHubのAPIを叩いてリサーチを始めて、25万スターを超える実在の人気プロジェクトを題材に選び、その仕組みを調べた上で台本を書きました。 そこからナレーションを音声合成して、動くタイポグラフィと図解を設計して、字幕とBGMと効果音まで入れて、MP4を書き出すところまで一気通貫です。 画面に出てくる数字はすべてその場で取得した実データで、撮影も素材集めも一切発生していません。
次に編集ソフト不要の話。 いま説明した工程のどこにも、タイムラインをちまちま触る作業が存在しないことに気づいたでしょうか。 台本も、構成も、デザインも、アニメーションも、音も、全部エージェントの仕事です。 人間がやったのは、最初の依頼だけ。
そして僕が一番痺れたのが修正の話です。 この45秒動画、初稿では字幕のデザインがいまいちでした。 発話中の単語がアニメーション付きの枠に入っていて、背景の映像とケンカしていたんです。 そこで出された修正指示は、「枠を外して、これから話す単語はグレー、いま話している単語は青にして」という趣旨のたった一文。 エージェントは字幕のスタイルを作り直し、動画全体の検証をかけ直して、再レンダリングまで自分で済ませました。 従来の外注なら往復で数日かかっていたやり取りが、一文で終わる。 ここが個人的には一番の革命ポイントだと思っています。
Premiere ProともCapCutとも土俵が違う
ここで、比較対象をはっきりさせておきます。 HyperFramesと並べて考える相手は、Premiere Pro、Filmora、CapCutといった動画編集ソフトです。
この3つ、性格はけっこうバラバラですよね。 Premiere Proはプロ標準の高機能ソフトで、その分だけ学習コストが重く、サブスクの支払いも続きます。 Filmoraは初心者向けの定番で、年間プランと買い切りが選べて、操作も分かりやすい部類です。 CapCutは無料で始められてテンプレートが豊富、ただテンプレに乗るほど既視感のある仕上がりへ寄っていきますし、凝った機能は課金圏です。 それでも、この3つには決定的な共通点があります。 タイムラインを自分の手で触る道具だ、ということです。 カットを切るのも、テロップを置くのも、書き出し設定に悩むのも自分。 ソフトにいくら払っても、上達していくのは自分の手なんです。 導入で触れた挫折の正体も、結局ここにあります。
HyperFramesは、この前提ごとひっくり返します。 そもそも、触るためのタイムラインが存在しません。 僕らが言葉で指示を出すと、エージェントが動画の設計図をHTMLとCSSで書き、それをヘッドレスのChromeが1フレームずつ正確に撮影して、FFmpegという定番ツールがMP4に固めます。 Webページを表示する仕組みを、そのまま撮影スタジオにしているイメージです。 だから日本語のテロップは絶対に崩れないし、指定したカラーコードは1ピクセルもズレないし、同じ指示からは必ず同じ映像が返ってきます。 公式はこの性質を、決定論的レンダリングと呼んでいます。 AIだから毎回違うものが出るのでは、という心配が要らない設計です。 修正もタイムラインではなく、言葉で出します。 レンダリングは手元のパソコンで完結するので、何回やり直しても追加費用はゼロです。
ただし、正直に線引きもしておきます。 撮影した実写素材を細かく切り貼りするVlogのような編集は、まだ従来の編集ソフトの土俵です。 HyperFramesが強いのは、解説、告知、実績報告、モーショングラフィックスといった、情報を伝える動画。 そして僕ら発信者が日常的に必要とする動画は、圧倒的に後者なんですよね。 編集ソフトの練習に費やすはずだった時間を、そのまま発信に回せるようになります。
第2章：HyperFramesの正体と「スキル」という仕掛け
0:00 / 0:30
事例で温度感が伝わったところで、仕組みの話をします。 ここを押さえておくと、後半の応用が全部スムーズになるので、少しだけお付き合いください。
HTMLがそのままMP4になる仕組み
HyperFramesは、HeyGenが公開しているオープンソースの動画レンダリングフレームワークです。 一言でいうと、HTMLで書いた画面をそのまま動画ファイルに変換してくれる仕組みです。
動画は1本のHTMLファイルとして定義されます。 どの要素を何秒目から何秒目まで表示するか、といったタイムラインの情報は、HTMLの属性として直接書き込まれます。 アニメーションにはGSAPやCSSアニメーション、Lottie、Three.jsといった、Web業界で長年使われてきた枯れた技術がそのまま使えます。 プレビューはコマンド一発でブラウザが立ち上がり、コードを保存した瞬間に映像へ反映されます。 仕上げのレンダリングもコマンド一発で、裏でヘッドレスChromeとFFmpegが働いてMP4を書き出してくれる。 ビルドのような面倒な工程はなくて、書いたHTMLがそのままブラウザで再生できる手軽さです。
似た発想の先行ツールにRemotionというものがあって、開発元も影響を受けたと公言しています。 ただしRemotionはReactでコンポーネントを書くスタイルで、HyperFramesはプレーンなHTMLに賭けました。 そしてこの選択が、AIエージェント時代にモロに効いてくるんです。 というのも、LLMが世界で一番大量に学習してきたマークアップ言語はHTMLだからです。 人間にとって動画をHTMLで書くのは正直しんどい作業ですが、エージェントにとっては母国語で作文するようなもの。 自分で書いて、自分でプレビューして、自分で直す、というループが高速で回ります。 動画編集という仕事を、エージェントの得意分野に丸ごと翻訳した発明、と言った方が実態に近いかもしれません。 ついでに言うと、動画がテキストファイルになるということは、管理も差し替えもテキスト感覚でできるということです。 先週の動画の色だけ変えて再書き出し、みたいな芸当が一瞬で終わります。
エージェントを職人に変える「スキル」の正体
HyperFramesのもうひとつの発明が、スキルとの組み合わせです。 スキルというのは、エージェントに読ませる手順書のことです。 SKILL.mdというマークダウンファイルに、作業のルール、使うコマンド、品質チェックの手順などを書いておくと、エージェントは必要なタイミングでそれを読み込んで、その道の職人として振る舞うようになります。 Claudeのスキル機能で遊んだことがある人なら、あの仕組みの動画版だと思ってもらえれば早いです。
HyperFramesには、このスキルが20個同梱されています。 入り口になるのが/hyperframesというルーター役のスキルで、「こういう動画を作って」という依頼を受けると、内容に応じて適切な専門スキルへ振り分けてくれます。 解説動画なら解説動画の職人に、音ハメ動画なら音ハメの職人に、という具合です。 利用者側がスキルの一覧を暗記する必要はありません。 しかもスキルの中身はただのマークダウン文書なので、気になったら自分で開いて読めます。 ブラックボックスではなく、手順書がまるごと公開されている安心感があります。
そしてここが重要なんですが、スキルは特定のAI専用の機能ではありません。 公式の説明にも、Claude Code、Cursor、Gemini CLI、Codexといったスキル対応のコーディングエージェントで動作すると明記されています。 Claude Codeで覚えさせた動画制作の型が、Codexに乗り換えてもそのまま使える。 特定ツールへの依存ではなく、持ち運べる資産になるわけです。 僕がタイトルにClaude Codeを入れたのは単に僕のメイン環境だからで、Codex派の人もこの後の手順はほぼそのまま再現できます。 エージェント間の競争がこの先どう転んでも腐らない投資、という言い方もできますね。
無料で商用利用OK、そのカラクリ
ここまで聞くと、「で、結局いくらかかるの」と身構えますよね。 結論から言うと、HyperFrames自体は無料です。 Apache 2.0というかなり緩いオープンソースライセンスで公開されていて、レンダリング回数による課金も、商用利用の制限もありません。 レンダリングは自分のパソコンの中で完結するので、動画を何百本書き出そうがお金は発生しない構造です。 外部にデータを送らずローカルで完結する点は、仕事で使う際の安心材料にもなります。
信頼性の面でも、GitHubのスター数はすでに3万を超えていて、公式リポジトリには採用しているチームのリストまで公開されています。 海外の著名な開発チームが実務投入している、いわば主流になりつつあるツールです。 一発ネタの実験プロジェクトとは毛色が違います。 更新も活発で、僕が確認した時点でもスキルの追加や改善が続いていました。 この手のOSSは開発が止まった瞬間に価値が落ちるので、企業が本気で開発資源を注ぎ続けている点は素直に安心材料です。
じゃあなぜHeyGenはこれを無料で配るのか。 彼らの本業はAIアバター事業です。 エージェント時代の動画制作という新しい市場で標準規格を先に押さえてしまえば、その先でアバターや音声が必要になったユーザーが自然と本体サービスへ流れてくる。 実際、後の章で紹介するアバター動画のワークフローだけは、HeyGenのアカウントと連携する作りになっています。 つまり無料の罠ではなく、入り口を開放して出口で回収するという、分かりやすくて健全な戦略です。 僕らユーザー側から見れば、モーショングラフィックスや解説動画の範囲なら完全無料で使い倒せる、という理解で大丈夫です。
第3章：10分で終わる導入手順
ここから手を動かすパートです。 ターミナルという黒い画面に苦手意識がある人でも完走できるように書いていきます。 実際、僕の体感でも詰まりどころは最初の環境準備くらいで、そこさえ越えれば後は拍子抜けするほど簡単です。
準備するのはNode.jsとFFmpegだけ
必要なものは2つだけです。 Node.jsのバージョン22以上と、FFmpegという動画処理の定番ツール。 どちらも無料です。 Node.jsはエージェント系のツールを触っている人ならすでに入っている可能性が高いので、まずは確認からいきましょう。
Node.jsが入っているかどうかは、ターミナルで次のコマンドを打てば確認できます。
node -v
v22以上の数字が返ってくれば、そのまま次へ進んでください。 入っていない場合や古い場合は、Node.jsの公式サイトからインストーラーを落とすのが一番簡単です。 FFmpegは、Macなら Homebrew で一発です。
brew install ffmpeg
Windowsの人は、wingetか公式の配布版からインストールできます。
で、ここで手が止まりかけた人に裏技をひとつ。 環境構築そのものを、エージェントに任せてしまう手があります。 Claude Codeを開いて、「この環境にNode.jsの22以上とFFmpegをセットアップして。終わったら動作確認までやって」と頼んでみてください。 あなたのOSに合わせたコマンドを提案して、実行し、確認まで面倒を見てくれます。 途中でエラーが出たら、エラー文を丸ごと貼り返せばいい。 環境構築で心が折れるのは旧時代の話で、いまは「分からないことごと任せる」が正解です。 そしてこの感覚を掴むこと自体が、HyperFrames以降のすべての学習をラクにしてくれます。 道具の使い方を覚えるんじゃなくて、道具に詳しい相棒への頼み方を覚える。 発想をここで切り替えておきましょう。 ちなみにこの記事のコマンド例はMacを基準にしていますが、WindowsでもLinuxでも流れ自体は同じです。
スキルのインストールはコマンド一発
環境が整ったら、HyperFramesのスキルを入れます。 動画用のフォルダをひとつ作って、その中で次のコマンドを実行してください。
npx skills add heygen-com/hyperframes --full-depth
実行すると、どのスキルを入れるか選ぶ画面が出てきます。 初見だとどれが必要か判断できないと思うので、迷ったら全部入りで大丈夫です。 その場合は次のコマンドを使ってください。
npx skills add heygen-com/hyperframes --all --full-depth
ちなみに--full-depthというオプションは、リポジトリの最新版からスキルを取ってくるための指定です。 これを付けないと数時間古いコピーが入ることがあると公式が案内しているので、素直に付けておきましょう。
インストールが終わってClaude Codeを開き直すと、スラッシュコマンドが登録されています。 司令塔の/hyperframesを筆頭に、解説動画用の/faceless-explainer、音ハメ動画用の/music-to-video、短尺グラフィック用の/motion-graphics、アバター動画用の/talking-head-recut、Webサイトから動画を作る/website-to-videoなど、用途別の職人が控えている状態です。 Codexなど他のエージェントを使う場合も、同じスキル群を読み込ませれば同様に動きます。
使うときのコツはひとつだけ。 最初は必ず/hyperframesから話しかけることです。 これがルーター役なので、あなたの依頼内容を聞いて、適切なワークフローへ案内してくれます。 どのスキルをいつ使うか、自分で覚える必要はありません。 詰まったときは公式ドキュメントのhyperframes.heygen.comを見れば、最新の手順が載っています。
最初の1本を出してみる
それでは記念すべき1本目を作ります。 Claude Codeに、次のプロンプトを投げてください。
/hyperframes を使って、10秒のプロダクト紹介動画を作ってください。
黒背景にタイトルがフェードインして、控えめなBGMが流れる構成で。
サイズは1920x1080でお願いします。
ここから先はエージェントの独壇場です。 プロジェクトの雛形を作り、動画の設計図となるHTMLを書き、アニメーションを付けて、自分で品質チェックまで回します。 途中経過を目で確認したくなったら、次のコマンドでプレビューが立ち上がります。
npx hyperframes preview
ブラウザ上で動画が再生されて、コードを直せば即座に反映されます。 納得したら仕上げのレンダリングです。
npx hyperframes render
これでMP4ファイルが書き出されます。 初回はレンダリング用のブラウザ部品をダウンロードするため、少し時間がかかることがあります。 2回目以降はサクサク動くので安心してください。
もし途中でエラーが出て止まっても、慌てなくて大丈夫です。 赤い文字のエラーメッセージを丸ごとコピーして、そのままエージェントに貼り付けてください。 原因を特定して、修正して、もう一度レンダリングまで回してくれます。 僕らの仕事はエラーを解読することではなく、出てきた動画に感想を言うことです。 たった10秒の動画でも、自分の指示だけで1本完成した瞬間はけっこう感動しますよ。 この小さな成功体験が、この後の全部の土台になります。 ちなみに書き出したMP4は、そのままXにもnoteにも貼れる普通の動画ファイルです。 特別な変換ソフトは要りません。
第4章：ブランドに「動き」を与えるFRAME.md
1本出せるようになったら、次は「自分の動画」に見せる工程です。 実はここが、テンプレツールとの決定的な分かれ道になります。 所要時間は10分ほどなので、今日中にやってしまいましょう。
テンプレ臭の正体は「ブランド不在」
AIで作った動画がどこか安っぽく見える理由、考えたことありますか。 クオリティが低いからではありません。 エージェントがあなたのブランドを知らないから、毎回「それっぽい何か」を世界の平均値で出してくるからです。 色も、フォントも、動き方も、ぜんぶ平均。 だから既視感が出る。 これはCanvaのテンプレートが没個性になるのと、構造的にはまったく同じ現象です。 逆に言えば、ブランドの情報を先に渡してしまえば、AIは驚くほど従順にそれを守ってくれます。 問題はセンスの有無ではなく、伝えるための書式が無かっただけなんです。
HyperFramesの世界では、この問題を2つのファイルで解決します。 1つ目がDESIGN.mdで、あなたのブランドの色、フォント、言葉のトーンを記述したファイル。 2つ目がFRAME.mdで、それに動き方の定義まで加えたファイルです。 要素がどう登場して、どう消えて、場面はカットで繋ぐのかフェードで繋ぐのか。 シャープな技術系ブランドと、温かみのあるライフスタイル系ブランドでは、映像の動き方そのものが違うはずで、その違いを言語化しておくわけです。
ちなみにDESIGN.mdという書式はHeyGenの独自規格ではありません。 AIデザインツールの界隈で共通の慣習になりつつある形式で、公開ギャラリーまで存在します。 つまりここで作るファイルは、動画以外のAI制作物にもそのまま流用が効く汎用資産です。 一度作れば、以降のすべての動画がブランドの制服を着て出てくる。 この10分をやった人とやらなかった人で、3本目あたりから見た目が別物になっていきます。
自分のサイトからDESIGN.mdを抽出する
DESIGN.mdは手書きしなくていいです。 自分のサイトやブログを持っているなら、エージェントに抽出させるのが早くて正確です。 HeyGenが公開している抽出プロンプトを日本語に直したものを置いておくので、URLだけ差し替えて使ってください。
https://あなたのサイト.com から僕のブランドのDESIGN.mdを作ってください。
ライブのHTMLと、実際に読み込まれているCSSファイルを取得して、色のhexコードとフォント名はCSSから一字一句そのまま抜き出すこと。
スクリーンショットから色を推測するのは禁止です。
フォントは代替候補ではなく、実際に読み込まれているものを報告してください。
サイトの実際の見出しを3〜5本読んで、そこから声とトーンのルールを導いてください。
中身は絞ってください。
役割と組み合わせ付きの色を4〜6個、文字の役割を2〜3個、余白と角丸と影の値、そして「常に〜する」「絶対に〜しない」という形のルール。
トークンの羅列にはしないでください。
最後に、それぞれの色とフォントをCSSのどこで見つけたか出典を列挙して、出典を示せない項目は削除してください。
このプロンプト、地味によくできてるんですよ。 推測を禁止して、実データから取らせて、最後に出典まで言わせる。 AIの適当な思い込み、いわゆるハルシネーションを構造的に潰す設計になっています。 このお作法は動画以外の場面でも使い回せるので、覚えておいて損はないです。 DESIGN.mdが出てきたら、主要な色を2〜3個スポイトツールで検証して完了です。
サイトを持っていない人も、諦めなくて大丈夫です。 普段の発信で使っている色コード、フォント名、口調のルールを文章でエージェントに伝えて、同じ形式でまとめてもらえばDESIGN.mdは作れます。 noteとXが主戦場の人なら、ヘッダー画像やサムネで使っている色をベースにすれば十分です。
FRAME.mdで「動き方」まで定義する
DESIGN.mdができたら、それを動画用に拡張します。 公式が用意しているhyperframes.dev/designというページにDESIGN.mdをアップロードすると、モーションの言語を追加したFRAME.mdへ変換してくれます。 あなたのブランドの性格を読み取って、それに合った緩急の付け方、画面転換のスタイル、テンポを提案してくれるイメージです。 落ち着いた教育系ブランドなのに動きだけギラギラ、みたいな事故をここで防ぎます。
ダウンロードしたFRAME.mdは、動画プロジェクトのフォルダに置いておくだけで機能します。 以降、そのフォルダで作る動画すべてにブランドのルールが自動で適用される。 一度仕込めばずっと効く、完全に資産型の仕込みです。
ちゃんと機能しているか確かめたいときは、ブランドリールを1本作らせてみるのがおすすめの確認方法です。
/hyperframes
僕のFRAME.mdを渡します。
これを体現する20秒のブランドリールを1920x1080で作ってください。
ロゴとカラーパレットで始まり、タイポグラフィの見本を見せて、このデザインシステムでUIカードを1枚組み立てて、最後はロゴで締める構成で。
すべての登場、退場、転換はFRAME.mdのモーション言語に従ってください。
この動画はFRAME.mdの映像化そのものです。
出てきた20秒を見れば、自分のブランドが動くとどうなるのかが一発で分かります。 違和感があれば、FRAME.mdの該当箇所を直して作り直せばいいだけ。 ここまでで、あなた専用の動画制作環境が完成したことになります。 この後のレシピは全部、この土台の上で走ります。 なお、ブランドを複数持っている人はフォルダを分けて、それぞれにFRAME.mdを置けば混ざりません。
第5章：素材ゼロで作る実践レシピ5選
0:01 / 0:30
ここからが本番です。 HeyGenが実際に公開している事例をベースに、僕ら発信者向けに翻訳した使い方とプロンプトを5つ紹介します。 どれもFRAME.mdを置いたフォルダで実行する前提で読んでください。
レシピ1：テーマを渡すだけで解説動画が完成する
一番出番が多くなるのが/faceless-explainerです。 顔出しなし、撮影なし、素材なしで解説動画を作るワークフローで、こちらが渡すのはテーマだけ。 リサーチ、台本、ナレーション音声、動くタイポグラフィ、図解、字幕、BGM、効果音、そして最後のレンダリングまで、全部まとめて面倒を見てくれます。
HeyGenの公開事例では、45秒の技術解説動画をプロンプト1回で完成させています。 第1章でも触れたやつですね。 エージェントは指示を受けてからGitHubのAPIを自分で叩き、25万スター超の実在プロジェクトを題材に選び、その中身を読み込んで理解した上で台本を書きました。 画面に出る数字がすべて実データという点が、発信者的には信頼性の面で本当にありがたいポイントです。 適当な数字で動画を作って後から燃える、という事故を構造的に避けられます。
僕らの使い方としては、自分のnoteやXの内容を動画化するのが鉄板です。
/faceless-explainer を使って45秒の解説動画を作ってください。
テーマは「ここに記事の主張や手順を貼る」です。
内容に関わる数字や固有名詞は、Web検索で事実確認をしてから使ってください。
ナレーションは日本語で、デザインはFRAME.mdに従ってください。
これで過去記事が動画コンテンツに化けるので、ネタ切れとは無縁になります。 1つのテーマから記事、ポスト、動画の3展開ができる体制、控えめに言って強いです。 新しく何かを生み出さなくても、既にあなたの中にある知見が動画になる。 ストック型の発信をしてきた人ほど、恩恵が大きいレシピです。 尺は45秒に限らず、60秒でも90秒でも指定できます。 ただ最初のうちは短めの方が、修正の練習がしやすくておすすめです。
レシピ2：曲を渡すと音ハメ動画になる
/music-to-videoは、音楽ファイルを渡すと、ビートに同期した動画を作ってくれるワークフローです。 エージェントはまず曲を解析して、BPM、拍の位置、盛り上がりの構造、ドラムのフィルの場所まで読み取った設計図を作ります。 そして、すべてのカットをその設計図に従わせる。 画面の切り替わりが拍の頭にピタッと吸い付く、あの気持ちいい音ハメ動画が自動で出てくるわけです。 音楽的なセンスに自信がない人ほど、機械に任せる価値があります。
HeyGenの事例では、曲を1本渡して、30秒のテックニュースまとめ動画を作らせています。 今週のニュースをWeb検索でリサーチさせて、1小節ごとに1トピックのカードを切り替えていく構成です。 面白いのが修正のくだりで、初稿にはテロップ同士が重なっている箇所と、締めのカードが2枚続いてくどい箇所がありました。 そこで出た指示は、「この文字が被らないように下の行へ逃して」「最初の締めカードは削って、最後はバナーで止めて」という趣旨の2文だけ。 それでも音との同期は一切崩れず、カットは近くのドラムの音へ吸着し直し、全体の尺まで綺麗に整えられて返ってきました。 音楽を触る編集ソフトの知識、ゼロで済んでいます。
/music-to-video で、この曲から30秒の告知動画を作ってください。
内容は「告知したい商品やイベントの情報」です。
すべてのカットはビートに同期させて、一番の見せ場は曲の盛り上がりに合わせてください。
デザインはFRAME.mdに従ってください。
商品ローンチの予告、イベント告知、月次の振り返り動画あたりと相性抜群です。 BGM選びのセンスがそのまま動画の質になるので、音源だけはこだわって選びましょう。
レシピ3：数字1個がモーショングラフィックスになる
/motion-graphicsは、10秒以下の短尺に特化したワークフローです。 ナレーションなし、動きそのものがメッセージ。 数字のカウントアップ、グラフのアニメーション、ロゴの登場演出、テキストカードなどを作ります。
これの何が便利かというと、入力のハードルが底抜けに低いんですよ。 HeyGenの事例では、GitHubのスター数がカウントアップする5秒のカードを、一文の依頼だけで完成させています。 エージェントはその場でGitHubのAPIから当日の実数を取ってきて、いつ時点の数字かが分かるように日付まで画面に刻みました。 別の事例では、インストール数の推移グラフを頼まれたエージェントが、自分でデータを取得した上で「右肩上がりの見出しはデータと合わないので、合計数を主役にします」と誠実な軌道修正までしています。 数字を盛らないAI、信頼できますよね。
発信者的には、実績報告カードが鉄板の使い道です。
/motion-graphics で5秒の実績カードを作ってください。
「フォロワー10,000人達成」の数字が0からカウントアップして、達成日をカードの下に小さく入れてください。
デザインはFRAME.mdに従ってください。
コツはひとつで、エフェクト名を指定しないことです。 ズームでとか、バウンドさせてとか、言わなくていい。 伝えたい内容と見せたい順番だけ言えば、動きのデザインはエージェントが決めてくれます。 背景が透明な形式でも書き出せるので、手持ちの動画の上に重ねる素材としても使えます。 週に1枚この手のカードを出すだけでも、タイムラインでのあなたの見え方は確実に変わりますよ。 地味に効くのが、日付や出典を画面の隅に入れる使い方です。 数字の透明性が上がるので、実績報告の信頼感がワンランク変わります。
レシピ4：撮影ゼロでアバターに解説させる
/talking-head-recutは、人が喋っている動画の上に、発言内容へ同期した図解やテロップを自動で重ねるワークフローです。 喋りに合わせて数字がカウントアップしたり、固有名詞が出た瞬間に説明カードが差し込まれたり。 いわゆるビジネス系YouTubeの手の込んだ編集が、そのまま自動化されるイメージです。
面白いのは、HeyGenの事例では撮影すらしていない点です。 HeyGen CLIというコマンドラインツールで自社のアバターライブラリから人物を選び、エージェントが最新ニュースをリサーチして台本を書き、リップシンク付きの喋り動画をターミナルから生成しました。 さらに、その自分で作った動画を自分で文字起こしして、単語単位のタイミングに合わせて図解を重ねていきます。 話者が数字を口にした瞬間、画面のその数字がカウントアップを始める。 この芸の細かさが、指示だけで出てくる時代になりました。
ひとつ正直に言っておくと、アバター生成の部分だけはHeyGenのアカウントが必要です。 第2章で話した、彼らのビジネス上の回収ポイントがここですね。 ただ、すでに撮影してある自分の解説動画に図解を重ねる使い方なら、アバターなしでも成立します。
/talking-head-recut を使ってください。
この動画に、話している内容へ同期した図解カードとテロップを重ねてください。
重要な数字はカウントアップで見せて、字幕は画面下部に配置。
デザインはFRAME.mdに従ってください。
顔出しせずに発信している人にとっては、事実上の分身システムになり得ます。 講座コンテンツの解説パートや、法人向けのサービス紹介動画とも相性がいいです。 撮影と編集という2大コストが同時に消えるインパクトは、使ってみると想像以上ですよ。
レシピ5：GitHubのPRが60秒のレビュー動画になる
最後はエンジニア寄りのレシピですが、仕事の武器になるので紹介させてください。 /pr-to-videoは、GitHubのプルリクエストのURLを渡すと、そのコード変更を解説するレビュー用の動画を作ってくれるワークフローです。
エージェントはPRのタイトル、説明文、コードの差分、コミット履歴、レビュアーの状況まで読み込んで、変更の規模に見合った尺の動画に仕立てます。 すごいのは、画面に出てくるコードがスクリーンショットではなく、本物の差分だという点です。 消える行が赤く畳まれて、追加された行が緑で着地する。 ナレーションは同僚が隣で説明してくれるようなトーンで、レビューを頼まれた人が差分を開く前に全体像を掴める構成になっています。
/pr-to-video
ここにPRのURLを貼る
このPRはレビュー待ちです。
60秒前後のレビュアー向けブリーフィング動画を、日本語ナレーションで作ってください。
開発の現場では、これは純粋にレビュー待ち時間を削るツールです。 でも僕らの視点だと、もうひとつ別の価値があります。 法人向けの提案ネタになるんですよ。 開発チームを抱える会社に対して、「御社のコードレビュー、動画で回せます」と具体物で見せられる。 口頭やスライドで説明するより、相手のリポジトリで実際に1本作ってデモした方が100倍伝わります。 AI研修や導入支援の案件につなげる入り口として、かなり筋のいい素材です。 エンジニアでない人も、こういうカードが自分の手札にあると知っておくだけで、提案の幅が変わってきます。 動画で提案してくる人がまだほぼいない領域なので、見せた瞬間の相手の反応が違います。
5つのレシピ、どれから試すか迷ったら、レシピ3の実績カードが最短です。 入力が一文で済むので、今日の成功体験に一番近い位置にあります。
第6章：ターミナルすら不要の「Video Agent」という裏口
ここまで読んで、正直こう思った人もいるはずです。 すごいのは分かった、でもやっぱり黒い画面は無理かもしれない、と。 安心してください、そういう人のための裏口が公式に用意されています。 HeyGen本体に組み込まれた、Video Agentです。
ブラウザの中にエージェントが住んでいる
Video Agentは、この記事でずっと話してきた考え方をそのままブラウザに移植した機能です。 CLIなし、リポジトリなし、スキルのインストールなし。 app.heygen.comを開くと、ホーム画面にそのまま置いてあります。
やることは、作りたい動画を言葉で説明するだけ。 するとエージェントが台本を書き、カメラの前に立つアバターを配役し、声を当て、シーン構成を組み、グラフィックの合間に流すストック映像を選び、テンポと字幕まで決めて、完成した1本を返してきます。 タイムラインや素材集といった部品を渡される従来のツールと違って、制作チームを丸ごと雇う感覚です
そして地味に感動するのが、いきなり作り始めない点です。 プロンプトを送ると、エージェントはまずシーンごとの制作プランを提示してきます。 それを読んで、チャットで注文を付けて、こちらが進めてと言って初めてレンダリングが走る。 部下が先に企画書を持ってくる流れと同じなので、完成後にひっくり返す事故がほぼ起きません。
事前の設定は3つだけです。 アバターを選ぶ、これは自分のデジタルツインでもライブラリの人物でも構いません。 声を選ぶ、アバターの標準ボイスが自動で付くので、好みに応じて差し替えるだけ。 そしてブランドシステムをオンにするかどうか。 オンにしておくと、自分の色、フォント、ロゴがエージェントの作るすべてに自動で適用されます。 第4章でやったFRAME.mdのブラウザ版だと思ってもらえれば、大体合っています。
スタイル段落ひとつで世界観が決まる
Video Agentのプロンプトには、公式が推している型があります。 作りたい動画の説明に、スタイル段落と呼ばれる短い一節を添えるやり方です。 グラフィックの見た目、色、勢い、動き方をまとめた5〜6文で、エージェントはすべての視覚的な判断をこの段落に通して下します。 逆に言うと、書かなかったことは全部エージェントが勝手に決めます。
段落の中身は、順番まで含めて型になっています。 スタイルの名前、hexコード込みの正確なパレット、アートの方向性、ものの動き方、場面転換のスタイル、最後に雰囲気をひと言。 日本語に直したテンプレートを置いておくので、色と言葉を差し替えて使ってください。
45秒の縦型動画を作ってください。
テーマは「ここに告知したい商品や企画の説明」です。
スタイル：ミニマル・ナイトモード。
背景は#0F1115、メインテキストは#F5F7FA、アクセントは#4C8DFF、サブは#9AE6B4。
余白を広く取ったモダンなサンセリフ、細い罫線、ガラス風の半透明カード。
数字はゆっくりカウントアップ、カードは下からふわっと浮かび、グラフの線は自分で伸びていく。
場面転換はソフトなクロスフェードと横方向のワイプ。
落ち着いていて、知的で、信頼感のあるトーン。
公式の実例も紹介しておくと、テキサス州オースティンの不動産マーケット更新という30秒の縦型動画があります。 Avaというアバターが冒頭と締めでカメラに向かって話し、中盤では住宅価格の中央値がカウントアップし、在庫の棒グラフが段々と下がり、玄関先のストック映像に販売日数のカードが重なる構成です。 この動画、シーン1からシーン5まで秒数付きの台本をプロンプトに貼り付けて、その通りに作らせています。 台本がある人はまるごと貼ればいいし、スライドや画像やロゴを添付すれば織り込んでくれます。 尺は必ずプロンプトに明記してください。 30秒と書けば、30秒に収まるように全体のテンポを調整してくれます。 進め方も選べて、プランを確認しながら対話で詰める方式と、最後まで一気に走らせる方式があります。 最初のうちは、プラン確認ありで回すのが安全です。
9割を任せて、最後の1割だけ手を入れる
初稿は、あくまでたたき台です。 そこから投稿できる品質へ持っていく道が2本あります。
1本目は、そのまま会話を続ける道。 レンダリングが終わってもチャットは生きています。 公式の実例では、シーン2の背景だけが気に入らなかったので、同じチャットで背景を変えてと伝えました。 するとエージェントはシーン2だけを作り直して、承認済みの他のシーンには指一本触れずに返してきます。 次の章で深掘りする、一文リテイクの感覚そのままです。
2本目は、AI Studioで自分の手を入れる道。 コピーをエディタに送ると、完全な手動モードに切り替わります。 台本とテキスト、アバターのシーン、声、タイミング、場面転換、レイアウト、素材の差し替え、音楽、字幕の微調整まで全部触れます。 画面は台本が左、映像が中央、右側に素材や音楽のパネルという分かりやすい配置です。 チャットで9割まで詰めて、字幕が顔に被るとか、カットが半拍遅いとか、人間の目でしか気づけない最後の1割だけ自分で直す。 公式はこの働き方を、9割をプロンプトで、1割を編集で、と表現しています。
で、ターミナル版とVideo Agentをどう使い分けるか。 僕の整理はこうです。 無料で量産したい、自動化に組み込みたい、ブランドをファイルで厳密に管理したいならターミナル版。 アバターに喋らせたい、今日この瞬間に1本欲しい、黒い画面は見たくないならVideo Agent。 なおVideo AgentはHeyGen本体の機能なので、アカウント登録が必要です。 第2章で話した、入り口を開放して出口で回収するモデルの、まさに出口側ですね。 どこまで無料枠で試せるかはプランで変わるので、料金は公式サイトで確認してください。 もっと深く学びたい人向けに、公式のプロンプト解説ページ（heygen.com/blog/video-agent-prompt-guide）も公開されています。
第7章：修正一文の運用術と、これで稼ぐ設計図
最後の章では、日々の運用とお金の話をします。 道具は、使い方と活かし方が揃って初めて武器になるので。
リテイクは「一文」で通す
HyperFramesの真価は、1本目よりも2本目以降に出ます。 つまり、修正の場面です。 HeyGenの事例で実際に飛んだ修正指示を並べてみると、感覚が掴めると思います。
字幕の枠を外して、色の変化だけにして。 この文字が上の行と被ってるから、下に逃して。 締めのカードは1枚にまとめて、最後は緑のバナーで止めて。 図解は画面の左3分の1に寄せて。
気づいたでしょうか。 全部、映像の専門用語をひとつも使っていないんです。 イージングがどうとか、キーフレームがどうとか、一切言っていない。 見たままの不満と、欲しい状態を、そのまま言葉にしているだけです。 それでもエージェントは意図を汲んで、該当シーンを直し、レイアウトの検証をやり直し、音との同期を保ったまま再レンダリングして返してきます。
従来の動画外注だと、この一往復に数日の待ちと追加費用がかかるのが普通でした。 だから僕らは修正を我慢して、微妙な違和感の残った動画をそのまま世に出してきたわけです。 その我慢が、まるごと消えます。 納得いくまでノーコストで直せる環境は、アウトプットの天井を確実に引き上げてくれます。
ディレクションのコツをひとつだけ挙げるなら、1回の指示に修正を詰め込みすぎないことです。 一文か二文で1テーマ、返ってきたら次、のリズムで回すのが結局一番速い。 そしてこの「言葉で映像を直す力」は、そのままディレクション能力として蓄積されます。 編集ソフトの操作スキルと違って、ツールが変わっても腐らない能力です。 言い換えると、これからの動画制作で価値を持つのは手先の器用さではなく、違和感を言語化する目です。 発信で文章を磨いてきた人は、実はここでかなり有利に戦えます。
発信と収益に繋げる3つのルート
僕はAI活用の発信とコンテンツ販売で月100万円を12ヶ月連続で達成して、月1,000万円も経験しましたが、その過程でずっと感じていたのが動画の壁でした。 テキストと画像だけでは届かない層が、確実にいる。 でも動画に本気を出すと、時間か外注費のどちらかが溶ける。 HyperFramesは、このジレンマに対する現時点での最適解だと思っています。
活かし方は、大きく3ルートです。
1つ目は、自分の商品や記事のプロモ動画。 noteの発売告知、企画の予告、実績報告。 テキストだけのポストに15秒のブランド動画が付くだけで、タイムラインでの止まり方が変わります。 FRAME.mdで世界観が統一されているので、出せば出すほど「あの雰囲気の動画の人」という認知が積み上がる構造です。
2つ目は、SNS動画の量産体制です。 縦型の9対16も指定ひとつで作れるので、ショート動画のフォーマットにそのまま乗せられます。 週次のAIニュースまとめ、過去記事の動画版、実績カード。 一度プロンプトの型を作ってしまえば、あとは中身を差し替えるだけのルーティンになります。 継続が仕組みで担保されるのが、テンプレ運用との一番の違いです。
3つ目が、制作受託と法人提案です。 ここで大事なのは、動画編集者として安く受けないこと。 売るのは編集の作業ではなく、動画が量産され続ける仕組みの導入です。 FRAME.mdの設計、プロンプトの型化、担当者への研修までセットで提案すれば、単発の編集案件とはまったく違う土俵で戦えます。 そもそもこの記事の内容を日本語で説明できる人が、現時点でほとんどいません。 どのルートを選ぶにせよ、手順を再現できた時点で、あなたは相当希少な側にいます。 ひとつだけ釘を刺しておくと、道具を入れただけで売上が立つわけではありません。 誰のどんな面倒を減らすのかという設計と、届け方がセットになって初めて機能します。 逆に言えば、そこを考え抜いてきた人にとって、これほど強い増幅装置もなかなか無いです。
今日やることは3つだけ
長い記事をここまで読んでくれて、ありがとうございます。 最後に、今日やることを3つに絞ります。
1つ、Node.jsとFFmpegを入れる。 2つ、スキルをインストールする。 3つ、10秒でいいから1本レンダリングする。
以上です。 FRAME.mdは明日でいい。 レシピの使い分けは来週でいい。 今日は、雑な1本を書き出すことだけに全振りしてください。
理由はシンプルで、この分野は触った人と眺めていた人の差が開くスピードが異常だからです。 1本出した人は、2本目で修正指示に慣れて、5本目でブランドが乗って、10本目で自分の型ができます。 眺めていた人は、3ヶ月後も「そういえばあれ、気になってたんだよな」と言っています。 僕はAIの波の中で、この光景を何度も見てきました。 差がつくのは才能じゃなくて、着手の早さです。
それに、最初の1本は下手でいいんです。 というより、下手な1本を出さないと、修正指示の練習台が手に入りません。 HyperFramesの本領は直しのループにあるので、たたき台を出す速度がそのまま成長速度になります。 完璧主義は、今日だけお休みさせてあげてください。
しかもHyperFramesは無料で、必要なのはすでに手元にあるClaude CodeかCodexだけ。 初期投資という言い訳が使えない、珍しいタイプのチャンスです。 エラーが出たら、エラーごとエージェントに投げる。 分からなくなったら、この記事に戻ってくる。 それだけで完走できるように書いたつもりです。 どうしても黒い画面と相性が悪かったら、第6章のVideo Agentで1本作るところから始めても大丈夫です。 大事なのは方式ではなく、今日中に1本の動画を書き出すことなので。 今夜、あなたの1本目のMP4が書き出されることを楽しみにしています。
まとめ
最後に、この記事の要点を置いておきます。
動画は、撮って編集するものから、書いてレンダリングするものになりました。 HyperFramesは無料のオープンソースで、Claude CodeでもCodexでも動きます。 素材ゼロで解説動画も音ハメ動画もモーショングラフィックスも作れて、FRAME.mdを仕込めばすべてが自分のブランドの見た目で出力されて、修正は一文で通ります。 ターミナルが苦手な人にも、ブラウザで完結するVideo Agentという入り口まで用意されています。 編集スキルの有無が、動画発信の参入障壁ではなくなった。 これがこの記事で一番伝えたかったことです。 もちろん、最初の1本から完璧なものは出ません。 でも修正が一文で済む世界では、粗い1本目こそが最強のスタート地点になります。
そして、このやり方を日本語で説明できる人は、まだほとんどいません。 先に動いた人から順番に、発信の武器と仕事の提案材料が手に入る局面です。 この記事が、あなたの1本目のきっかけになれば嬉しいです。
うまくいった設定やプロンプトの改良版、HyperFrames関連のアップデート情報は、以下で続報を流していきます。 質問もらえれば、拾えるものは企画にして答えていきます。
![ChatGPT Work: End the Correction Hell with One-Shot Requests [Templates Included]](/cdn-cgi/image/width=1920,quality=90,format=auto,metadata=none/https%3A%2F%2Fcms-assets.youmind.com%2Fmedia%2F1785174444638_v6q5ut_HOIfqlObMAAEjxQ.jpg)
