Communitygithub.com

CrissAlvarezH/reel-studio

Reel Studioワークスペースでナレーション付き解説動画がどのように作られるかを説明します。スクリプト、画像、音声、ビルド、ボード、ミュートテスト、レンダリングなど、すべての工程をカバーし、作成者のスタジオ設定(プロフィール、フォーマット、音声、画像ソース)に従います。プロジェクトの`videos/`内の新規または改訂動画に使用します。動画のスタイルは、ルックとRemotionキットに関する独自のスキル(`styles/<id>/SKILL.md`)を持ち、`LESSONS.md`には過去の動画から学んだ教訓が記録されています。

reel-studio とは?

このスキルは、Reel Studioワークスペースにおけるナレーション付き解説動画の全体的な制作プロセスを定義します。動画の見た目や音声はスタイルが決定しますが、対象ユーザー、フォーマット、音声、画像ソースはスタジオの設定に従います。`animated-video`スキルがブレインストーミングやボード、ミュートテストなどの広範な方法論を提供するのに対し、本スキルとスタイルのスキルが具体的な差異を定義します。プロジェクトの`videos/<slug>/`ディレクトリ内の各動画はRemotionプロジェクトであり、スクリプト、音声、画像、ビルド設定が含まれます。ワークフローは、新規動画作成、スクリプト作成(`video-script`スキル使用)、画像ブレインストーミング、音声生成、画像検索、ビルド、ボード表示、サウンドミックス、ミュートテスト、レンダリングの順で進行します。各工程でスタイルやフォーマットの設定が尊重され、`LESSONS.md`に学びが記録されます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/CrissAlvarezH/ai-reel-gen-app/tree/HEAD/.claude/skills/reel-studio

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

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

ドキュメント

Reel Studio — 動画の作り方

このプロセスはすべてのスタイルで共通です。動画の見た目と音声はそのスタイルによって決まります。誰に向けたものか、フォーマット、音声、画像の出典はスタジオの設定から取得されます。汎用の animated-video スキルは、より広範な方法(ブレインストーミング、ボード、ミュートテスト、レビュー)を保持しており、本スキルとスタイルのスキルがそれと異なる部分を優先します。推奨事項とともに質問し、「はい」で完全な回答となるようにしてください。アイデアを考え出してプロジェクトのボードに保存するのは、このプロセスが始まる前の content-ideas スキルの役割です。

ワークスペース

  • projects/<id>/ — プロジェクト: クリエイターが動画を作成する1つのチャンネル(スタジオのプロジェクトセレクター。プロンプトで現在開いているものが指定されます)。その config/ には設定(Ajustes)が格納されています: profile.json、voice.json、account.json(そのInstagram、Mi cuenta)。account/ にはそのアカウントからダウンロードされたものが含まれます。依頼がない限り、他のプロジェクトのフォルダには触れないでください。
  • projects/<id>/videos/<slug>/ — 1つの動画: スタイルのテンプレートからコピーされたRemotionプロジェクト。title.txt(スタジオでの名前)、style.txt(スタイルID)、audio/vo.txt(ナレーション、音声に渡されるそのままの内容)、audio/beats.json(スクリプトの構造)、src/format.json(サイズ、fps、ラウドネス)、CREDITS.md、caption.md、out/(レンダリング結果、ボード。バージョン管理外)。
  • formats/<id>/format.json — フォーマット: 動画の種類(生成音声またはクリエイターの録音音声による全アニメーション、クリエイターがカメラに向かって話しアニメーションが付くものなど)、画面に表示されるもの、カットの方法。動画は format.txt でフォーマットを指定します(なし: デフォルトのアニメーション)。skill は独自の指示を指し、overlay はスタイルのテンプレートに追加するファイルを指します。"footage": true は動画が footage/ 内の録画から始まることを意味します("voiceOnly": true: その音声のみが使用されます)。
  • styles/<id>/style.json — スタイル: パレットと各色の意味、フォント、ルック、モーション、画像、避けるべきもの。skill は独自の指示を指し、template は新しい動画がコピーするRemotionプロジェクトを指します。
  • config/(ルート) — すべてのプロジェクトで共有される設定: images.json(画像ソース)、social.json(スクレイパー)。
  • tools/ — 共有スクリプト。LESSONS.md — 過去の動画からの教訓。
  • projects/<id>/inspiration/<account>/ — プロジェクトの「Inspiración」ページで研究された他のアカウントのリール: account.json(analysis.text: そのアカウントで効果的な要素)、リールごとに reel.json(メトリクス、キャプション)、transcript.json、analysis.json(フック、構造、ビジュアル、CTA、参考にする点)、hook.jpg(最初の3秒)、sheet_NN.jpg(1フレーム/秒)。角度やフックとして依頼されたら使用しますが、クリエイターのプロフィールに合わせて調整し、スクリプトを決してコピーしないでください。

設定はスタジオから提供される

