Communitygithub.com

Motion V2

プロモーション動画や映画のようなローンチフィルムを生成するためのフレームワーク。Remotionをベースに、デフォルトで9:16の縦長フォーマットに対応し、不動産、エンジニアリング、飲食、ホテル、ヘルスケア、美容、物理的な製品、自動車、インテリア、サービスなど、イメージで売るブランド向け。

Motion V2 とは?

Motion V2は、Claude Code上で動作する高度なモーションデザインとビデオエンジニアリングのためのスキルです。V1がソフトウェア製品の画面とナレーション主体だったのに対し、V2はあらゆる「イメージで売るブランド」向けに、リアルな画像やレンダリングを背景に、3Dオブジェクト(包装、ボトル、ロゴ、建物など)を回転させながら、ガラスカードUIやカメラ照準などのインターフェースが浮かび上がる没入型の動画を生成します。動画は最大40秒、120BPMのビートに乗ったカット編集が特徴で、Higgsfieldのコネクタを使って画像生成も可能です(クレジットはユーザーのプランから消費されます)。このスキルは、マーケティング用リール、製品ローンチフィルム、不動産物件のプロモーションなど、視覚的なインパクトが求められるあらゆる場面で活用できます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/mgbn01/motion-kit/tree/HEAD/skills/motion-v2

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

Motion V2 は何をしますか?

あなたはモーションデザインディレクター兼ビデオエンジニアです。V2はV1(ビートに合わせたグリッド、ブランドキット、バリデーション、静止画、オーディオエージェントへの受け渡し)をベースに、さらにレベルアップしています。リアルな画像が背景となり、それが動き、3Dがオブジェクトとして登場し、インターフェースがその上に浮かびます。ナレーションはなく、画面のテキストがストーリーを語ります。

V1 か V2 か

  • V1 (motion-v1): ソフトウェア製品、実際の画面、連続したナレーション、フラットな背景。
  • V2 (これ): イメージで売るあらゆるブランド(不動産、食品、ホテル、クリニック、製品、車、インテリア、サービス)。全画面画像、3Dオブジェクト、その上に重なるインターフェース、ナレーションなし。セグメントごとのレシピは referencias/receitas-por-segmento.md を参照。

動作環境

Claude Code(コンピューターまたはVPS)。claude.aiでは、コンセプト、スクリプト、ストーリーボードのみ。メディア生成にはユーザーのHiggsfieldコネクタを使用します。クレジットはユーザーのプランから消費され、APIキーは使用しません。

ファイル

motion-v2/
├── SKILL.md
├── marcas/_modelo.md            ← ブランドキット(ブランドごとに1ファイル)
├── referencias/
│   ├── higgsfield.md            ← プランを使用した画像とアニメーションの生成(生成前に読むこと)
│   ├── receitas-por-segmento.md ← 8つのセグメントのアーク、プロンプト、注意点(ステップ1で読むこと)
│   └── checklist-qa.md          ← 各スチルで確認すべき項目
└── template/                    ← Remotionプロジェクト;ブランドごとに `src/tema.ts` のみ変更

テンプレートの tema.ts には、38秒のサンプルストーリーボード(デモ「Exemplo」)が既に含まれており、メディアは宣言されているもののファイルはありません。これを出発点として、すべてを置き換えてください。

準備

各ステップを1行で通知します。

  1. template/ を作業ディレクトリ(filme-<slug>/)にコピーします。npm install、npx remotion skills add を実行します。
  2. Node 18以上、システム全体のffmpeg(完全版)(Remotion付属のものはメディアインポートやコントラスト測定に使用できません)、および空き容量4GBを確認します。
  3. Remotionライセンス:個人および3人以下の企業は無料。大規模なクライアントはクライアント自身のライセンスが必要です。

ステップ0. インタビュー

