longtake

longtake は何をしますか？

onetake by Patrick をベースに、縦型（9:16）ショート動画プラットフォーム向けに改変。 変更点と理由: CHANGES.md。縦型手法: references/vertical.md。

製品から構築された、製品に関する短いモーションフィルム。ビデオエディターでもスライドショー生成ツールでもありません。コンポジション（1つのHTMLファイル、window.__seek(t)）、ムーブライブラリ（lib/motion.js）、実際の製品から録画したフッテージ、同じ空間を共有するサウンドパレット、そして人間が視聴する前にカットにリズムがあり、それが持続するかどうかを判断するオラクルです。

6本のフィルムがこれを教えました。motion-web は3つのカットを経ました。1つ目と2つ目は、均一なケイデンス（リズムの半分）のため「PPT式一个一个展示」として却下されました。Pocket Weather Club はリズムがありながら、それでもPPTでした。v1はすべてのリズムチェックに合格しましたが、各ビートが前のビートを置き換えていたため却下されました。v3は、すべてのビートが前のビートから成長するようになったときに承認されました。キャラクターが見出しに着地し、ページがカードから成長し、キャラクターからステージが開く。それがキャリーの半分です。One dot はオペレーターを追加しました。静止カメラでは「就缺灵动的跟踪运镜」でしたが、各ビートがフレームするものを追いかけるカメラ（遅れ、傾き、落ち着き）では「运镜、镜头和物理都没问题」でした。knockon は因果関係でキャリーしました。各ビートが次のビートを開始する衝突となる、軽い卓上マシンです。clearing はスケールでキャリーしました。1年から30分の自由時間、そして戻るという1つのテイク。カメラは画面上のアンカーを追いかけ、1倍と300倍で同じ位置に着地します。overlap は意味の教訓でした。最初のカットは「美術挺棒但没看出来啥意思」と評価され、ラベル付きカーソルを追加するとさらに悪化しました。アイデア自体がアートワークに組み込まれて初めて、つまり2つのノイズプレートに隠された＆がパスが一致した瞬間に現れるという構造になって初めて、読み取られるようになりました。ここにあるものはすべて、次のフィルムがこれらのフィルムが終わったところから始まるように存在しています。

プロトコルでは得られないもの（最初に読むこと）

以下のルールは主に、フィルムがスライドショーになるのを防ぐための却下条件を書き留めたものです。最低限の基準です。フィルムはすべてのルールとすべてのオラクルの判定に合格しても、なお死んでいることがあります。W1（縦型プロモ、2026-11）はそうでした。キャリー1.00、VERDICT PASS でしたが、判定は「很死板，没到参考片的70%」でした。不足していたのは、承認されたフィルムが持っていたものです。

• すべてのビートに見る価値のある素材。 onetake ローンチフィルム（通常のリファレンス）はv8です。3つのプロンプトがそれぞれ、独自のパレットとモーション言語で完全にデザインされたミニフィルムになります。視聴者は、作品に関するラベルではなく、作品そのものを見ます。最初に問うこと：私たちが所有する最も美しいもの（フッテージ、完成フィルム、実際のUI）は何か？ それを使ってフィルムを構築し、フルフレームで表示します。カードやチップでプロセスを説明するコンセプトは図解であり、よく動く図解もやはり図解です。
• 時計。 優れたケースはすべて、音楽グリッドに合わせてカットします。ダウンビートで送り出し、ドロップで最速のストレッチ、無音ビートで停止。ナレーションがない場合、音楽は装飾ではなくタイムラインです。「読むのに十分な長さ」でビートをタイミングすると、均一なペースになり、堅苦しく見えます。ユーザーのプロジェクトが音楽を禁止している場合は、そのコストを説明し、確認を求めます。
• アーク（弧）。 密度とスピードを1つのピークに向けて構築し、その後解放します。5つの等しい停留所はリストです。
• 内容としての変化。 リファレンスでは、物自体が変形します（ウィンドウが電話にリフローし、バーがフィルムに開く）。静的なビートの間を移動するだけのモーションは、スライド間のトランジションです。
• 見直しのラウンド。 リファレンスは8回のレビュー済みカットを経ました。最初のレンダリング前にフックとピークの静止画を、ポリッシュ前にドラフトを表示します。未レビューのパスを1回で最終版として提出してはいけません。

このスキルを使うとき、使わないとき

