Communitygithub.com

魅せるモノローグ(16:9)

一人語りの撮影から、FringeLinesデザインキットを使った「引き込まれるモノローグ」動画を生成します。ジャンプカット、ポートレートPiP、セリフ調のキネティックテキスト、図解(ピラミッド、比較、ロードマップ、ステップ、大きな統計)、Bロールカードが紙のキャンバス上で展開され、コールアウトカード、ロワーサード、チップ、CTAピル、緑のエンドカードが音声にワード単位で同期します。YouTube解説、一人語りのコメンタリー、ニュースレター動画化、そして「一つのアイデアを、上手く伝える」作品に最適です。

魅せるモノローグ(16:9) とは?

このスキルは、16:9の一人語り動画を、プロフェッショナルな「引き込まれるモノローグ」スタイルに変換します。Ali Abdaalの手法を参考に、FringeLines v2.1デザインシステムに基づいたビジュアル文法を採用しています。動画は、話し手のフルフレームと、話し手がポートレートPiPに縮小されるペーパーキャンバスの2つのレイアウトを交互に使用し、約55%がフルフレームのトーキングヘッド、残りが図解やカードで構成されます。テキストは音声とワード単位で同期され、1画面1アイデアの原則に従い、各セクションで視覚的な変化が10〜20秒ごとに発生します。スキルは、カット(テイクの文字起こし、フィラーの除去、ジャンプカットの適用)とレンダリング(Remotionを使用して最終動画を生成)の2ステップで構成され、ユーザーはビート構造を定義したJSONファイル(beats.json)を通じて各視覚要素のタイミングと種類を細かく制御できます。搭載するビートタイプには、タイトル、ネームロワーサード、コールアウトカード、チップ、キネティックテキスト、スタック(ピラミッド)、比較図、ロードマップ、ステップ、統計表示、メディアカード、エンドカードなどがあり、すべてFringeLinesデザイントークンに従います。このスキルは、YouTube解説、一人コメンタリー、ニュースレターの動画化に理想的で、Markdownで定義された厳格なペーシングルールとデザインガイドラインに従います。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/qdevery/fringe-lines-video/tree/main/.agents/skills/engaging-monologue

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

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

ドキュメント

魅せるモノローグ(16:9) は何をしますか?

参考:Ali Abdaal, 「How I'd Create Content in 2026 (If I Had To Start Over)」(youtu.be/A8PxRHQrLJ8、16分、1080p)。 モーション言語はその動画からコピーされています。ルックはFringeLines v2.1キットです: My Drive/FringeLines Design System files/Fringe Lines Design system v2_1/ および …/handoff/fringelines-tokens.css 内のトークン。

参考動画が効果的な理由

動画から2秒に1フレームの割合で測定し、トランジション付近は密にサンプリング。

  • 約55%がプレーンなトーキングヘッド。 固定カメラ1台、ミッドショット。約5秒ごとにジャンプカット(中央値:16分で約122カット)。各カットはワイドとパンチインを交互に繰り返し、カットが意図的に見えるようにしている。
  • レイアウトは2つだけ:
    1. フルフレームのスピーカーに、名前のロワーサード、左上のカラードコールアウトカード(小さなラベルピル付き)、下部の白いセリフ体の文章、頭の近くの小さなカラードチップ、中央下部のスポンサー/CTAピルなどを重ねる。
    2. ペーパーキャンバス。 スピーカーはポートレートPiP(角丸、白枠、右側、約400×560)に縮小され、暖かみのあるオフホワイトのページに薄いスウッシュが1つある上にグラフィックが構築される。キャンバスには、キネティックな文章、番号付きロードマップカード、ピル図、ピラミッド、スクリーンショットやBロールが角丸カードに入り、その下にキャプションが表示される。
  • 常時キャプションはなし。 画面上のテキストは選ばれたもの。一度に一文、スピーチに合わせてワード単位で表示される。各単語は最初は薄くぼやけ、その後鮮明になる。キーフレーズは色が変わる。
  • 図は、各項目が語られるたびにピースごとに構築される。 ピルは少しオーバーシュートしながらポップインする。ピラミッドの層は上からドロップインする。
  • カメラはグラフィック内を移動する。 5枚のロードマップカードは各チャプターで再登場し、アクティブなカードにズームインし、他はぼかす。
  • 終了はカットではなくぼかし。 フル↔PiPの変更は、約0.4秒の素早いイーズモーフ。
  • リズム: 10~20秒ごとに新しい視覚的アイデア、セクションごとに1つの強調ポイント(白黒)、各人物が最初に登場するときにロワーサード。
  • サウンド: レイアウト変更には柔らかなスウッシュ、アイテム着地時には軽いポップ。声の下に適度に抑えられている。