Reel Studioは、プロフィール(言語、プラットフォーム、オーディエンス、長さ、キャプションルール)、動画のフォーマット、音声、画像ソースを毎ターンプロンプトに含めます。これらは本スキルやスタイルのスキルよりも優先されます。音声IDや設定、サイズ、フレームレート、ラウドネスターゲットをハードコードしないでください。

APIキーはワークスペースの .env に存在します(Ajustesで設定され、各キーの用途(Voz、Extracción de datos)の横に記載されています)。ツールはこれらを読み取ります。キーを表示したり、チャットで要求したりしないでください。キーが不足している場合は、クリエイターにAjustesで追加するよう依頼してください。

Python: 標準ライブラリのみを使用するツールは python3(Windowsでは python)で実行します: tts.py、el_words.py、standin_words.py、commons.py、openverse.py、pexels.py、pixabay.py、unsplash.py、generate_image.py。パッケージが必要なツールはワークスペースのvenv、../../../../.venv/bin/python(Windows: ../../../../.venv/Scripts/python.exe)で実行します: cutout.py、audio/mix.py、sheet.py(snap.sh が使用するか、venvがない場合はffmpegを使用)。切り抜きを行うスタイルはvenvが必要です(Ajustes → Requisitos でインストール)。以下のパスは動画フォルダからの相対パスです。

開始前に

動画のフォーマットを読んでください: formats/<format.txt の ID>/format.json と、存在すればそのスキル。これにはこの種類の動画の作り方が書かれており、異なる部分では以下の手順より優先されます(例: 録画がある場合、スクリプトを書いたり音声を生成したりする必要はありません。カットが両方を提供します)。動画のスタイルを読んでください: styles/<style.txt の ID>/style.json と、存在すればそのスキル。フォーマットは色、タイプ、境界線を決定しません。それはスタイルの役割です。LESSONS.md(一般部分とスタイルの部分)を読んでください。スキルやテンプレートがないスタイルは、デフォルトスタイルのテンプレート(template/)をベースに、ルックを style.json に変更して構築されます。開始時にその旨を伝えてください。

手順

  1. 新しい動画 — スタジオが最初のメッセージから作成します(フォルダ、タイトル、スタイル、フォーマット、サイズ)。ターミナルまたは一般的な会話から: scripts/new-video.sh <slug> [style] [format]。
  2. スクリプト — video-script スキルを使用(フック、回答の保持、タイミング、チェックリスト)。ボードからのアイデアのメモを基にします。プラットフォーム、言語、オーディエンス、長さはプロフィールから。単語数 ≈ 音声の測定されたペース × 目標秒数。目標: リーチ。特に指示がない限り。audio/vo.txt では数字をスペルアウトします(「mil cuarenta y dos」)そして src/captions.ts の DISPLAY では数字に戻します。承認を得てください。audio/vo.txt と audio/beats.json を書き込みます。
  3. 画像 — 新しいエージェントでビートごとに画像をブレインストーミングします(animated-video → 画像を見つける)。フィルム全体を通してシステムを表す1つの繰り返し登場する物理的なモチーフを優先します(カードカタログキャビネット = サーバー、引き出し = レコード)。画像はスクリプトの質問を未回答のままにします。最初のフレームで質問を提起し、ナレーションが回答に到達する前に画像や画面上のタイトルが回答を示してはいけません。コンセプトの承認を得てください。
  4. 音声 — python3 ../../../../tools/tts.py audio/vo.txt audio/vo.mp3、次に ffmpeg -y -i audio/vo.mp3 -ar 48000 public/vo.wav、そして python3 ../../../../tools/el_words.py audio/vo.alignment.json public/vo.wav(→ src/words.json、src/vo_env.json)。音声が存在する前: python3 ../../../../tools/standin_words.py audio/vo.txt src/words.json(音声のペースに合わせてタイミング設定。仮のものと呼びます)。音声に変更がある場合は、最初に短いサンプルを作成してください。返されたオーディオをそのまま使用します(指示がない限りポーズをトリミングしないでください)。生成のたびに文字数が消費されます。理由なく再生成しないでください。
  5. 画像 — 利用可能な検索およびブラウジングツールを使用してWeb上で自由に検索します。どのサイトもソースになりえます。プロンプトにはオプションのAPI統合が記載されていますが、許可リストや必須の順序ではありません。有効化され設定されている場合のみそれらのAPIを使用します。無料のWeb検索にはソース設定は必要ありません。ダウンロードは assets/src/ に保存されます(バージョン管理外)。すべての画像を CREDITS.md に記録します(タイトル、作者、既知の場合はライセンス、元のリンク。ライセンスを捏造しないでください)。ストック素材が適さない場合は、正確なジェスチャーのスマートフォン写真を依頼します(無地の背景、良い照明)。画像の扱いはスタイルの仕様によります。
  6. ビルド — src/lib.ts の ACTS で動作します(各アクトの最初の単語の約0.08秒前にカット)。src/captions.ts ではキャプションを意味の単位として設定し(トランスクリプトと単語単位で照合)、src/film/scenes.tsx ではアクトごとに1シーン。すべてのタイミングはキュー(cue('phrase')、at('phrase'))から取得されるため、新しい音声でフィルムのタイミングが再調整されます。サイズとフレームは src/lib.ts(W、H、FPS、f())から取得し、リテラルな数値は使用しません。コンポーネントはスタイルの仕様によります。
  7. ボード — ./snap.sh out/board <sec> … で静止画と sheet.png をレンダリングします。ビートごとにキーフレームを表示し、承認を得てください。時間はリテラルに渡します(zshではスペース区切りのリストが1つの変数で分割されません)。
  8. サウンド — audio/mix.py のキューシート。シーンが使用する同じキューからのタイミングを使用します。../../../../.venv/bin/python audio/mix.py → public/mix.wav。src/Root.tsx で audio: true を設定します。どのサウンドを使うかはスタイルの仕様によります。納品時に、どのサウンドが合成かを伝えてください。
  9. ミュートテスト — 最初のフルカットの前: ffmpeg -i out/<name>.mp4 -vf "fps=2,scale=270:-1,tile=8x5" out/mute/sheet_%02d.png そしてそれらのシートのみを新しいエージェントに渡します(キャプションは無視し、再説明し、混乱や破損をリストアップします)。修正し、静止画を再確認します。
  10. レンダリング — macOSとLinuxでは、まず孤立したレンダラープロセスを終了します: ps -A -o pid=,ppid=,command= | awk '$2==1 && /chrome-headless-shell/ {print $1}' | xargs kill。次に CONCURRENCY=3 ./render.sh <name> → out/<name>.mp4、フォーマットのラウドネスに正規化されます。長さ、ラウドネス、最初と最後のフレームを確認します。プロフィールのキャプションルールとクレジットを使用して caption.md を書き込みます。その冒頭は回答するのではなくフックの質問を提起します。動画やキャプションが特定の単語をコメントして何かを受け取るよう求める場合、automatizacion.json(Reel Studio → Instrucciones automatización)に、ManyChatまたはInstantDMに貼り付けられる内容を文字列として書き込みます: keyword(正確な単語)、reply(コメントへの公開返信)、dm(ダイレクトメッセージ)、link。それぞれそのままコピーされるため、内部にメモを入れないでください。欠落しているものは空のままにし、リンクを決して捏造しないでください。パス、未解決の問題、スキップされたチェック、合成または発明されたもの、クレジットを報告してください。

