Communitygithub.com

AntlersSam/saas-launch-video-kit

HyperFrames コンポジション内に配置された音声をミックスする際に使用:フェードイン/フェードアウト、クロスフェード、トラックゲイン/ボリューム、ボリュームオートメーション、ダッキング、ボイスオーバーと競合するミュージックベッド(ボイスオーバーカーブ)、トラックエフェクト(EQ、コンプレッサー、リミッター、ゲート、サチュレーション、ディレイ、リバーブ、コーラス、フェイザー、ビットクラッシュ)、トラックのボリュームや任意のエフェクトパラメータに描かれたオートメーションエンベロープ、または複数のトラックを同時に扱うサブミックスバス(`<hf-audio-group>`)。BGM、SFX、ボイスオーバーの生成や取得は `/media-use`、クリップのタイミングやトラックレイアウトは `/hyperframes-core` を使用。

saas-launch-video-kit とは?

このスキルは、HyperFrames オーディオミキシングの完全なワークフローを提供します。トラックゲイン、EQ、コンプレッサー、リミッター、サチュレーション、ディレイ、リバーブなどを含むエフェクトチェイン (`data-fx-chain`)、ボリュームやエフェクトパラメータのオートメーション (`data-automation`)、そして動的なボイスオーバーカーブ (`data-fx-carve`) をサポートします。プレビューとレンダリングは同一の Web Audio グラフを使用し、プレビューで聞こえるものがそのままレンダリングされるため、調整をやり直す必要はありません。ミキシングは問題の診断から始まり、シンプトンから適切なプリセットやジョブを選択することで、効率的に問題を解決できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/AntlersSam/saas-launch-video-kit/tree/HEAD/skills/hyperframes-audio

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

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

ドキュメント

プラグインインストール: セットアップまたはフレッシュネスコマンドの前に、このスキルが HyperFrames プラグイン内にある場合は、プラグイン実行ルール に従ってください。スタンドアロンインストールの場合は、以下のアップデート手順を保持します。

HyperFrames オーディオ

ミックスとは、一連の関係性であり、プロセッサーのスタックではありません。個々に正しく聞こえる2つのトラックでも、一緒にすると聞くに堪えない場合があります。その修正は「片方を下げる」ではほぼ解決せず、何が競合しているかを見極め、それを必要とする方に与えることです。ここにあるすべてのツールは、それらの関係性の一つを表現するために存在します。

エフェクトは data-fx-chain として要素に付加され、プレビューとレンダリングは同じ Web Audio グラフを実行します。ライブコンテキストではスタジオとして、オフラインコンテキストではエンジンとして、すでに駆動しているブラウザ内で動作します。各エフェクトの実装は一つであるため、スクラブ中に聞こえるものはそのまま書き出されます。二度調整する必要はありません。

クリップタイミングは /hyperframes-core に属します。オーディオ/ビデオのトリムやソース範囲は data-start、data-duration、data-media-start を使用し、クロスフェードは異なるトラック上のクリップを重ねます。このスキルは、配置されたトラックのフェードイン/フェードアウト、クロスフェードエンベロープ、トラックゲイン/トラックボリューム、ボリュームおよびエフェクトオートメーション、ダッキング/ボイスオーバーカーブ、そしてエフェクトチェインを担当します。/media-use は、ソーシング、生成、プリプロセッシングを担当します。

定数 data-playback-rate (0.1..10) は、同じタイミング、ソースオフセット、レートを使用するオーディオ/ビデオ要素が一致する場合、ピクチャーおよびピッチ保持サウンドに対してレンダリングセーフです。スピードランプは data-automation 内の rate レーンです(docs/reference/speed-ramps 参照)。これは定数よりも優先され、プレビューとレンダリングでピッチを保持します。HyperFrames は自動的な波形同期やドリフト補正を提供しません。 コピー可能なカット/クロスフェード/リタイムレシピについては、/hyperframes-core → references/creator-editing-recipes.md を使用してください。

以下の3つの属性がすべてを保持します。オーディオ/ビデオ要素自体に、あるいは最初の2つについては <hf-audio-group> バス(「複数トラックのための1つのバス」を参照)に設定されます。

属性保持するもの
data-fx-chainエフェクト(シグナル順)
data-automationこのトラックのボリュームまたはそのエフェクトパラメータに対するエンベロープ
data-fx-carveカーブ自体の設定(再導出可能にするため)

出荷されるエフェクトファミリーは、ゲイン、EQ(ハイパス、ローパス、ピーキング、シェルビング)、コンプレッサー、リミッター、ゲート、サチュレート、ディレイ、リバーブ、コーラス、フェイザー、ビットクラッシュです。