FringeLinesへのマッピング方法(ここから逸脱しないこと)

| 参考要素 | FringeLines版 | |---|---|---| | 温かみのあるセリフ体+コーラルハイライト | すべての表示テキストにInstrument Serif。ハイライトはイタリックのフレーズで、紙の上ではインクブルー #1A4F6B、ビデオ上では白。オレンジ #D4622A は重要な数字1つだけ([7 AM]、統計)。 | | ピルの角丸サンセリフ体 | ピル、チップ、リストアイテム、スタックラベルにArchivo 500–600 | | スモールキャップスのラベル | IBM Plex Mono 600、大文字、+0.14em、22px以上:アイブロウ、ラベルピル、ソース、メタ | | コーラル/レッドグラデーションのコールアウト | キットグラデーション:グリーン(デフォルト)、ブルー(2番目のアイデア)、オレンジ(警告または「間違い」) | | パステル調ロードマップカード | グリーン、ブルー、オレンジのウォッシュ、モノの数字バッジ、破線のオレンジコネクター | | クリーム色の紙+スウッシュ | 紙 #F7F7F5、薄いグリーンウォッシュのスウッシュ1つ | | ドロップシャドウ | なし。 フラットな面、2pxのヘアライン #E3E5DF、PiPの白枠、半径16–18 | | スポンサーピル | 白いCTAピル(fringelines.co / ニュースレター)にオレンジのモノ「Link in description」タブ | | チャンネルアウトロ | 緑のエンドカード、Clip Slidesカバー:モノのアイブロウ、オレンジのルール、セリフ体の見出し(イタリックフレーズ1つ)、Archivoサブ、● fringelines.co |

キットルールは引き続き適用:

  • 1画面1アイデア;
  • 1画面にオレンジは1つまで;
  • グリーンがデフォルト、ブルーが比較;
  • すべての統計にsourceあり;
  • 22px未満は禁止。

構成要素

  • テンプレート: pipeline/remotion/src/Monologue.tsx、1920×1080 / 30fpsのMonologueコンポジション。ShortV2.tsxの顔追跡を再利用。
  • ビルド: pipeline/build_monologue.py。cutとrenderの2ステップ。
  • 作業フォルダ: work/monologue/<slug>/ に clip.mp4、props.json、transcript.txt、beats.json、faces.json を格納。
  • 出力: out/monologue/<slug>.mp4、-14 LUFSにノーマライズ。
  • 作業例: work/monologue/morning-loop-test/beats.json、10月30日エピソードのクインの62秒クリップ。

1. テイクを取得する

シングルカメラの16:9録画で、良好な音声、1人、およそ1~15分。inbox/monologue/<slug>/take.mp4に配置。

エピソードからソロ部分を切り出すには、カメラ映像とスタジオ音声トラックをマルチプレクサする。build_short.xml_offsetsでDescript XMLからオフセットを取得;morning-loop-testの作成方法を参照:

ffmpeg -ss <t0-videoOffset> -t <dur> -i Quinn.mp4 -ss <t0-audioOffset> -t <dur> -i studio-sound-Quinn.m4a -map 0:v -map 1:a … take.mp4

2. カット

~/.shorts-skill/bin/python pipeline/build_monologue.py cut --slug <slug> --src inbox/monologue/<slug>/take.mp4 \
    [--range 12.0:95.5 --range 120:180] [--replace "gtm=>GTM" --replace "quick=>Quick"]

カットステップの処理:

  1. Whisperでテイクを文字起こし(words-src.jsonにキャッシュ)。
  2. shortsと同じプランナーを使用して、フィラー、どもり、長いポーズを除去。
  3. 各ジャンプカットでパンチイン(1.0 / 1.12、顔中心)を交互に適用。
  4. transcript.txt を書き込み、カットされたクロック上の word@seconds 形式。