• アプリ、ページ、スキル、機能のローンチ/ティーザー/イントロクリップ — はい。
• ナレーション付き機能デモ（30～60秒）、製品の使用状況を示すもの（複数言語対応可） — はい：録画する代わりにUIを再構築します（§4、references/product-demo.md）。
• ユーザーが、その雰囲気を再現したいリファレンスクリップを持っている — はい、§1から開始。
• 長尺、トーキングヘッド、既存の映像をトランジションで編集 — いいえ。
• ユーザーがHyperFramesやRemotionを明示的に指定した場合 — 指定されたものを使用します。それ以外の場合はこのパイプライン。

プロトコル — この順序で、スキップ禁止

1 · 何に触れるよりも先にリファレンスを分解する（硬規則）

python3 scripts/analyze_ref.py ref.mp4 --out ana/     # エネルギーマップ、カット、静止、コンタクトシート、モーションライン

エネルギーマップとシートを読み、フィルムが一致すべき数値を書き留めます。エネルギーマップはフィルムがいつ動くかを示し、motion: 行はどのように動くかを示します — 中央値t80（スナップまたはS字カーブ）とスミア（モーションブラーありでレンダリングされたかどうか）。motion-webフィルムを決定したもの：リファレンスは34%が完全静止、2つのバーストに7つのハードカットがあり、すべての要素を多くの余白を持つ小さなサイズに保っていました。これらは一度見ただけでは明らかではなく、測定せずに構築されたフィルムは、均一なケイデンスで仕上がりました — 2回もです。references/reference-deconstruction.md。

以下のジャンルルールよりも、リファレンスの数値を優先します。 「小さな要素、大きな背景」と「3分の1は静止」は、motion-webから測定されました。onetakeローンチフィルムは約10%が静止で、ほとんどがフルフレームです。W1はジャンルルールに従いましたが（静止0.50、空の背景）、空虚で遅い結果になりました。静止率、フレームの充填率、カット数と最も密度の高いストレッチの位置を書き留め、それらに一致させます。また、リファレンスのビートが何でできているか（完成したデザインピース？ 実際のUI？ タイプ？）、音楽に合わせてカットするかどうかも記録します。これは§2への入力です。

2 · コンセプト — ビートシートの前に3つの中心的なアイデア（硬規則）

コンセプトは、製品ではなく映像に関する1文です。フィルムを構成する単一のアイデア。そのアイデアが異なる3つを書きます — 同じカードで語られる3つのストーリーではありません：

• 1つの要素がすべてを通して変形する — ドットがキャレットになり、スキルリストに分裂し、ローディングリングに空洞化し、スプリングカーブに展開し、ワードマークのiの点として着地する；
• スケールを通した1つのカメラムーブ — キャレットの内部から始まり、入力まで引き出し、送信ボタンを通り抜けて作品にダイブし、完成したフィルムを通って出てくる（cases/clearing-15s：1年→1日→30分→戻る）；
• ビフォー/アフタースプリット — 左側にスライドショー、右側にキャリーとして同じビートを表示し、右側が左側に崩れ込むまで；
• 連鎖反応 — すべてのビートが次のビートを開始する衝突（cases/knockon-15s）；
• または物理的なメタファー、1つの連続したサーフェス、タイポグラフィックシステム…