動画作成後

顧客のプロジェクト、動画、設定、カスタムスタイル、個人の教訓はローカルに保持され、アプリケーションのリポジトリでは無視されます。レンダリング後を含め、これらをコミットまたはプッシュしないでください。無視されるデータを強制的に追加しないでください。顧客コンテンツ用の別のリポジトリは、クリエイターの明示的なリクエストが必要です。

修正のコストがかかったものを LESSONS.md に追加します。理由とともに1行ずつ、一般部分またはスタイルの部分の下に追加します。

投稿された動画の数字が戻ってきたら、video-script → レビューで読み取ります。アイデアから投稿までを迅速に進めることが重要です。多くの動画は失敗し、それぞれが何かを教えてくれるからです。そのため、新しいバージョンは最小限の変更にとどめます。承認されたものを保持し、テストするものだけを変更し(新しいフック、視聴者が離れた箇所のカット)、変更されたナレーションのみ音声を再生成します。誰も求めていない磨きは加えないでください。

Individual skills in this repo

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

CrissAlvarezH/animated-video

Make animated videos in code with Remotion (React, SVG, three.js): explainers, character stories, motion graphics, kinetic typography, paper collage and animated infographics, in 2D or 3D, from a script or voiceover, in any aspect ratio. Use when asked to animate a script, make an animated video or Reel, or motion graphics. Not for editing camera footage (video-edit) or AI-generated clips (higgsfield-*).

CrissAlvarezH/new-style

Create a new visual style for the creator's videos in a Reel Studio workspace (styles/<id>/style.json): interview him for its name, feel, colours and what each one means, fonts, motion, where pictures come from, reference links and images, then write the style so it shows in Estilos and new videos can use it. Use when he asks for a new style or presses "Nuevo estilo" on the Estilos page.

CrissAlvarezH/persona-hablando

The "Persona hablando + animaciones" format of a Reel Studio video — the creator talks to camera in his own recording; you transcribe it, agree the cuts with him (pauses, flubs, retakes), cut it, and lay the video's style animations over or between his shots. Use for any video whose format.txt says persona-hablando.

CrissAlvarezH/video-script

Write short-form video scripts that hold viewers, using the creator's own video analytics. Use when choosing the hook of a chosen idea, writing or tightening a script before filming (talking-head or narrated explainer), or turning a posted video's insights into lessons. Coming up with ideas is content-ideas'.

関連スキル