--replace はリビールのタイミングに使われる単語のみを修正;自動キャプションはなし。

3. work/monologue/<slug>/beats.json を作成

transcript.txt を読み、それに基づいてビートを計画。

{"brand": "FringeLines", "beats": [
  {"type": "title",   "at": 0.2,  "end": 2.0,  "eyebrow": "FringeLines · Monologue", "text": "The *morning loop*"},
  {"type": "name",    "at": 2.1,  "end": 5.4,  "text": "Quinn", "role": "Host · Fringe Lines"},
  {"type": "chips",   "at": 3.0,  "end": 7.4,  "items": [{"text": "GTM loops", "at": 3.1}, {"text": "Coding loops", "at": 5.1, "tone": "blue"}]},
  {"type": "text",    "at": 7.6,  "end": 11.3, "eyebrow": "What's a loop?", "text": "Loop's just a *stated goal* and then it works *autonomously*"},
  {"type": "callout", "at": 11.5, "end": 16.2, "label": "The setup", "tone": "green", "text": "I use Quick Desktop with routines that execute at any time"},
  {"type": "overlay", "at": 16.4, "end": 18.3, "text": "I usually run it at [7 AM]"},
  {"type": "stack",   "at": 22.4, "end": 36.4, "title": "My core team · 4 people", "items": [{"text": "Account executive", "at": 25.6}, "…"]},
  {"type": "stat",    "at": 51.2, "end": 55.1, "kicker": "My regular account team", "value": 14, "text": "people I'm interacting with on a regular basis", "source": "Quinn's own count · Fringe Lines, Oct 30 2026"},
  {"type": "end",     "at": 58.4, "end": 61.4, "text": "Building the *morning loop*", "sub": "The full walkthrough is in this week's episode."}
]}

時間

  • 時間はカットクリップ上の秒数。end(またはhold)でビートが閉じ、0.3秒かけてぼかし終了。
  • テキストはスピーチに合わせてワード単位で同期して表示される。text内のすべての単語は、ビートのウィンドウ内のトランスクリプトと照合される。
    • 同期が機能するよう、スピーカーの発言をそのまま引用する(軽いトリムは可)。
    • テキストがパラフレーズの場合、リビールは均等にフォールバックする。その場合は "reveal": "even" で強制。
  • アイテムのat時間はデフォルトで均等にずらされる。各アイテムが発話される瞬間に設定し、単語の約0.1秒前にする。

マークアップ

  • *イタリックハイライト*:1画面につき1フレーズ。
  • [アクセント数字]:オレンジ、1画面につき1つ、数字のみ。

ビートタイプ

スピーカーフルフレーム(オーバーレイ):

タイプフィールド用途
titletext, eyebrow?最初の2~3秒、暗くしたフレーム上にコールドオープンタイトル
nametext, role?人物が最初に登場するときのロワーサード
overlaytext下部に白いセリフ体で表示される、覚えておいてほしい一言の文章
callouttext, label?, tone?, side?左上(または右)のカラードカード。モノラベルのピル付き:「間違い#1」、「設定」、「ルール」など
chipsitems[{text, at, tone?}], side?, tone?頭の横にポップインする2~3個の短いタグ:内なる声、名前、選択肢
ctatext, sub?下部のピル:ニュースレター、エピソード、オファー。1回、通常は動画中盤
bw(なし)スピーカーの白黒強調。overlayと組み合わせる
media + "full": truesrc, video?, from?PiPにスピーカーを残したままの全面Bロール

ペーパーキャンバス(スピーカーはPiPへ移動):