それぞれについて：フックフレーム、すべての境界をキャリーするもの、除外されるもの（カードなし？ カットなし？）、そしてそのルック — looks/ のプリセット（python3 scripts/look.py sheet → gallery/sheets/looks.png：ペーパー、ダスク、テーブルトップ、ウルトラマリン、リソ、エンバー、それぞれ承認されたフィルムから測定）、製品独自の色（look.py from-shot shots/*.png --out look.json）、またはこのフィルムのために作られたもの。3つを提示し、ユーザーに選ばせます。テンプレートのストーリー（動的言葉→タイプされたプロンプト→チクチクするチェックリスト→結果→スタッカートヒット→黒のワードマーク）は1つのコンセプトであり、決してデフォルトではありません。それに基づいた操作デモは、オラクルのすべての判定に合格（キャリー1.00）しながらも、「和 motion web 很像…没有创造力」として送り返されました。上記のリストの例や、すべてのケースにも同じことが言えます。「one dot」を最初の例だからという理由で選ぶことは、コピーであってコンセプトではありません（W1がそうし、図解として読まれました）。各コンセプトを2つの質問でテストします。最も忙しい秒に視聴者は何を見ているか？（美しいものでなければならず、ラベルであってはならない）そして物自体は何に変わるか？

縦型（9:16）フィルムは、横型フィルムを回転させたものではありません。フレームは縦長のコラムなので、上下に満たし、素材を端からはみ出させ、プラットフォームの安全ゾーンを維持します（キャプションとボタンは下部約20%と右端を覆います）。stills.py --width 1080 --height 1920 はシート内でアスペクト比を維持します。ネストされたポータルダイブとその数値を含む方法：references/vertical.md、ケース cases/huazhong-dongtian-22s/。

3 · リズムとキャリーの両方としてのストーリーボード

選択したコンセプトをビートシートとして書きます：t · ビート · 動くもの · 静止しているもの · 次のビートにキャリーされるもの。

リズム。 ショットの長さを4倍以上変えます（0.25秒の言葉の隣に2.5秒のホールド）。映像と音声の両方で、少なくとも1つのほぼ無音のストレッチ。1つのストーリー — コンセプトのもの — カタログではありません。要素のサイズと背景はリファレンスに従います（§1）。

アークと時計。 ビートシートの前に音楽を選び、そのダウンビート、無音のギャップ、ドロップを見つけ（scripts/beat_grid.py）、シート内のすべての t をそのトラックのビートとして書き込みます。映像のピークはドロップに配置します。

キャリー。 すべてのセクション境界で、それを生き残り動き続けるものを名付けます：手、被写体、次のシーンになるコンテナ（morphRect）、被写体から開くステージ（iris）、カード内に押し込んでシーンにするカメラ（zoomThrough）

、ロックアップに折り畳まれるキャスト（gather → seal）。何も生き残らない場合、それはリズムに関係なくスライドチェンジです。裸のカットは、コンセプトにそれらがある場合、ヒットのバーストとエンドカードに属します。references/rhythm.md。

4 · 実際のものからのフッテージ — またはスクリーンショットから再構築したUI

python3 scripts/record_footage.py footage.json --out footage/

実際のページ、Playwrightによってリアルタイムで駆動（壁時計ペースのスイープ、ホイールステップ、クリック）、表示するサイズで録画され、入力が開始された瞬間にマゼンタマーカーが注入されるため、アクションフレームを後で見つけられます。フレームは30fpsのJPEGとして出力されます。ポインターパスは保存されるため、コンポジションは手を再描画できます — 視聴者は結果だけでなく原因を見る必要があります。設定形式はスクリプトのdocstringにあります。

または再構築します。 フィルムがアプリの機能をウォークスルーする場合（そして何よりも音声や他の言語がある場合）、ユーザーはリファレンステイクのみをスクリーンショットまたは録画し、UIはリファレンスの独自のピクセルフレームでHTMLに再構築されます。すべての文字列はテーブルに格納され、すべての状態は純粋な set(state) によって書き込まれ、レプリカはカメラが任意のズームで近づくことができる平面上に配置されます。ハイライトはそのDOMから測定されます（lib/ui_kit.js）。ナレーションは scripts/vo_tools.py から取得します：オーディション、セリフ、ワードタイム、字幕。第2言語は同じコンポジションの ?lang= で、そのVOは UIK.timeWarp ノットによって同じ意味の単語で作成されたタイムラインにマッピングされ、ソース言語とピクセル同一であることが scripts/frame_diff.py でチェックされます。コンテンツは製品の実際の出力のままです。方法、数値、詳細：references/product-demo.md。これはテクニックであり、ルックではありません。パレット、ステージ、カメラ文法、トランジションは、毎回§2で新たに選択されます。

5 · コンポーズ — 1つのファイル、時間の純粋関数、ライブラリからのムーブ

mkdir -p cases/my-film && cp templates/comp.html lib/motion.js cases/my-film/   # テンプレートは motion.js → window.OM を読み込む
python3 scripts/probe.py my-film/comp.html        # エンドツーエンドで再生できるようになったらすぐに：各境界をキャリーするもの、各ムーブのカーブ

動くもののスピードカーブ上の6フレームを見て、gallery/sheets/<move>.png からムーブを選びます。ライブラリには39のムーブがあります：エントランス、キャリー、コンタクト＆ライブシミュレーション、カメラとその投影ヘルパー、流体セット（ライトフィールド、リップル、シルク、ベルト、SwiftUIスプリング）。それぞれは、DOM変換またはキャンバス呼び出しの数値を返す時間の関数です。固定定数でスプリングやイーズを再導出してはいけません。テンプレートはmotion-webフィルム（動的言葉、タイプされたプロンプト、チクチクするチェックリスト、フライスルー、ライブシミュレーション、ホールド、スタッカートヒット、すべてのシミュレーションが読み取る1つの連続したハンドパス）です。そのビートをコピーするのは、§2でそのコンセプトが選ばれた場合のみです。それ以外の場合は、そのコントラクトとヘルパーを保持し、コンセプト独自のビートを書き込みます。すべては f(t) です。シミュレーションは240Hzでプリシミュレーションされ、サンプリングされます。プレビュー ?play、ピン ?t=6.4&hud。references/motion-library.md、references/composition.md。

ルックはコンポジションとともに出荷されます。 python3 scripts/look.py apply ember cases/my-film/comp.html（または look.json）は、その隣に look.js を書き込みます。8色をCSS変数および LOOK.color として、コンポジションが設定するグリフにサブセット化されインライン化された3つのOFLフェイスを、file:// レンダリングで実際のタイポグラフィを取得できるようにします。コンポジションのスクリプトの前にロードし、var(--ink) / var(--display) または LOOK.font('display', 96) に対して書き込み、LOOK.ready で window.__ready をチェーンします。コピー変更後に再実行します。フェイスに欠けている文字を特定します（中国語/日本語/韓国語用 --cjk <font>）。

カメラ：キーフレーム設定だが、操作されているように。 OM.camera(t, keys) は、各ビートが必要とする場所にカメラを配置します。オペレーターの感触は、キーがどのように配置されるかによって生まれます。被写体を追うために sineInOut で約0.1秒先行してキーを打ち、スナップの前に着地点を expoInOut でキーを打ってホイップし、手（ゆっくりとした2つのサインのフロート、ホールドではゼロ）と OM.shake をすべての着地に追加します。OM.lattice を遠くに薄く描画します。そうしないと、空の背景では動きが読み取れません。カメラがある場合、__track はスクリーンボックス（OM.projectBox）を返し、__motion は移動量をrender.pyに渡し、__meta.inFrame はフレームから決して外れてはならないものを指定します。コード付きの方法：references/composition.md → カメラ。

6 · レンダリング — 承認後まで1080p30ドラフト、4K60のみ

python3 scripts/stills.py comp.html --times 0.7,2.4,3.8,6.2,9.9,12.7 --out stills.png   # レンダリング前に確認
python3 scripts/render.py comp.html --out draft.mp4 --sfx sfx.wav            # 1920×1080 · 30 fps · 180°シャッター
python3 scripts/render.py comp.html --out film.mp4 --final --sfx sfx.wav     # 3840×2160 · 60 fps、カットが承認されたら

シャッターは実際のモーションブラーです。各移動フレームは、開いたシャッター間で複数回シークし、線形光で平均化されます。ホールドは検出されスキップされます。キャプチャはChromeのスクリーンショットです（約150ミリ秒。ページ自体は1ミリ秒未満で描画）。そのためrender.pyは--workersブラウザを並列プロセスで実行します（デフォルトはコア数−2、最大8）。--final はシャッターを4K60でサンプリングします。references/render.md。

7 · オラクル — 人間が見る前に、カットがリズムを持ち、持続するかどうかを知る

python3 scripts/oracle.py draft.mp4 --ref ref.mp4 --out verdict.txt

オラクルは2つのことを測定します：isochrony（カットは音楽グリッドに乗っているか？）とcarry（各カットポイントで、何かが生き残るか？）。静止と静けさをリファレンスに対して判定します。両方の値が1.00に近い場合、カットはおそらく良いです。そうでない場合は、オラクルはどこを見直すべきかを教えてくれます。references/oracle.md。

8 · レビュー — 人間の目で確認

python3 scripts/frame_diff.py draft.mp4 ref.mp4 --out diff/  # フレームごとの差分
python3 scripts/diff_stills.py ref.mp4 draft.mp4 --out diff_stills.png  # キーフレーム比較

画面上でレビューします。側面比較、タイムコード付き。修正が必要な箇所をリストアップします。

9 · エクスポートと納品

python3 scripts/export.py film.mp4 --platform xiaohongshu  # 1. サムネイル 2. オーバーレイキャプション 3. 安全ゾーン
python3 scripts/watermark.py film.mp4 --text