scroll-world について
scroll-worldは、スクロール位置で事前レンダリング済みのカメラ動画チェーンを操作するランディングページを作るスキルです。シーン設計、動画生成、フレームを一致させた接続、単体のVanilla JavaScriptエンジンの組み込みを案内します。
主な機能
- 01シーンとカメラの移動経路の設計
- 02静止画とダイブ動画クリップの生成
- 03フレームを一致させたクリップ接続
- 04スクロール位置に応じた動画チェーン再生
- 05単体のVanilla JavaScriptエンジンの組み込み
- 06任意でネイティブ9:16のモバイル用チェーンを作成
活用シーン
- 01スクロールで商品シーンを巡るランディングページの制作
- 02複数セクションを通る連続カメラ移動の構築
- 03プレーンなHTMLやフレームワークのページへのスクロール連動動画の追加
- 04スマートフォン向けに独立して構図した縦長体験の制作
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ oso95/ scroll-world --skill scroll-worldインストール後、Claude Code で/scroll-worldを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/index-template.htmlknockout.pypipeline.mdprompts.mdscrub-engine.js詳細
scroll-world
スクロールでカメラを動かすランディングページを生成します。カメラはシーンの外側から内部へ入り込み、その後、飛び出して次のシーンへと連続的に進み、目に見えるカットはありません。ビジュアルは AI で生成します。静止画は Higgsfield(または Codex)、動画の連鎖はデフォルトで **Monid(クリップごとの従量課金 Seedance 2.0。フォールバックは Higgsfield クレジット)**を使います。ページではスクロール位置に応じて、事前にレンダリングした動画をスクラブするだけです。これは Apple のスクロール連動型製品ページで使われているのと同じ手法です。カメラは実際に移動し、スクロールは時間を進めるだけです。
生成するもの: N 枚のシーン静止画 → N 本の「ダイブイン」カメラクリップ → 隣り合うシーンをシームレスにつなぐ N-1 本の「コネクター」クリップ → 連鎖全体をひとつのフライトとして再生する、持ち運び可能なスクラブエンジン。
成否を分けるルールはひとつ: 継ぎ目はフレーム単位で同一でなければなりません。コネクターを生成する前に、シームレスな連鎖を読んでください。ここを間違えるのが最もよくある失敗で、シーン間に目立つ「ポップ」が生じます。
フロントエンドのフレームワークを前提にしないでください。references/scrub-engine.js のスクラブエンジンは自己完結型のバニラ JS です(独自の DOM を構築し、指定されたコンテナーに独自の CSS を挿入するため)。そのため、プレーンな HTML、Next.js、Vue、Python で配信するページなど、何にでも組み込めます。このスキルの価値は Higgsfield のパイプライン、プロンプト、継ぎ目の手法にあり、フレームワークにはありません。
Step 0 — 初期設定
- Monid CLI — デフォルトの動画連鎖バックエンド。
monid --version、monid keys list(有効なキー)、monid balanceを確認します。連鎖はクリップごとに USD で課金されます(料金は Step 1.7 を参照。1080p の N=6 の連鎖で約 $27)。CLI がない場合や、残高が連鎖の費用に足りない場合は、その旨を伝え、代わりに Higgsfield クレジットで連鎖をレンダリングします。モデルとパイプラインは同じで、課金元だけが異なります(Step 4 → Monid バックエンド)。 - Higgsfield CLI — Monid を使う場合も必須です。 シーン静止画(
gpt_image_2)をレンダリングするほか、kling3_0の NSFW フォールバックとフォールバック用の連鎖にも使います。higgsfieldが$PATHにない場合は、higgsfield-generateスキルの手順に従ってインストールします。higgsfield workspace listで認証エラーが起きた場合は、ユーザーにhiggsfield auth loginを実行してもらいます(対話型 OAuth のため、こちらからは実行できません)。必要に応じてhiggsfield workspace set <id>も実行してもらいます。静止画の生成(約 N 回の画像生成)に必要なクレジットがあることを確認します。連鎖がここにフォールバックする場合は、さらに(2N-1)回分の動画生成クレジットも必要です。 $PATHに ffmpeg / ffprobe があること(フレームの抽出とエンコードに使います)。- 背景を除去する画像ツール(シーンを浮かせたい場合)。PIL(
python3 -c "import PIL")、またはcwebp/sipsを使います。任意です。Step 3 を参照してください。 - (任意)Codex CLI —
codexが$PATHにあり(≥ 0.125)、codex login statusで ChatGPT にログイン済みと報告される場合は、Higgsfield クレジットではなくユーザーの ChatGPT サブスクリプションを使って、Codex 組み込みのimage_gen(同じ gpt-image-2 モデル)でシーン静止画を生成できます。Step 1.7 で選択肢として案内し、コマンドは Step 2 を参照してください。利用できない場合は、この選択肢がなくなるだけです。 - 注意事項:macOS に付属する bash 3.2 では
declare -Aを使えません。スクリプトで連想配列を使わないでください。Higgsfield の生成には1 件あたり 3~8 分かかるため、必ずバックグラウンドで実行してポーリングし、フォアグラウンドで完了を待つ呼び出しはしないでください。メディアフラグではジョブ UUID による参照は拒否されます。--image/--start-image/--end-imageにはローカルファイルのパスを渡してください。動画モデルによって、受け付けるパラメーター(例:Kling は--resolution非対応)や、開始画像/終了画像による条件付けに対応するかどうかが異なります。まとめて生成する前に、higgsfield model get <job_type>で選択したモデルのスキーマを確認し、Step 4 のモデル一覧を参照してください。
Step 1 — ユーザーへのヒアリング
主題はユーザー自身が決めるものです。通常の文章で、自由回答形式の質問として尋ねてください。選択肢をでっち上げてはいけません。業界のリストを勝手に作ると、ユーザーの回答を誘導し、ユーザーのビジネスを代わりに決めているように受け取られます。ユーザー自身の言葉で回答してもらいましょう(実際のビジネス、クライアントのビジネス、またはアイデアのいずれでも構いません)。構造化された複数選択式(Claude Code では AskUserQuestion、それ以外では通常の二択質問)は、以下のような、選択肢を実際に列挙できる重要度の低い項目、つまりアートディレクション、カメラスタイル、ブランドキットの方針に限って使います。その場合も、自分のやり方で回答してよいこと(「その他」)を伝えてください。合理的に初期値を設定できないことだけを尋ねます。以下を網羅してください:
- 主題(選択式ではなく、オープンに尋ねます) — 「この世界は何をテーマにしますか?あなたのビジネス、クライアントのビジネス、あるいはどんなアイデアでも構いません — 単語一つでも一文でも大丈夫です。」業界・製品 + 一行のピッチ(例:「タピオカティー企業、茶葉から最後の一口まで」)を捕捉し、ブランド名があればそれも記録します。なければ、後述の手順であなたが提案します。
- ブランドキット — 3 つの方法を提示し、1 つを選びます:
- URL からインポート:
higgsfield marketing-studio brand-kits fetch --url <site> --wait(名前、カラー、トーンを取得)。その後brand-kits list --jsonで読み戻します。 - ユーザーがパレット + 名前 + トーンを直接渡す。
- あなたがパレット + 名前を提案し、承認してもらう。 4〜6 個の名前付き hex 値、表示名、トーンを表す単語を 1〜2 個捕捉します。
- URL からインポート:
- アートディレクション — デフォルトは「ソフトマットなローポリ クレイジオラマ、アイソメトリック、チルトシフトのミニチュア、暖かい光」。代替案も提示します(フラットなペーパークラフト、光沢のあるおもちゃ、クレイメーション、ネオンの夜)。選ばれたものは共有の スタイルプリアンブル となり、すべてのシーンプロンプトでそのまま再利用されます(これが世界の統一感を生みます)。
- カメラスタイル — 必ず尋ねてください。これは技術的な細部ではなく、映像の人格です。 感覚で尋ね(Claude Code では
AskUserQuestion、それ以外では普通の質問)、回答をCAMERAとして記録します。選択肢はステップ 4 のアーキテクチャに対応します — ステップ 4 はその選択を実装するだけで、再決定はしません:- 「世界を飛び抜ける」 — カメラが各シーンに飛び込み、上昇して外へ抜け、ミニチュアの世界を飛び越えて次へ移動します。アングルは絶えず変わり、大きく表現豊かな空撮的モーション(これがフラッグシップデモの見た目です)。→ アーキテクチャ B。ジオラマ/ミニチュアのアートディレクションのデフォルトとして推奨します。
- 「一続きのウォークスルー」 — 各シーンを滑るように通り抜け、そのまま次へと進む単一の前進飛行で、決して引き返しません。表現豊かでありながら常に前進するシーンごとのモーション(カメラ文法表)。→ アーキテクチャ A。グラウンデッド/フォトリアルなアートディレクションのデフォルトとして推奨します。
- 「ロックされたアイソメトリックの滑走」 — カメラは映像全体を通して 1 つの固定アングルを保ちます。Emons スタイルで、世界がカメラの横を/カメラに向かって滑っていき、回転もなく、見せる演出もありません。→ アーキテクチャ A + すべてのレッグプロンプトに locked-iso 条項(prompts.md)。 トレードオフをそれぞれ一行で述べます(B は継ぎ目で方向が反転します — ミニチュアでは魅力的ですが、リアリズムでは違和感があります。locked-iso は最も穏やかで、再ロールが最も安価です。ウォークスルーはその中間です)。
- 旅(セクション) — カメラが飛び抜けていく順序付けられたシーン。主題自身のバリューチェーンから導き出したセットを提案し、ユーザーに編集してもらいます。5〜7 個がうまく機能します。タピオカの例: 農場 → パールキッチン → 旗艦店 → 配送 → コミュニティ広場 → ヒーロー製品。各セクションには以下が必要です: 短い主題の説明(ジオラマの中に何があるか)、アイブロウ、ヘッドライン、一行の本文、0〜3 個のタグピル。最後のセクションは通常、ヒーロー製品 + CTA です。
- モバイル版 — 必ず尋ねてください。決して無言で両方を生成しないこと。 2 択の選択肢として尋ねます(Claude Code では
AskUserQuestion、それ以外では普通の質問): 「モバイル最適化版も必要ですか?モバイル版は 9:16 縦型 でネイティブにレンダリングされる第 2 のカメラチェーンです — ランドスケープ映像のクロップではなく、スマートフォン向けに構成されます — これにより Higgsfield のクレジット消費はおよそ 2 倍になります(推定額を提示してください)。」 選択肢: 「デスクトップのみ」/「デスクトップ + モバイル(ネイティブ 9:16 — 約 2 倍のクレジット)」。クレジットコストは示唆するだけでなく、ユーザーに明示する必要があります。 回答が左右するもの:- はい → 並行する 9:16 縦型チェーンをレンダリングし、モバイルバリアントとして出荷します(ステップ 6 / pipeline.md §6b): 縦型の開始キャンバス → 9:16 のダイブ + それぞれ自身のレンダリングに対してフレームロックされたコネクター → 幅 720 の
-m.mp4エンコード →stillMobile縦型ポスター。clipMobile/connectorsMobile/stillMobileを配線し(ステップ 7)、完全なモバイル QA を実行します(ステップ 8)。追加で約 2N-1 回の動画生成 + NSFW 再ロールを見込みます。 デフォルトでセンタークロップをモバイル版として出荷しないでください — クレジットが縦型チェーンを賄えない場合は、その旨を伝え、ユーザーが承認しなければならない明示的にラベル付けされた暫定措置としてクロップエンコード(pipeline.md §6)を提示してください。 - いいえ → モバイルのエンコードと配線を完全にスキップします。エンジンのスマートフォン向け堅牢化(シークの合流、iOS のプライミング、セーフエリア CSS)は常に有効です — それは「モバイル版」ではなく、スマートフォンが訪問したときにページが壊れないようにするだけのことです — したがってデスクトップのみのビルドでも graceful に劣化します。
- はい → 並行する 9:16 縦型チェーンをレンダリングし、モバイルバリアントとして出荷します(ステップ 6 / pipeline.md §6b): 縦型の開始キャンバス → 9:16 のダイブ + それぞれ自身のレンダリングに対してフレームロックされたコネクター → 幅 720 の
- 予算 — コスト別に提示するエンジンは、何かをレンダリングする前に決定します。 レンダリング
ティア(
AskUserQuestion)を提示し、次にユーザーの N シーンに対する見積もり合計を計算して明示します —N 枚のスチル + (2N−1) 本の動画 [モバイルの場合は動画 ×2] + 約15% の リロール余裕— そして生成前に承認を得ます。-
動画ティア(名簿のみ — すべてのオプションがシームをフレームロックします。ステップ 4):
ティア モデル おおよそのコスト ドラフト / プリビズ seedance_2_0_mini(720p)Standard の約 ¼ Standard(デフォルト) seedance_2_0(1080p)ベースライン 代替 kling3_0(720p ネイティブ)≈ Standard、異なるルック + コンテンツフィルター ドラフトはプリビズ経路を兼ねます。チェーン全体を安く実行し、 行程を承認し、最終レッグを Standard で再レンダリングします(pipeline.md の Notes)— 残高が 厳しいと読めるときは、促されなくても提案してください。
-
バックエンド — Monid がチェーンのデフォルトの請求先です(ステップ 0.1、配線は pipeline.md → Monid バックエンド)。同じ Seedance 2.0、クレジットではなく クリップ単位の USD。トークン価格は
width × height × 24 × seconds / 1024で $7/1M (480p/720p)または $7.7/1M(1080p)— 実測: 1080p 8 秒のダイブ ≈ $2.99、5 秒の コネクター ≈ $1.87、720p ≈ $1.21 / $0.76、480p ≈ $0.28 / $0.35。N=6 の デスクトップチェーンは 1080p で ≈ $27 / 720p で ~$11 に対し、Higgsfield Plus 月額 ≈ $32 / $16 — クリップあたり約 15% 安く、Plus 年額とは同等、構造的に 単発ビルドに有利(従量課金、月次の失効なし)。Monid では ドラフト/プリビズティアは単に 480p の同じエンドポイント です — モデル交換がなく、 そのためプリビズ→最終は構造上単一モデルのままです。見積もりに対してmonid balanceを明示します。 ユーザーがサブスクリプションを好む場合、残高が不足している場合、または モデルがkling3_0(Higgsfield 専用)でなければならない場合は、Higgsfield クレジットにフォールバックします(上記の モデル別ティア)。根底にあるモデルは同じ(seedance_2_0≙ Monid のseedance-2.0)なので、 行き詰まったチェーンを他方の請求先で完了させるのは妥当な救済です — ただし 配信スタックは異なり、プロバイダー間のシームの特性は 未検証 です。他のシームを 救済する前に、まず最初の救済シームを目視確認してください。モデル交換と同様です。 -
スチルのソース(Codex CLI が存在する場合のみ提示、ステップ 0.5): Higgsfield
gpt_image_2(クレジットを消費)vs Codeximage_gen— 同じ gpt-image-2 モデルを ChatGPT サブスクリプションに請求(クレジットゼロ、Codex の使用制限に カウント、1536×1024 出力 — ちょうど 3:2、Higgsfield の 2k よりわずかに小さい)。スチルは--start-imageに渡される単なる PNG なので、動画チェーンはそのソースに 影響されません。コマンドはステップ 2 にあります。1 つのビルドの N 枚のスチルすべてに 1 つのソース — 両者はわずかに異なる特性でレンダリングされ(検証済み: Codex はより暖かく/明るく レンダリング)、シーンをまたいでソースを混在させるとスタイルのドリフトとして読めます。動画チェーンが 1 つのモデルを使うのと同じ理由です。 -
コストを推測せず、校正してください。 CLI は価格を公開しておらず、プランも異なります。 まずスチルを 1 枚、動画を 1 本実行し、
higgsfield workspace listを前後で 差分し、フル実行に外挿し、見積もりが 残高の約 70% を超える場合は常にユーザーに警告します。(plus プラン、2026-07 に観測: Standard 動画 ≈ 40–55 クレジット、スチル ≈ 15。)実行中の実際のnot_enough_creditsは 回復可能です(完了したクリップは残り、チャージ後に再開)が醜いです — このステップの 要点は、ユーザーが支出の前に決定することです。
-
ユーザーが名簿外の動画モデルを指定した場合、シームをフレームロックできる場合に限り それに従います(ステップ 4)。このスキルはシームレスな出力のみを提供するため、フレームロック できないモデルは、一行の理由とともに辞退し、代わりに差し替えることはしません — 代わりに名簿の モデルを使用してください。
スクロールの仕組みを固定のままにしてください(連続フライスルー)— それがこのスキルの要点です。
インテークチェックリストとコピー構成については references/prompts.md を参照してください。
ステップ 2 — シーンの静止画を生成する
セクションごとに画像を 1 枚生成します。統一感を出すため、すべて同じスタイルの前置き文を使ってください。デフォルトのモデルは gpt_image_2 です(鮮明で、アイソメトリックなイラストの生成に優れています。背景は単色または白で返されるため、浮かぶジオラマの「島」に最適です)。ブリーフでキャラクターやカートゥーンが中心となる場合に限り、nano_banana_2 を使ってください(注:nano_banana_2 は CLI のエイリアスで、nano_banana_pro に解決されます。higgsfield model list ではその名前で表示されません)。
プロンプトの形式(完全なテンプレートは references/prompts.md を参照):
<STYLE PREAMBLE, identical every time>. On a plain solid <bg> background with a soft
contact shadow. <PALETTE hexes>. No text, no letters, no logos, centered, 3:2.
Subject: <what is in THIS diorama>.
-
N 件すべてを並行して、デタッチモードで実行します。シーンごとのコマンド:
higgsfield generate create gpt_image_2 --prompt "$(cat scene_i.txt)" --aspect_ratio 3:2 --resolution 2k --quality high --wait --wait-timeout 15m --json > scene_i.json 2>scene_i.err -
結果 URL は、
--wait --jsonの出力にある.[]0.result_urlです。curlでダウンロードします。 -
Codex の静止画生成を使う場合(ステップ 1.7 で選択した場合 — サブスクリプション料金に含まれ、クレジット消費ゼロ):同じプロンプトファイルと、バイト単位で同一の前置き文を使い、Codex 組み込みの
image_genで生成します。codex exec -C "$WORK" -s workspace-write --skip-git-repo-check \ 'Use the image generation tool ($imagegen) to generate: '"$(cat "$WORK/still_i.txt")"' Wide 3:2 landscape, high resolution. Save it as ./still_i.png. Do not do anything else.' \ < /dev/null$imagegenの部分はシングルクォートで囲みます(シェルによる展開を防ぐため)。参照画像を使って編集する場合、プロンプトは-iフラグより前に指定します(可変個の引数を取るためです)。 画像 1 枚あたり約 1~3 分かかります。すべての N 件を一度にではなく、数件ずつ並行して実行してください。また、< /dev/nullはそのまま付けてください。スクリプト内で複数のcodex exec呼び出しが同じ標準入力を共有すると、入力待ちでハングします(注意点)。 出力は 1536×1024(3:2)です。--start-imageやポスターには十分です。以降の作業(統一感のレビュー、背景の透過、ダイブ)に変更はありません。 -
生成に一時的な失敗(HTTP 503)が起きることがあります。その場合は該当する 1 件だけを再生成してください。バッチ全体を再実行しないでください。
-
続行する前に静止画を確認してください。 すべてが統一感のある世界として見える必要があります(同じアングル、配色、光)。スタイルが合わないものは再生成し、必要に応じて承認済みのシーンを
--imageとして渡してスタイルを固定してください。
バッチスクリプトの詳細は references/pipeline.md を参照してください。
ステップ 3 —(任意)シーンを浮かせる
ジオラマを単色のボックス内に置くのではなく、雰囲気のある背景の上に浮かべたい場合は、references/knockout.py で平坦な背景を透明にします(境界につながる領域を塗りつぶすため、背景色と一致する内側の色(クリーム色の壁など)は保持されます)。その後、webp にエンコードします。もっと簡単に済ませたい場合は、ページの背景色をシーンの背景色と同じにして、この手順を省略してください。
これらの静止画は、動画のポスターと遅延読み込み時のフォールバック画像も兼ねるため、残しておいてください。
ステップ 4 — カメラの構成(ステップ 1.4 で選んだ内容を実装)
シーン間でカメラをどう動かすかが、品質を左右する最大の要素です。ユーザーはインタビュー時にスタイル(CAMERA、ステップ 1.4)をすでに選択しています。fly-through → B、walkthrough → A、locked-iso → A + locked-iso の区間に関する節(prompts.md)です。インタビューで聞き漏らしていた場合は、今すぐ確認してください。ユーザーに代わって黙って選んではいけません。2 つの形式と、それらに色を添える文法は次のとおりです。
動画モデル — チェーン全体で1つだけ選択してください
このスキルが出力するのはシームレスな映像のみなので、シームをフレームロックできるモデルだけが使用できます。チェーン内のすべてのクリップが --start-image を受け付ける必要があり、コネクターには --end-image も必要です。この機能が選択基準であり、好みは基準ではありません。higgsfield model get <job_type> で各モデルを確認し、メディア入力が参照専用のモデルは除外してください(開始画像/終了画像なし)。そのモデルでできるのは生成の条件付けだけで、ショットの継続はできないため、物理的にシームを維持できません。以下のスキーマは CLI で確認済みです。
| モデル | 開始/終了画像 | 備考 |
|---|---|---|
seedance_2_0(デフォルト) | ✓ / ✓ | チェーン全体に対応(レッグ+コネクター)。--mode std --resolution 1080p。NSFW フィルターは特に厳しめです(「注意点」を参照)。 |
kling3_0 | ✓ / ✓ | チェーン全体に対応 — テスト済み:開始画像+終了画像を指定した --mode std --sound off --duration 5 が受け付けられ、シームはきれいにフレームロックされます。--resolution パラメーターはありません(指定しないでください。--mode std ではネイティブの 720p が返されます — ffprobe が報告する値でエンコードし、アップスケールはしないでください)。サウンドはデフォルトでオンです → --sound off を指定してください。--duration のデフォルトは5です。レッグでは10を試してください。Seedance とは異なるコンテンツフィルターを使用しており、承認済みの NSFW フォールバックです。 |
seedance_2_0_mini | ✓ / ✓ | フレームロックを維持する低コストのドラフト向けモデル(720p)。プレビジュアライゼーション用モデルです。まずここでチェーン全体を実行し、その後、最終版のレッグをフルモデルで再レンダリングしてください — シームレスさは保たれるため、そのまま移行できます。 |
この3つが候補モデルです — いずれも両方のアーキテクチャーに対応しています。(kling3_0_turbo も --start-image でフレームロックできますが、--end-image がないためアーキテクチャーA専用で、コネクターは作成できません。また、フラグの構成が異なり、--mode はなく --resolution があるため、そのままではパイプラインに組み込めません。デフォルト候補には含まれません。アーキテクチャーAの逐次レンダリング時間が実証済みのボトルネックであり、実際に高速であることをベンチマークで確認した場合に限り、手動で接続して使用してください。)
アーキテクチャーA専用の候補がもう1つあります。把握しておく価値があるのは、試行コストが群を抜いて安いためです。minimax_hailuo(Hailuo-2.3。768p/6秒のクリップあたり約6クレジット、候補モデルは22~72クレジット)。2026-07に検証済み:--start-image とプロンプトの指定でフレームロックされ(出力のフレーム0 ≡ 入力、PSNR 33 dB)、前方への滑走を促すプロンプトにも控えめながら従いました。制約事項:2.3バリアントは end_image を拒否するため、コネクターには対応せずアーキテクチャーA専用です。出力のアスペクト比は入力画像に従います(3:2の静止画をそのまま渡さず、16:9のキャンバスを渡してください)。モーションは seedance より控えめです。また、--resolution は指定しないでください(CLI が列挙型を誤って型付けします。デフォルトの768で動作します — 1080は6秒のみ対応)。クリップ1本だけではチェーンを組めません。フルビルドで使用する前に、レッグ間の受け渡しを検証してください。
ルール:
- チェーン内のすべてのクリップで同じモデルを使ってください。 レンダラーごとにモーション/色/粒子の特性が異なります。チェーンの途中でモデルを混在させても位置の連続性(フレームの受け渡し自体)は維持されますが、レンダリング特性の変化が微妙なポップとして感じられます。唯一承認されている例外は、1つの難しいクリップに対する NSFW フォールバックです(「注意点」を参照)。5秒のコネクター1つで特性が少し変わるほうが、コネクターが欠けるより優れています。
- デフォルトは
seedance_2_0とし、デフォルトでは Monid 経由でレンダリングします(クリップごとの USD — 次のセクション)。Higgsfield クレジットは代替の課金手段として使用します(ステップ 0.1/1.6)。ユーザーの希望は、指定されたモデルがフレームロックに対応している場合に限って尊重してください。対応していない場合はその旨を伝え、対応モデルを使用してください。モデルの指定に応えるために、シームレスでないビルドを出荷してはいけません。kling3_0とseedance_2_0_miniは Higgsfield 側でのみ利用できます。 - パイプラインスクリプトではモデルを
$VMODELとして指定し、モデルごとのフラグはすでに設定されています(references/pipeline.md)。
Monid バックエンド — デフォルトのチェーン課金元(2026-07-25 に適格性確認済み)
Monid の bytedance /v1/video/seedance-2.0 は、2026-07-25 に有料プローブを両方通過し、このスキルでチェーンをレンダリングするデフォルトの方法です。両方のアーキテクチャで使用します。ロスターの seedance_2_0 は従量課金で提供されます(pipeline.md →「Monid backend」で配線されています。Higgsfield は、フォールバックの課金元として、または Higgsfield 専用モデルでのみチェーンをレンダリングします)。
- レッグプローブ(プロンプト +
first_frame画像):出力フレーム 0 ≡ 入力静止画(PSNR 31.6 dB)。前進するグライドのプロンプトに従い、告知されていた料金区分で課金されました(480p 4s で $0.279)。 - コネクタープローブ(プロンプト +
first_frame+last_frame):開始フレームは固定(31.6 dB)。終了フレームは近い位置に着地しますが、ピクセル単位では完全一致しません(27.5 dB、構図は同じですが、小道具レベルでずれます)。これは Seedance が Higgsfield で示すのと同じ終了画像の挙動で、エンジンのシームクロスフェードと、次のダイブの実際の最初のフレームを終了画像として使う方法(Step 5 のルール。変更なし)でカバーされます。
I/O 契約は Higgsfield CLI と異なり、ルールは 3 つです。
- 画像は URL で渡し、インラインでは渡しません。
contentアイテムは{"type":"image_url","image_url":{"url":…},"role":"first_frame"|"last_frame"}です。base64 データ URL は拒否されます("Must be a public https:// URL or an asset:// reference")。ローカルフレームは Monid の無料ワークスペースファイルシステムを経由します。sfs /put→curl -Tでバイト列を転送 →sfs /catで本文に貼り付ける署名付き公開 URL を取得します($0。この用途向けに明示的に構築されています)。 ratioを明示的に渡します(16:9、モバイルチェーンでは9:16)。適応型のデフォルトは、代わりに入力画像のアスペクト比に従います。- クリップごとに課金額を確認します。料金はトークン単位です($7–7.7/1M で
w × h × 24 × sec / 1024)。各実行のcost.valueを読み取ってください。
このルールの背景となった経緯(2026-07-25 時点でも有効):seedance のエンドポイントは 2026 年 7 月下旬までテキストから動画への生成専用でした。ビルドのたびに再度 inspect してください。カタログは変更されることがあります。 minimax /v1/video_generation(Hailuo-2.3)は引き続き不適格です。prompt と first_frame_image を同時に送ると、画像が黙って破棄されます(無関係な t2v 出力になり、誤った料金区分になります)。画像のみならフレーム固定(33 dB)できますが、カメラ制御はできません。
新規または変更された Monid エンドポイントの適格性確認プロトコル(各プローブは低コストの 480p クリップ 1 本):(1) 実際の静止画を使い、プロンプト + 最初のフレームを指定します。フレーム 0 はコーデックノイズの範囲内で入力と一致する必要があります(PSNR ≳ 30 dB)。また、cost.value は告知されている料金区分と一致する必要があります。(2) コネクター用途では、別の静止画を使った last_frame を追加します。終了フレームはその構図に着地する必要があります(Seedance 形式のわずかなずれは許容され、クロスフェードでカバーできます)。合格した場合は従量課金の階層を使用します(開始フレームのみならアーキテクチャ A、開始フレームと終了フレームの両方ならロスター全体)。
A) 前方へ進み続けるワンカット — 地に足の着いた、リアルな、またはウォークスルー向けに推奨
最初のシーンから最後のシーンまで、前方にしか進まないカメラのワンカットです。レッグを順番に生成します。レッグ 0 はシーン 0 の静止画から開始し(その中へ前方にグライドします)。以降の各レッグでは、--start-image に前のレッグの実際の最後のフレーム(ffmpeg で抽出)を指定し、プロンプトには "continue gliding smoothly FORWARD into [scene i], never pulling back"(または、以下の Camera grammar を参照し、モーションハンドオフ契約に沿った表現力のあるレッグ途中の動き)を指定します。--end-image は指定しません。広い導入ショットの終了画像を指定するとカメラが後退を強いられ、これがカクつきの最大の原因になるためです。各レッグの最後のフレームを抽出し、次のレッグに渡します。その結果、すべてのシームでフレームが完全に一致し、カメラが決して逆行しません。コネクターはありません(Step 5 はスキップ)。レッグ自体が旅路です。各レッグを connectors: [] と短い crossfade(約 0.08)を使ったセクションクリップとして配線します。--end-image を指定しなくても、プロンプトが内容を誘導するため、レッグはそれぞれ異なる部屋に到達します。コスト:厳密に順次処理(並列化不可)で、時間がかかります。屋内のシーンは NSFW フィルターに抵触するため、再生成を組み込みます(レッグごとに 3 回試行)。
B)潜り込み+空撮コネクター — ジオラマ/ミニチュア/神の視点の世界にのみ使用
各シーンに「潜り込む」クリップと、上昇して離れ、次のシーンへ飛んでいくコネクター(ステップ 5)を組み合わせます。引き上げでは、継ぎ目ごとにカメラの向きが反転します(前方への潜り込み → 後方への引き上げ)。ミニチュア/ジオラマの世界では、「地図までズームアウトして、次の島へ飛ぶ」という意図的な演出として伝わります。一方、現実に即した一人称視点のウォークスルーでは、不自然な巻き戻し/カクつきに見えます。B は地図のような美学にのみ使用してください。「世界を飛び回る」というインタビュー回答がまさに選んでいる方向性であり、この場合は反転も意図的な演出として伝わります。ユーザーが現実に即した/フォトリアルな方向性に対して B を選んだ場合は、カクつきに見える理由を伝え、レンダリング前に確認してください。
カメラの文法 — 動きはコンセプトに合わせる(A は「前進のみ」ではありません)
「前進のみ」は継ぎ目のルールであり、区間のルールではありません。連鎖における物理法則は次のとおりです。
- 継ぎ目での位置の連続性は、フレームの受け渡しによって保たれます(次の区間は、前の区間の実際の最終フレームから開始します)。
- 継ぎ目での速度の連続性を保つには、カメラが継ぎ目をまたいで反転してはなりません。反転すると、巻き戻しのようなカクつきが生じます。
- 1 つの区間内では、カメラは自由に動かせます。 1 つの区間は連続した 1 回のレンダリングであり、途中で途切れる継ぎ目がないため、旋回、クレーンアップ、横方向のトラッキング、いったん近づいてからゆっくり離れる動きも、すべてクリップ内であれば安全です。反転が致命的なのは、継ぎ目をまたぐ場合のみです。
そのため、モーション受け渡し契約に従い、シーン独自のロジックに合わせて表現力のある動きを各区間に設定します。各区間は、次の目的地に向かうゆっくりとした安定した前進ドリフトに落ち着いて終わり(最後の約 1 秒)、各区間は同じドリフトを続ける形で始めます。この 2 つの条件は、プロンプトにそのまま記載してください(テンプレートは references/prompts.md にあります)。
コンセプトに合わせてカメラの文法を選んでください。
| コンセプト/トーン | 区間内の動き |
|---|---|
| 製品/高級小売 | 主役となるオブジェクトの周りをゆっくり半周し、そのまま通り過ぎる |
| 不動産/ホスピタリティ | 出入り口を通り抜けるステディカムの移動。アトリウムでは穏やかにクレーンアップ |
| 産業/工程/物流 | ラインに沿った低い位置での横方向のトラッキングと、手前のオブジェクトによる視差 |
| 旅行/アウトドア/キャンパス | ドローン風に上昇して視界を開き、その後、下降しながら旋回する |
| 食品/クラフト/ディテール重視 | 制作の瞬間に近づき、ゆっくり離れてから進み続ける |
| 遊び心のあるミニチュア(アーキテクチャ B) | 潜り込み+空撮ホップ — コネクター自体が文法です |
正直なところ、表現力のある区間内の動きは、再生成が必要になる可能性を高めます。モデルが凝った動きを、きれいな前進ドリフトではない状態で終えることがあるためです。対策:最後の 1 秒で落ち着かせる条件を、そのまま記載してください。次の区間とつなぐ前に、各区間の最終フレームを目視で確認してください(穏やかに前進するショットのフレームに見える必要があります。そうでなければ、次の区間に時間をかける前に再生成してください)。表現力のある区間ごとに、再生成を約 1 回追加できるよう予算を見込んでください。単純な前進ドリフトは、リスクゼロの標準設定です。シーン自体が見どころとなる区間では、これを使用してください。
ロックされたアイソメトリックのバリエーション(CAMERA = ロックされたアイソメトリックな移動):アーキテクチャ A で、各区間の途中に動きを加えず、視点を固定します。「カメラは全編を通じてまったく同じ高いアイソメトリック角度を保ち、回転も、旋回も、傾きもありません。まっすぐ水平に進むだけで、同じ視点の下を世界が滑るように通り過ぎます」(prompts.md にある定型句をそのまま使用)。受け渡し契約は変わりません。Seedance は長い区間では角度がわずかにずれていくため、既存の「最終フレームを目視確認する」ルールが重要です。視点が回転した区間は再生成してください。最も落ち着いた見た目で、再生成コストが最も低く、Emons の参考例に最も近いスタイルです。
これに関連するペース配分の調整項目が 2 つ、エンジンにあります(ステップ 7):セクションごとの scroll(スクロール距離を長くすると、そのシーンでの滞在時間が長くなります)と linger(コピーの盛り上がりに合わせて、カメラがシーンの途中でぴたりと落ち着き、その後、継ぎ目に向かって速度を上げます)。クリップでは表現力のある動きを優先し、スクラブマッピングでは抑制を優先してください。両方を重ねると効果が強まります。
また、スクロールはスクラバーとして機能することも覚えておいてください。訪問者は上方向にもスクロールできるため、すべての動きは逆再生もされます。これは標準の動作で、追加作業は不要ですが、シームの速度を両方向で一貫させる必要がある理由でもあります(前方向では問題なく見えるシームも、速度が反転すると逆方向ではカクついて見えます)。
B の場合は、シーンごとにカメラ移動を 1 回行います。高い位置かつ外側から始まり、内部へ下降して、構造が開きます。モデル:上で選んだチェーンモデル(デフォルトは seedance_2_0)、--start-image = シーンの静止画。
- 単色背景の静止画(背景を透過させたものではありません)を開始画像として使用し、動画のフレーム全体を埋めます。
- プロンプト:「カットなしの、連続した 1 回のシネマティックなカメラ移動。高く離れた位置から始め、外側から 全体を見渡す……下降して内部へ飛び込み、 に向かう……屋根や壁がゆっくり開き、内部が見える。、滑らかで優雅なスローモーション。テキストなし。」(テンプレートは references/prompts.md にあります。)
- パラメーター(seedance):
--mode std --resolution 1080p --aspect_ratio 16:9 --duration 8。Kling の場合は--resolution(このパラメーターはありません)を外し、--sound offと--duration 10を追加します。--generate-audioは渡さないでください(seedance ではエラーになり、音声は不要です。いずれにしてもミュートします)。 - 並行して実行し、デタッチしてから、それぞれの
.result_urlをダウンロードします。個別に失敗したものは再生成します。次の手順でフレームを使うため、1080p の元データはそのまま保持してください。
ステップ 5 — コネクター(アーキテクチャ B のみ)
アーキテクチャ A では、このステップを丸ごとスキップしてください。前方向のテイクにはコネクターがなく、各レッグがすでにシームレスにつながっています。このステップは B(ジオラマ/ミニチュア)に適用されます。ステップ 4 の逆再生に関する注意点も確認してください。
コネクタークリップは、世界がカットで分断されているのではなく、つながっているように感じさせます。コネクターはシーン i の終端から飛び出し、シーン i+1 の開始点へと入ります。両端のフレームには、隣り合うクリップの実際のレンダリング済みフレームを使用する必要があります。元のジオラマ静止画は絶対に使わないでください。
理由:Higgsfield で生成するたびに、レンダリング結果はわずかに異なります。コネクターの終端が「キッチンのジオラマ」を新たにレンダリングした画像で、次のダイブクリップの開始点が同じジオラマの別のレンダリング結果だと、2 つが一致せず、シームに飛びが生じます。対策は、正確に同じピクセルを引き継ぐことです。
For each connector between dive_i and dive_{i+1}:
start-image = the LAST frame extracted from dive_i's rendered video
end-image = the FIRST frame extracted from dive_{i+1}'s rendered video
これで、すべてのシームの両側でフレームが完全に一致します。
dive_i.end == connector.start および connector.end == dive_{i+1}.start。
静止画ではなく、レンダリング済みのダイブから境界フレームを抽出します。
ffmpeg -sseof -0.15 -i dive_i.mp4 -frames:v 1 -q:v 2 dive_i_last.png # interior of i
ffmpeg -ss 0 -i dive_{i+1}.mp4 -frames:v 1 -q:v 2 dive_next_first.png # establishing of i+1
コネクターを生成します(--duration 5 で十分です)。コネクターには --end-image が必要なため、モデルがこれを受け付ける必要があります。対応するモデルはいずれも使用できます(seedance_2_0、seedance_2_0_mini、kling3_0)。
higgsfield generate create "$VMODEL" \
--prompt "$(cat connector_i.txt)" \
--start-image dive_i_last.png --end-image dive_next_first.png \
$VOPTS --aspect_ratio 16:9 --duration 5 --wait --json
# seedance: VOPTS="--mode std --resolution 1080p"; kling3_0: VOPTS="--mode std --sound off"
コネクターのプロンプト:「カットなしの、連続した 1 回のカメラ移動。 から上昇して後退し、空へと上がり、つながったミニチュアの世界を滑らかに横切って、<scene i+1> の上空に到達し、そこへ向かって下降し始める。シームレスで流れるような空中遷移。。テキストなし。」(テンプレートは references/prompts.md にあります。)
念のため:Seedance の終端は --end-image に近い状態になりますが、ピクセル単位で完全に一致するとは限りません。そのため、エンジンは各シームに短いクロスフェード(数フレーム)を適用します。フレームを一致させた両端に短いクロスフェードを加えれば、目に見えるカットはなくなります。実際のフレームを引き継ぐ手順を省略して、クロスフェードだけに頼るのは絶対に避けてください。大きな内容の飛びはクロスフェードでは隠せません。
ステップ 6 — スムーズにスクラブできるようにエンコードする
スクラブとは、スクロールに応じて video.currentTime を設定することです。重要な点は 2 つあり、誤解されがちです。
- スクラブを可能にするのは、キーフレームの密度ではなくシーク可能性です。 多くの静的ホスト(および
python -m http.server)は HTTP バイト範囲リクエストを処理しないため、video.seekableが[0,0]に固定され、あらゆるシークがフレーム 0 に制限されます。その結果、動画がフリーズしたように見えます。確実な解決策は、各クリップをBlobとして取得し、メモリ内のオブジェクト URL から再生することです(Blob は常に完全にシーク可能です)。エンジンはこの方法を使用します。そのため、オールイントラ動画は必要ありません。 - スムーズにシークするために、画質を落とさないでください。 ネイティブ解像度(Seedance の 1080p。ダウンスケールしない)で、
crf ~20、オールイントラではなく小さい GOP(-g 8)でエンコードします(オールイントラでは 8 秒のクリップが約 25 MB になりますが、GOP 8 なら約 8 MB で、Blob 経由ならスムーズにスクラブできます)。音声を削除し、faststart を追加します。また、軽いunsharpで動画のぼやけを補います。
ffmpeg -i src.mp4 -an -vf "unsharp=5:5:0.8:5:5:0.0" \
-c:v libx264 -preset slow -crf 20 -pix_fmt yuv420p \
-g 8 -keyint_min 8 -sc_threshold 0 -movflags +faststart out.mp4
画質を均一にするため、2N-1 個すべてのクリップ(ダイブとコネクター)を同じ設定でエンコードします。
モバイル用エンコード(ステップ 1.6 でユーザーが選択した場合のみ)。 モバイル版はネイティブの 9:16 縦長チェーン(pipeline.md §6b)です。すべてのダイブとコネクターを縦長でレンダリングし、幅 720(scale=720:-2)、-g 4(キーフレームが多いほどシークの負荷が下がります。スマートフォンのデコーダーでは、シークの負荷は GOP の長さに応じて増加します)、crf 23 でエンコードします。これらを clipMobile / connectorsMobile として接続し、各縦長ダイブの最初のフレームをセクションの stillMobile ポスターとして抽出します(ステップ 7)。エンジンはスマートフォンではこれらを自動的に使用し、存在しない場合はデスクトップ用クリップにフォールバックします。16:9 のセンタークロップを使う encm() エンコード(pipeline.md §6)は、縦長チェーンをクレジットで用意できない場合のフォールバックのみです。これを出荷する場合は、必ずユーザーに明示してください。黙って行ってはいけません。デスクトップ専用を選択した場合は、これはスキップしてください。それでもエンジンはシークの集約や iOS のプライミングなど、スマートフォンでのスクラブを堅牢に処理するため、ページが壊れるのではなく、機能が段階的に低下します。
ステップ 7 — ページを組み立てる
references/scrub-engine.js(ページを完全に単独で動作させたい場合は、小さな
references/index-template.htmlも)をユーザーのプロジェクトにコピーするか、使用している
フレームワークに合わせて調整します。設定駆動型で、自己完結しています。
mountScrollWorld(document.getElementById('world'), {
brand: { name: 'Pearl & Co.' },
diveScroll: 1.3, connScroll: 0.9, // viewport-heights of scroll per clip
sections: [
{ id:'farm', label:'The Farms', still:'assets/farm.webp',
clip:'assets/vid/farm.mp4',
clipMobile:'assets/vid/farm-m.mp4', // mobile opt-in only: native 9:16 render
stillMobile:'assets/farm-m.webp', // its first frame as the portrait poster
scroll: 1.6, linger: 0.45, // optional pacing: longer dwell + camera settles mid-scene
accent:'#8FB98A', eyebrow:'From leaf to last sip', title:'It starts in the hills.',
body:'…', tags:['Single-origin','Hand-picked'] },
// …one per section; last may carry a `cta`
],
connectors: ['assets/vid/conn1.mp4','assets/vid/conn2.mp4', /* … length = sections-1 */],
connectorsMobile: ['assets/vid/conn1-m.mp4','assets/vid/conn2-m.mp4' /* … same length; mobile opt-in only */],
});
エンジンは、順序付けされたダイブ/コネクターチェーン、スクロールからcurrentTimeへの変換とrAFによる平滑化、ブロブの読み込み、近くのクリップの遅延プリフェッチ、フレームを同期させたクロスフェード、セクションごとに固定されたコピー(最初のセクションはページ表示時に挨拶し、最後のセクションはCTAを表示し続けます)、ルートレール、prefers-reduced-motion、モバイルに対応します。セクションごとのペース調整: scrollはそのシーンのdiveScrollを上書きします(スクロール量が多いほど滞在時間が長くなります)。また、linger(0~1、0.6以下にしてください)は時間を再マッピングするため、カメラはシーンの途中で落ち着きます。つまり、コピーがピークを迎える間にカメラが止まり、その後、つなぎ目に向けて速度が上がります。つなぎ目のフレームは変更されません(f(0)=0、f(1)=1)。ヒーローとフィナーレのシーンには大きめのscrollといくらかのlingerを設定し、移動シーンはテンポよく保ちます。CSS変数(--accent、--sw-bg、--sw-ink、…)でテーマを設定します。ビジュアルアイデンティティは生成されたクリップによって決まるため、周辺のUIは控えめにします。設定とCSS変数の詳細は、scrub-engine.jsのヘッダーを参照してください。
スマートフォンではエンジンが自動的に適応します(粗いポインターまたは幅860px以下):clipMobile/connectorsMobileがある場合はそれらを使用し、シークをまとめます(デコーダーがシーク中に新しいcurrentTimeをキューに追加しません。これにより、すばやいフリックでクリップがフリーズするのを防ぎます)。クリップの最初のフレームが描画されるまで、静止画をポスターとして表示し、最初のタッチ時に各動画を準備します(iOSで再生されるまで動画が空白になる問題を修正します)。漂うパーティクルを取り除き、URLバーだけのリサイズを無視して(スクロール位置がジャンプしないようにします)、セーフエリアのインセットを使用してコピーがノッチ/ホームインジケーターに重ならないようにします。これらの最適化はすべてデフォルトで有効です。設定は必要ありません。clipMobile/connectorsMobileのエンコードはオプトイン項目です(ステップ1.6)。モバイル版をユーザーが求めた場合にのみ設定してください。
JS以外のバックエンド(Python/Railsなど)では、アセットを配信して、レンダリングされたHTMLにエンジンの<script>を追加します。特定のフレームワークには依存しません。
ステップ 8 — 継ぎ目の QA(省略しないでください)
ヘッドレスブラウザーでページを操作し、継ぎ目でフレームが連続していることを確認します。ここが最も問題になりやすい箇所です。
- 各継ぎ目の直前と直後のスクロール位置でスクリーンショットを撮影します。2つのフレームはほぼ同一でなければなりません(ダイブの最後のフレーム == コネクターの最初のフレーム)。映像が跳ねる場合は、実際にレンダリングされたフレームではなくジオラマの静止画を使っています(ステップ 5 をやり直してください)。または、クロスフェードの帯が短すぎます。調整の目安:継ぎ目は生の PSNR ではなく、構図で判断してください。720p/1080p では、正しくフレームが固定された継ぎ目でも、細部のちらつきだけで約 18〜25 dB になることがあります(正常であることを確認済みのビルドで観測)。実際の不一致では、単に映像がぼやけるのではなく、構図や小道具が異なって見えます。
- コンソールにエラーがないことを確認し、
video.seekable.end(0) > 0(blob が機能していること)、および各クリップの帯全体でcurrentTimeがスクロールに追従することを確認します。 - モバイル — ユーザーがモバイル版を選択した場合(ステップ 1.6)のみ、チェックリスト全体を実施します。 デスクトップ専用ビルドでは、スマートフォンのビューポートで一度だけ簡単に確認します。ページが読み込まれ、静止画のポスターが表示され、要素が重ならないことを確認してください。エンジンの堅牢化により、適切に劣化するようになっています。モバイル版の場合は、実機またはエミュレーターで縦向きと横向きの両方を確認します。
- CPU を 4〜6 倍にスロットルしたスマートフォンのビューポートをエミュレートし、高速スクロールします。クリップがフリーズせずに追従する必要があります(シークの集約と
-m.mp4エンコードによって実現しています)。 - 最初のシーンがすぐに表示されること(静止画がポスターとして表示されること)、およびスクロールした瞬間に動画へ切り替わることを確認します。空白や黒画面が表示されてはいけません(iOS のプライミング修正)。特に iOS Safari でテストしてください。この問題が再発すると、画面が空白になるのはこのブラウザーです。
- モバイルでは
-m.mp4バリアントが実際に配信され(Network パネル)、デスクトップでは重い 1080p マスターが配信されることを確認します。モバイルクリップはネイティブの縦向き(videoWidth < videoHeight。16:9 ファイルを縮小したものではありません)である必要があります。また、stillMobileポスターが配信され、各縦向きクリップの最初のフレームと一致することを確認します(動画の描画時に横向きから縦向きへ切り替わって見えてはいけません)。 - URL バーが折りたたまれるまでゆっくりスクロールします。ページが跳ねてはいけません(タッチ操作では高さのみのリサイズは無視されます)。デバイスを回転させ、レイアウトがきれいに組み替わることを確認します。
- クロップのフォールバックを採用した場合(縦向きの素材チェーンにクレジットを割けなかった場合)のみ:縦向き表示では 16:9 クリップの中央がクロップされます。焦点となる被写体がきちんと見えることを確認し、これは暫定策であり、モバイル版ではないことをユーザーに伝えます。
- CPU を 4〜6 倍にスロットルしたスマートフォンのビューポートをエミュレートし、高速スクロールします。クリップがフリーズせずに追従する必要があります(シークの集約と
- 動きを減らす設定を確認します(静止画にフォールバックし、動画もパーティクルも表示されないこと)。
注意点(経験から得た重要な知見)
- 継ぎ目のポップ → コネクターの端点に、隣接するクリップの実際のフレームではなく、ジオラマの静止画を使っていました。必ず実際のフレームを抽出してください(ステップ 5)。
- 継ぎ目のカクつき/カメラが「後ろに跳ねる」 → フレームを合わせた継ぎ目でも、カメラの速度が反転する(前方に突っ込んだ後、引き戻すコネクターが続く)と、巻き戻しのように見えます。これはアーキテクチャ B に固有の問題です。地に足のついたウォークスルーには、必ずアーキテクチャ A を使ってください(実際の最終フレームからつないだ、前方へ進み続ける 1 本のテイク。引き戻しなし、
--end-imageなし)。ステップ 4 を参照してください。 - 動画が停止する/フレーム 0 で止まる →
seekable=[0,0]です。ホストがバイト範囲を提供していません。Blob URL を使ってください(エンジンが対応しています)。 - ファイルサイズが大きすぎる → 全フレームをキーフレームとしてエンコードしています。代わりに
-g 8と Blob を使ってください。 - ぼやける/画質が低い → 縮小したか、圧縮しすぎています。ネイティブ 1080p でエンコードし、crf ≤ 20 にして、
unsharpを追加してください。動画は静止画より本質的にぼやけます。忠実度を最大限に高めるには、静止画を軽量版のフォールバックとして残してください。 - 同時生成時の 503/「not_enough_credits」の競合 → 多数の生成を一斉に開始したときに一時的に発生します。失敗したものだけ再生成してください。実際にクレジットが不足しているわけではありません(
higgsfield workspace listで確認してください)。 - NSFW の誤検出(Seedance の
status "nsfw") → 動画のコンテンツフィルターが、まったく問題のないクリップを誤検出します。特に寝室、プール、スパ/ウェルネスの状況や、「bed」「pool」「waterfall」「wine」「swim」などのトリガーワードが原因になりやすいです。プロンプトの表現と参照フレームの両方が関係しています。次の順に対処してください。(1)再生成する。結果は確定的ではないことが多く、2〜3 回目で通ることがあります。(2)トリガーワードを削除し、「empty, unoccupied, no people, no figures, architectural, tasteful」を追加する。(3)同じ開始/終了フレームで、そのクリップだけをkling3_0で再生成する。別プロバイダーのフィルターなら Seedance がブロックするものを通せることがあります。そのクリップだけレンダリングの質感が少し変わることを見込んでください(モデルごとに粒状感や動きの質感が異なります)。クロスフェードの背後に置く 5 秒のコネクターなら、通常は選択肢(4)よりこちらが優れています。選択肢(4)ではコネクタースロットをnullにします。エンジンはその継ぎ目を直接クロスフェードするため(コネクターは省略可能)、ページの生成は完了します。インテリアや不動産関連のコンテンツでは、こうした再生成に備えて追加のクレジットと時間を確保してください。 - ダークテーマ/カスタムテーマ → エンジンはデフォルトのトークンを
@layer swで囲んでいるため、ページレベルの:root/.sw-root { --sw-bg; --sw-ink; --sw-accent; --sw-font-* }ブロックがそのまま優先されます(詳細度を調整するハックは不要です)。--sw-inkは主要なテキスト/見出しの色です。アクセントは主要ボタンとアクティブなナビゲーションの塗りに使われます。ダークテーマでは--sw-bgを暗く、--sw-inkを明るく設定してください。コピーのスクラムとタイトルの影は、--sw-bgに合わせて自動的に調整されます。 - スマートフォンでシークするとカクつく/素早くフリックすると停止する → 1080p のマスター動画はスマートフォンのデコーダーには重すぎるため、シークが滞留しています。
-m.mp4のモバイル用エンコード(720p、-g 4)を配信し、clipMobile/connectorsMobileを設定してください(ステップ 6/7)。エンジンはすでにシークをまとめて処理しています。軽量なエンコードも同様に重要です。性能の低いデバイスでもカクつく場合は、GOP を短くしてください(-g 2/全フレームをキーフレームとしてエンコード)。 - iOS でシーンが空白/黒になる(デスクトップでは正常) → iOS Safari の仕様による問題です。一度も再生されていないミュート動画では、シーク先のフレームが描画されません。エンジンは、クリップが描画されるまで静止画をポスターとして表示し、最初のタッチ時に各動画を再生できる状態にすることで対処しています。したがって、エンジンをフレームワークに組み込む場合は、
loadedmetadataで静止画を非表示にしたり、playsinline/muted属性を削除したりしないでください。 - モバイルでスクロール中にページが跳ねる → URL バーの表示/非表示による
resizeで、何かがレイアウトを再計算しています。エンジンはタッチ操作中の高さだけのリサイズを無視します。移植した場合は、幅が変わったときだけリサイズハンドラーを実行するようにしてください(画面回転にはorientationchangeの処理を残してください)。 - モバイルでコピーが URL バー/ノッチの背後に隠れる → エンジンのセーフエリア対応の下部オフセット(
env(safe-area-inset-bottom)+dvh)を使ってください。ページの<meta viewport>にviewport-fit=coverが含まれていることを確認してください(テンプレートには設定済みです)。 - 縦向きだとシーンが切り取られる → 縦長のスマートフォンで 16:9 のクリップを表示すると、中央部分しか見えません。これが、モバイル版にはクロップではなくネイティブ 9:16 のチェーン(§6b)を使う理由です。モバイルビルドでこれが発生する場合は、クロップのフォールバックが配信されている(その旨をユーザーに伝えてください)か、9:16 のエンコードが実際には配信されていません(
videoWidth < videoHeightを確認してください)。各シーンの主要な被写体を中央に配置すること(prompts.md)は、デスクトップ版の映像でも重要です。 - seedance で
--generate-audioがエラーになる → 省略してください。HTML でミュートし、エンコード時に-anを指定してください。 - Kling がフラグを拒否する →
kling3_0に--resolutionパラメーターはありません(指定せず、ffprobe が報告するネイティブ解像度のままエンコードしてください)。また、サウンドはデフォルトでオンです。--sound offを指定してください。デフォルトの長さは 5 秒です。レッグ/ダイブには 10 秒を使ってください。 - 「クレジットを節約した」部分だけ継ぎ目でポップが発生する → チェーンの途中でモデルを切り替えたか、コネクターに
--end-imageが必要なのに、開始画像しか使えないモデルを使用しています。チェーン全体で 1 つのモデルを使ってください。唯一の低価格帯はseedance_2_0_miniで、フレームロックを維持するため継ぎ目が滑らかになります。参照画像だけを入力とするモデルでは、継ぎ目を維持できません(ステップ 4)。 - Monid seedance がインライン画像を拒否する → 「Must be a public https:// URL or an asset:// reference」と表示されます。フレームは無料の
sfsファイルシステム経由で渡してください(put →curl -T→ cat → 署名付き URL。pipeline.md → Monid バックエンド)。Base64 は使わないでください。注意点:/putはhome/<path>を返しますが、/catと/lsには/putに指定した元の相対パスを渡す必要があります。返されたパスを使うと 404 になります。 - Monid のクリップのアスペクト比が違う →
ratioのデフォルトは適応型で、入力画像に合わせて変わります(3:2 の静止画から 4:3 前後の動画が生成されます)。チェーン内の各クリップで--ratioを明示的に指定してください。デスクトップは16:9、モバイルのチェーンは9:16です。 - Monid CLI が「Polling timed out after 120s」と表示する → ローカルでの待機が終了しただけで、実行はサーバー側で続いています。
monid runs listで ID を確認し、monid runs get -r <runId> -w 120で再度ポーリングしてください。結果の URL は約 24〜48 時間で期限切れになるため、すぐにダウンロードしてください。 - Monid minimax でプロンプトを指定すると画像が無視される →
promptとfirst_frame_imageを同時に指定すると、無関係な t2v クリップが返され、誤った料金区分(確認された例では $0.56 ではなく $0.28 のセル)で請求されます。画像のみの場合はフレームロックされますが、カメラを制御できません。ラッパーが修正されるまでは、このエンドポイントでチェーンを作成できません。Monid の seedance-2.0 を使ってください。(モデル自体に問題はありません。同じプロンプトと画像でも、Higgsfield のminimax_hailuoならフレームロックされます。) - Monid の請求が想定外になる → マトリックス/トークン単価のエンドポイントでは、セレクターとの一致に基づいて請求されます。セレクターの各フィールド(
model、resolution、duration)をすべて明示的に指定し、各クリップの後に実行結果からcost.valueを確認してください。リクエスト本文のいずれかのフィールドに大きな Base64 データを含めると、HTML エラーページとして返されることもあります(「Unexpected token '<'」)。フレームを sfs URL 経由で渡すべき理由はここにもあります。 - 前回のビルドから Monid のスキーマが変わっている → 変更は起こります(seedance は 2026 年 7 月下旬まで t2v のみでしたが、その後、最初と最後のフレームに対応しました)。ビルドの前に
monid inspectを実行してください。Input スキーマが pipeline.md の記載と異なる場合は、ステップ 4 の適格性確認用プローブを再実行してください。 - Codex の静止画生成が「Reading additional input from stdin...」で止まる → 1 つのスクリプトから並列で起動した
codex exec呼び出しは、親プロセスの stdin を共有します。1 つが stdin を取得すると、残りは永久に停止します(確認された例:3 件中 1 件が完了し、2 件が停止、2 回目のバッチは開始されませんでした)。バックグラウンドで実行するすべてのcodex execの末尾に、必ず< /dev/nullを追加してください。パイプラインのgen_still_codexには設定済みです。コマンドを変更する場合も残してください。 - 白一色のシーン →
gpt_image_2は背景が一色の画像を返します。ページの背景色を合わせるか、背景を取り除いてください(ステップ 3)。 - macOS の bash 3.2 → スクリプトで連想配列は使えません。
- コネクターが別のシーンのフレームを取得する(または、まだ存在しないフレームでエラーになる)→ 配列ループが zsh(macOS の対話型シェルのデフォルト)で実行されました。zsh の配列は bash の 0 始まりではなく 1 始まりです。配列を使うチェーンの各ステップは、
#!/bin/bashを指定したスクリプトにまとめ、bash script.shで実行してください。対話型シェルで配列ループを直接実行しないでください。
参考資料
references/prompts.md— 受付チェックリスト、スタイル・プレアンブルのパターン、記入欄付きのすべてのプロンプトテンプレート(シーン静止画、ダイブ、コネクター)。references/pipeline.md— 全工程(生成 → フレーム抽出 → コネクター → エンコード → モバイル用エンコード)を実行する、コピー&ペースト可能なバッチスクリプト。bash-3.2 対応です。references/scrub-engine.js— 移植可能な設定駆動型のスクラブエンジン(DOM を構築し、CSS を挿入します。blob シーク、遅延読み込み、継ぎ目のクロスフェード、コピー、ルートレール、動きの低減、スマートフォン向けの強化(モバイル用エンコード、シークの集約、iOS のプライミング、セーフエリア、ジャンプのないリサイズ)に対応します)。references/index-template.html— エンジンをマウントする最小構成のスタンドアロンページ。references/knockout.py— 浮遊シーン向けに、境界に接する背景を除去します。