タイプフィールド用途
texttext, eyebrow?, align?キネティックな文章:定義、テーゼ、「最も重要な…」のライン
stackitems[{text, at, tone?}](下→上), title?ピラミッドまたは層:基礎→戦略→ペイオフ、チーム階層
comparetitle?, left{label, items}, right{label, items}, winner?A vs B:趣味 vs 収入、ビフォー vs アフター。負けた方は終わり近くでグレーアウト
roadmapitems[{text}](≤6), active?, zoom?動画のチャプター。最初に1回表示し、その後チャプターごとにactive = チャプターインデックス、zoom = ズームインするタイミングで再利用
stepsitems[{text, at}], title?ヘアラインルール付き番号付きリスト:専門家、ツール、手順
statvalue, prefix?, suffix?, decimals?, kicker?, text, sourceオレンジでカウントアップする1つの数字。ソース必須
mediasrc, title?, meta?, video?, from?角丸カード内のスクリーンショットまたはBロール、キャプション(タイトル+モノメタライン)付き。ファイルは作業フォルダに配置
endtext, eyebrow?, sub?, url?, tone?緑のエンドカード(2~4秒)

0.7秒未満の間隔で連続するペーパービートはPiPレイアウトに留まり、スピーカーがバウンドしないようにする。

ペーシングルール(参考動画より)

  • titleとnameで開始し、両方を最初の5秒以内に配置。
  • ペーパービートはランタイムの35~45%を占める。 視覚的変化なしで約20秒以上経過させず、ペーパーに15秒以上留まらない。
  • 2つのレイアウトを交互に使用。calloutを連続して配置せず、間にtextまたは図を入れる。
  • 1ビート1アイデア。 textビートは14ワード以下、コールアウトは16ワード以下に抑える。
  • 図のアイテムは単語上に着地し、決して一度にすべては着地しない。図の最初のアイテムはビート開始から約1秒以内に着地する必要がある;そうでない場合はビートの開始を遅らせる。
  • セクション:
    • イントロの最後にroadmapを表示。
    • 各セクションの開始時にactiveを設定して再利用。
    • 各セクションをそのキーラインのoverlayで閉じ、最も重要なものにはbwを付ける。
  • ctaは5分に1回まで、最初の30秒以内には配置しない。
  • endカードで終了。最後の単語を過ぎても再生を続けられる。

誠実さ

  • 画面上の数字は、発言された内容であるか、sourceに名前付きソースが記載されている必要がある。
  • 他の人のコンテンツのスクリーンショットには、metaでクレジットが必要。
  • スピーカーの口に言葉を入れない:引用ではないoverlayまたはtextビートは、発言ではなくラベルとして読まれるべき。

4. レンダリング

~/.shorts-skill/bin/python pipeline/build_monologue.py render --slug <slug> [--sfx-db -22]
  • 顔を1回追跡する(faces.json;再カットする場合は削除)。
  • レンダリング時間は動画の長さに比例;1分のテストはMac miniで数分かかった。
  • 効果音:レイアウト変更ごとにスウッシュ、アイテム着地時にポップ、タイトルとエンドカードへのライザー。--sfx-db を −18 に上げるとよりエネルギッシュに。

5. QA(常に実施)

for t in 1.5 5 10 20 30 40 50 60; do ffmpeg -v error -y -ss $t -i out/monologue/<slug>.mp4 -frames:v 1 -vf scale=640:-1 /tmp/m_$t.png; done

各項目を確認:

  • テキスト: PiPの下にテキストがはみ出ていないこと(ペーパーエリアは x = 1320 で終了)。スタックラベルは1行に収まっていること。
  • ハイライト: 余分な*や[がないこと。1画面にオレンジは最大1つ。
  • 顔のフレーミング: PiP内で顔が中央にあり、パンチインで頭が切れていないこと。
  • リビールのタイミング: リビールは発話された単語に合っていること。ビートが長時間薄い単語を表示している場合、atが早すぎる。
  • ラウドネス: ffmpeg -i out.mp4 -af ebur128 -f null - 2>&1 | grep " I:" の表示が約 -14。

ユーザーに報告:

  • ランタイムとビートリスト(時間 → タイプ → テキスト);
  • まだチェックが必要なもの:数字、名前、スクリーンショットのクレジット;
  • テキストが逐語的でなかったため均等リビールにフォールバックしたビート。

まだ構築されていないもの

  • 9:16版: コンポジションは16:9のみ。縦向きの場合は、editorial-shortスキルでショートをカット。
  • 自動プランニング: beats.jsonの作成は判断が必要なため、手動またはtranscript.txtからClaudeが行う。

Individual skills in this repo

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

関連スキル