各エフェクトの正確なJSONと、レーンが満たすべきルール:references/attributes.md 各エフェクトとそのパラメータ、範囲、単位:references/fx-registry.md 聞こえないファイルの問題を特定する方法:references/diagnosis.md プリセット、名前付きジョブ、ワンノブプロファイル、および症状から修正へのテーブル:references/presets.md — 手動でチェインを構築する前にこれを読んでください。プリセットや名前付きジョブのいずれかが、通常すでに問題を特定しているからです。

全体の仕組み

2つのオーサリングサーフェスがそれらの属性を書き込み、2つのランタイムが同じビルダーを通じてそれらを読み取ります。この共有された中間層が、プレビューがレンダリングを予測できる理由です。

flowchart TB
  voice["ボイストラック<br/>メディアファイル"]
  bed["ミュージックベッド<br/>メディアファイル"]

  subgraph AUTHOR["オーサリング — 属性を書き込む唯一のもの"]
    panel["スタジオ<br/>ボイスオーバーカーブコントロール"]
    script["scripts/carve.mjs<br/>ペアを検出、デフォルトで動的"]
    analysis["core/audioCarve.ts<br/>carveProfile · analyseCarveBands<br/>analyseCarveDuck · analyseCarveDynamics"]
    panel --> analysis
    script --> analysis
  end

  voice --> analysis
  bed --> analysis

  subgraph ATTRS["ベッド要素に書き込まれる"]
    carveAttr["data-fx-carve<br/>source · strength · dynamic"]
    chainAttr["data-fx-chain<br/>peaking xN + gain、fromCarve タグ付き"]
    autoAttr["data-automation<br/>カーブされたパラメータごとに1レーン"]
  end

  analysis --> carveAttr
  analysis --> chainAttr
  analysis --> autoAttr

  subgraph SHARED["1つの実装、両方で読み取られる"]
    build["audioFxGraph.ts · buildFxChain"]
    sched["audioFxAutomation.ts · scheduleChainAutomation"]
  end

  chainAttr --> build
  autoAttr --> sched

  build --> preview["プレビュー<br/>ライブ AudioContext<br/>attachElementFxChain"]
  sched --> preview
  build --> render["レンダリング<br/>ヘッドレスブラウザ内の OfflineAudioContext<br/>applyAudioFxChain"]
  sched --> render

  preview --> heard["スクラブ中に聞こえるもの"]
  render --> wav["処理済み WAV<br/>+ chainTailSeconds により、ミックスがテールを通過させる"]
  wav --> mix["エンジン · audioMixer<br/>音量レーンはここで PCM に焼き込まれ、グラフにはない"]
  mix --> out["レンダリングされたミックス"]

  edit["再生中に属性を編集"] -.->|MutationObserver| preview

カーブ自体の設定は再生時に読み取られることはありません。生成されたチェインとレーンが再生されます。data-fx-carve は、強度をフィルターから逆算する代わりに、既存のカーブの強度を変更できるように存在します。

カーブされたベッド内部では、シグナルは最初にディップを通過し、次にレベルマッチ、そして自分で構築したものを通ります。そのため、追加したリミッターは依然として最後の天井として機能します。

flowchart LR
  src["デコードされたベッド"] --> p1["peaking<br/>400 Hz"]
  p1 --> p2["peaking<br/>1 kHz"]
  p2 --> p3["peaking<br/>1.6 kHz"]
  p3 --> g["gain<br/>レベルマッチ"]
  g --> hand["独自のエフェクト<br/>例:リミッター"]
  hand --> dest["トラックゲイン、そして出力"]

  l1["レーン fx.n1.gain"] -.->|"そのバンドにおける<br/>ボイスのレベルの<br/>エンベロープ"| p1
  l4["レーン fx.n4.gain"] -.->|"ベッド全体が<br/>ダッキングする度合い"| g

静的カーブは、固定値とレーンが一切ない同じグラフです。

まず、何が問題かを特定する

以下のテーブルは「こもっているように聞こえる」から始まります — 誰かがすでに聞いてそう言ったことを前提としています。ファイルを渡されて「これを修正して」と言われた場合、そのような説明はなく、あなたは聞くことができないため、測定する必要があります。すべてを支配するルールが1つあります:

未知の単一ボイスの絶対スペクトルは診断できません。 フォルマントは ±10 dB、基本周波数は 85–255 Hz で、文の終わりに向かって 5–6 dB 低下します。これらはすべて単独では欠陥として読み取られますが、すべて話者に起因するものです。