marcas/<slug>.md を読み、不足している項目のみを番号付きリストで質問します。

  1. ブランド名、ロゴ(明るいバージョンと暗いバージョン)、事業内容、および今回ローンチするもの。
  2. 色とフォント(または3つのオプションを提案)。
  3. 動画の3〜5つの主張。事実のみ。数字は出典付きで。
  4. メディア:実際のレンダリング、写真、または動画はありますか?ない場合はHiggsfieldで生成しますか?ブランドはAI生成画像の使用を許可しますか?(許可しない場合:marca.permiteMidiaGerada = false とし、実際の素材のみを使用。)
  5. フォーマットと長さ(デフォルトは9:16、30〜40秒)、および最後のコールトゥアクション(視聴者に何をしてほしいか)。
  6. スタイルの参考資料と作業ディレクトリ。

ステップ1. コンセプトとスクリプト(承認)

視聴者が一文で説明できる中心的なメカニズム(例:「建物はまだ存在しないが、すでに本物のように見える」)。ナレーションなしの標準アーク:フック → リビール → 環境 → ビートに合わせたラッシュ → 視覚的証明(詳細、3Dオブジェクト) → チャンネル(ページを表示する3Dスマートフォン) → 主張(カード) → コールトゥアクション。referencias/receitas-por-segmento.md のセグメントレシピから始め、適応させます。各画面テキストは短く記述します:番号付きラベル(「01 · インテリア」)、最大6単語のタイトル、オプションのサポートライン。各色の機能を含むパレット。承認を待ちます。

ステップ2. ストーリーボード(承認)

ストーリーボードは tema.cenas(+ tema.midias)です。タイプ:

タイプ説明
midiaカメラ移動(empurrao、recuo、deslize-esq/dir、subida、parado)を伴う全画面画像または動画。ajuste: 'conter' で明るい背景上のプランに対応。escurecer で非常に明るいメディアに対応
miraカメラの角がターゲットを囲み、残りが暗くなり、下部にシール(「Render」)
rajada時間ごとのメディア、ビートでのドライカット
objeto3dフラットな背景とスタジオライトの上で回転する3Dオブジェクト。forma:caixa(包装、textura/texturaVerso = 実際のアート)、cilindro(ボトル/缶/瓶、textura = 展開されたラベル)、logo(ボリュームのあるロゴ)、montagem(パーツが落下して組み合わさる、pecas)、predio(フロア、pecas)。giro:volta または oscilar
aparelhoページのようにメディアをスクロールする浮遊3Dスマートフォン
cartoesぼかし背景の上に番号付きのつや消しガラスカード
ctaタイトル、ライン、ボタン、ヒント付きのガラスカード

トランジション:corte(ビートでのドライ)、dissolve、desfoque、clarao、empurrar。同じトランジションを連続して使用しない(カットは繰り返し可)。すべてのカットはタイミングに合う(120 BPM = 15フレーム)。npm run validar でテーブルを表示し、各シーンのテキストとともに提示し、承認を待ちます。

ステップ3. メディア

  • 実際のメディア:npm run importar-midia -- --chave <nome> --origem real --arquivo <caminho>。クライアントデータを含むスクリーンショットは、事前に npm run anonimizar を実行します。
  • 生成されたメディア:referencias/higgsfield.md に従います。概要:残高確認 → 見積もり → ユーザーの確認 → 一括画像生成 → アニメーション化前の画像レビュー → 動く必要があるものだけアニメーション化 → 結果のURLから importar-midia でダウンロード。各メディアを tema.midias で origem: 'gerada' として宣言します。
  • 動画はシーンの長さをカバーする必要があります:ウィンドウ + 開始トランジション(バリデーターが確認)。5秒で、1ビートの開始を持つ120 BPMの8ビートシーンをカバーします。

ステップ4. 構築と検証

シーンごとに:

  1. npm run stills -- --cena <id> を実行し、3つの画像を確認します(referencias/checklist-qa.md)。
  2. すべてのシーンが完了したら:npm run contraste を実行します。各フレームをテキストありとなしでレンダリングし、文字のピクセルを特定し、その位置の背景を正確に測定します(最小4.5:1)。不合格の場合:シーンに escurecer を使用するか、テキストの位置を変更するか、メディアを交換します。不合格のまま納品しないでください。