したがって、比較し、同じファイル内の何かと比較します。可能であればクリーンなオリジナル、そうでなければポーズ — ギャップで聞こえるものはすべて付加的であり、ギャップのスペクトルはチャンネルであり、ボイスではありません。公開された平均スペクトルや合成されたコントロールボイスと比較しても機能しません。2人の話者はほとんどの欠陥以上の違いがあり、このガイダンスの背後にある評価での両方の誤った答えは、まさにその比較から生じました。

オリジナルがなく、使用可能な無音もない場合、静的な音色の欠陥は真に未決定です。それを伝え、適合する読み取り値を提供し、1つを選んでそれにチェインを構築することは避けてください。

コマンド、トラップ、実践的なレシピ:references/diagnosis.md。誰も説明していないファイルを診断する前にこれを読んでください。

症状から始める

バンドと種類がわかったら、オーディオの問題を名前で特定します。ほとんどの悪いオーディオはこれらのうちの1つか2つであり、それぞれに出荷済みの回答があります:

聞こえ方使用するもの
ブーンやドスンとした低音rumble-cut、または 80 Hz の highpass
こもっている、胸に響くTame Boominess ジョブ (200 Hz)
くぐもった、段ボールの向こう側Reduce Mud ジョブ (250 Hz)
言葉が聞き取りにくいAdd Clarity ジョブ (3 kHz)、またはベッドをカーブ
耳障りで疲れるSoften Harshness ジョブ (3.2 kHz)
単語によって音量差が激しいコンプレッサーの Evenness、または Even Out Levels
文と文の間に部屋のノイズroom-gate
声と音楽が競合Voiceover carve — どちらにも EQ ではない
どこでも録音されていない、ドライroom-tight または room-natural
単に「アマチュア」voice-clean(上記のうち4つを順に適用)

完全なカタログ、各プリセットの内容、バンドの語彙、意図的にカバーしていないもの(デエッシング、ノイズ除去、トーンマッチ):references/presets.md。

追加する前に減算し、フィルター後にレベルを調整し、レベル後に関係性を、関係性後にキャラクターと天井を最後に設定します。 各ステップは、次に来るものが聞く内容を変更します。ハイパス前に設定されたコンプレッサーは、ランブルの追跡に時間を費やします。

問題の名前ではなくファミリーで選ぶ

フィルター (highpass、lowpass、peaking、lowshelf、highshelf) は、トラックが占有を許可される周波数を決定します。これは2つのソースが衝突する場合の最初のツールです。衝突はバンドで発生するためです。ベッドとボイスの両方が 1~3 kHz を欲し、それをベッドから取り除くことは、全体を下げるよりもミックスに対するコストがはるかに低くなります。ボイスへのハイパスはランブルの標準的な修正です。ローパスは意図的に暗くしたりくぐもらせたりします。

ダイナミクス (gain、compressor、limiter、gate) は、トラックのレベルが時間とともにどのように振る舞うかを決定します。コンプレッションはラウドとソフトの間の距離を狭め、ソフトな部分を引き上げられるようにします。リミッターは天井です — 何かを整形するのではなく、何も通過させないことを保証します。ゲートはしきい値以下のものを除去します。これにより、フレーズ間の部屋のノイズを消音できます。gain は単純なレベルステージであり、トラックが邪魔にならないように移動する必要がある場合にオートメーションレーンが乗るものです。

非線形 (saturate、bitcrush) は波形の形状を変更し、元々なかった高調波を追加します。補正ではなく、トラックにキャラクターやグリットが必要な場合に使用します — そして、それが生成的であることを忘れないでください。薄いソースをより密度の高いものにし、クリーンにはしません。

タイム (delay、reverb、chorus、phaser) はトラックを空間に配置したり、幅を与えたりします。これらはミックスを最も簡単に台無しにするものです。テールやデチューンされたコピーは、ボイスが必要とする同じ部屋を占有するからです。何か他のものの背後に置くべきものに使用し、ウェット量は単独で適切に聞こえるよりも低く保ちます。

チェインは直列です。各エフェクトは、前のエフェクトが生成したものを処理します。したがって、補正フィルタリングは早めに、キャラクターは中間に、リミッターは最後に配置し、実際に天井として機能できるようにします。

ボイスオーバーカーブ

解決する問題。 ボイス下のミュージックベッドは、ボイスを聞き取りにくくします。反射的にベッド全体をダッキングすることです。これは機能しますが、ベッドの存在感すべてを犠牲にします。音楽はボイスオーバー全体で弱々しくなります。しかし、ボイスはスペクトル全体を必要とするわけではありません。実際に占有するいくつかのバンドだけが必要です。カーブはそれらのバンドだけを取り、ベッドは低域と高域を維持するため、ボイスがまだ聞き取りやすい間も音楽であり続けます。