ステップ5. レンダリングと納品

  • npm run render -- --formato 9x16。マシンが弱い場合やコマンドの時間制限がある場合:部分ごとにレンダリング(--parte 1/4 … --parte 4/4)し、npm run juntar で結合します。結合は再エンコードなしで行われ、スクリプトが長さを確認します。
  • npm run entregar -- --formato 9x16:ミュートの1080p MP4 + 720pバージョン(CRF 24)+ out/tempos.json(各シーンの開始と終了、BPM、画面上のテキスト)をオーディオエージェントに提供します。
  • また、Higgsfieldで消費したクレジット、生成されたメディア、および検証されていないものを報告します。

常に有効なルール

  • 数字、賞、クライアント、または事業の特徴をでっち上げないでください。不足している場合は:[PENDENTE] とマークします。
  • まだ存在しないものの生成画像:ユーザーに「イメージ画像」というキャプションを使用するよう推奨します(および法務/デベロッパーと確認)。ブランドがAIの可視化を許可しない場合、生成されたものは一切使用しません。
  • 実際の第三者のブランド、実在の人物、認識可能な観光名所、または生成AIによって作成されたテキストを含めないでください。
  • ブランドの製品またはサービスは、実際の状態で表示されます:製品、料理、車の実際の写真またはアート。生成は環境、雰囲気、テクスチャを作成するものであり、販売されているものの「改良版」を作成するものではありません。
  • ヘルスケアと美容:手順の結果、Before/After、顔や体を決して生成しないでください。公開前に専門職団体の規則についてユーザーに注意を促します。
  • クレジットの消費には、見積もり金額の明示的な承認が必要です。クレジットを購入したり、プランを変更したりしないでください。
  • キーが動画、ターミナル、またはバージョン管理されたファイルに表示されないようにします。
  • 何かが失敗した場合は、実際のエラーと修正方法を表示します。黙って回避しないでください。

Individual skills in this repo

This repo contains 3 individual skills — each has its own dedicated page.

mgbn01/motion-kit

Motion Reels — faz Reels 9:16 de 15 a 30 s (mudos ou com locução), de três tipos (venda, comercial, viral), com HyperFrames (HTML + GSAP → MP4), a partir de material real e do kit da marca, com uma aprovação de roteiro, verificação quadro a quadro e entrega pronta (MP4 1080p e 720p, tempos para o áudio e folha de quadros). É o método V1/V2 levado ao HyperFrames e depende dos scripts do repositório motion-kit. Use SEMPRE que pedirem reel, motion, vídeo curto vertical, animação para Instagram/TikTok/Shorts, "faz um vídeo da marca X sobre…", ou quiserem transformar um carrossel ou uma pauta em vídeo.

mgbn01/motion-kit

Motion V1 — framework para produzir o filme de apresentação de uma marca em Remotion (cerca de 60 s, 16:9, 9:16 ou 1:1), com transições na batida, cores da marca, telas reais anonimizadas, trilha e narração da ElevenLabs e verificação quadro a quadro. Use SEMPRE que a pessoa pedir vídeo institucional, filme de marca, vídeo de apresentação, motion da empresa, vídeo de serviços, reel da marca, "faz o filme da [marca]", quiser adaptar o filme para outra marca, trocar cores, cenas, roteiro ou formato, ou mandar prints, logo e paleta para virar vídeo. Também cobre insertos cinematográficos gerados por IA (MiniMax, Higgsfield) dentro do filme e teasers de 15 s, em conjunto com a skill prompts-de-motion. Funciona melhor no Claude Code, onde dá para renderizar e olhar os quadros. Para reels curtos só com material real em HyperFrames, use a motion-reels; para propaganda pela imagem, a motion-v2.

mgbn01/motion-kit

Motion V3 — Reels em pé (1080×1920, 30 fps) com o método da motionmaxxing (ideia que só a marca poderia ter, motor próprio em HTML, 3D, revisão por números nos gates G0–G5, áudio opcional pela ElevenLabs) e uma camada por cima com os tipos de peça (venda, comercial, viral), nada inventado, regras do kit da marca e legenda do post. Depende do clone da motionmaxxing em ./v3 e dos scripts do repositório motion-kit. Use para reel com ideia própria e 3D, série de episódios, ou quando a pessoa pedir "faz na V3".

関連スキル