それはエフェクトではなく、関係性です。 設定はベッド — 処理されるトラック — に存在し、サイドチェインコンプレッサーが行うように、聞くべきボイスを指定します。音量が小さくなるトラックを選択し、何がそれを小さくするかを選択します。ボイストラックにカーブを決して設定しないでください。 自分自身に対してカーブされたボイスは、微妙なミックス選択ではなく、バグです。

すべてのボイス、1つだけではありません。 sources はリストです。ベッドは通常、ナレーター、インタビューの回答、2人目のプレゼンターなど、シーケンス全体の下で実行されるからです。これらはベッド自身のクロックに加算されてから測定されます(mixCarveSources)。そのため、1つの分析ですべてをカバーします。バンドは存在するすべてのスピーチから取得され、エンベロープはそのいずれかが発生している場所で上昇します。ベッドが再生中に決して再生されないボイスは除外されます。ベッドをマスクすることはできません。

複数のクリップIDに対してカーブすることは誤りです。クリップをグループ化して、そのグループに対してカーブしてください。 これはヒントではなく、不変条件です。クリップを1つずつ指定することは、完全に正しくある必要があり、次の編集までしか正しくありません。後で追加された4番目のナレーションクリップはカーブの認識範囲外で再生され、ベッドは静かにその下でダッキングしません。代わりにグループを指定すると、分析時にメンバーシップが解決されるため、後でグループに追加されたクリップは sources をまったく変更せずにカバーされます。

<!-- ナレーションをグループ化し、そのグループに対してベッドをカーブ -->
<audio id="vo-intro" data-audio-group="voiceover" …></audio>
<audio id="vo-middle" data-audio-group="voiceover" …></audio>
<audio id="vo-outro" data-audio-group="voiceover" …></audio>

<audio id="music" data-fx-carve='{"enabled":true,"sources":["voiceover"],"strength":0.8}' …></audio>

グループの代わりに2つ以上のプレーンなクリップIDを指定する sources リストは、audio_carve_ungrouped_sources リントルールでキャッチされます。まだ機能しますが、クリップが追加されたときに静かに腐敗するバージョンです。

カーブグループをボイスグループに保ちます:ベッド、SFX、音楽は含めません。 sources 内のグループIDは、_現在の_すべてのメンバーに_毎回_解決されるため、指定するグループは後で取得するグループになります。つまり、書き込み時に測定されたトラックではありません。これが問題を引き起こす2つの方法です。

  • ベッドが自身のソースグループ内にある場合。 自身のコンテンツに対してボイスとして提供され、カーブされます — 「トラックをそれ自体に対してカーブしない」というルールが、後の再分析で一度だけ発生します。
  • ボイスグループ内のSFXまたは音楽クリップ。 次の分析でサイドチェインに入り、ベッドは、属性を書き込んだ実行がそれを測定したことがなくても、ウーッという音の下でダッキングを開始します。

どちらもカーブが書き込まれた時点では見えません。分析は検出したボイスを合計し、グループ解決を往復しないため、最初のパスは真に正しく、次のパスだけが間違っています。したがって、各ロールに独自のグループを与えてください — ベッドには music、ナレーションには voiceover、効果音には sfx — そして、sources で指定されたグループにはボイス以外何も含まれないようにしてください。

carve.mjs はいずれかのケースを見るとグループ形式の書き込みを拒否し、クリップIDを記録し、次のように出力します

…

[翻訳のために切り詰め]

Individual skills in this repo

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

AntlersSam/saas-launch-video-kit

Author or edit a custom HyperFrames composition when no specialized workflow fits, or when BRIEF.md sets flow: companion. Use for longer or multi-scene pieces, brand and sizzle reels, montages, static loops, static title cards, footage remixes, and freeform builds. Use motion-graphics instead for a short unnarrated motion-first unit, including an animated title. Route fresh creation through hyperframes before using this skill.

AntlersSam/saas-launch-video-kit

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.

AntlersSam/saas-launch-video-kit

Use the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes, single or batch render, publish, cloud, cloudrun, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, timeline, history, clean, docs, benchmark, telemetry, transcribe, auth, tts, and remove-background. Also use when diagnosing build or render failures. validate, inspect, and layout are deprecated aliases; use check. Covers local, HeyGen-hosted cloud, AWS Lambda, and Google Cloud Run rendering.

AntlersSam/saas-launch-video-kit

The HyperFrames composition contract — build one renderable project. Use for composition structure, the `data-*` timing attributes, `class="clip"`, tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.

関連スキル