add-sfx

前提条件

まず、効果音を remotion.media パッケージに追加する必要があります。
その後、bun run build を使ってデプロイできます。worktree 内にいる場合は .env がないことがありますが、worktree ではないメインブランチにはあるはずです。

正となる情報は、そのリポジトリの generate.ts にあります。@remotion/sfx に追加する前に、効果音がそこに登録されている必要があります。

効果音は次の条件を満たす必要があります。

• WAV 形式
• CC0（Creative Commons 0）ライセンス
• ピークが -3dB になるように正規化されている

手順

1. remotion.media リポジトリに追加する（最初に行う必要があります）

remotion-dev/remotion.media リポジトリで、次の操作を行います。

1. WAV ファイルをリポジトリのルートに追加します
2. generate.ts の soundEffects 配列に項目を追加します。

   {
     fileName: "my-sound.wav",
     attribution:
       "Description by Author -- https://source-url -- License: Creative Commons 0",
   },
   

3. bun generate.ts を実行して、files/ にコピーし、variants.json を再生成します
4. デプロイします

2. packages/sfx/src/index.ts にエクスポートを追加する

変数名にはキャメルケースを使用します。JavaScript の予約語は避けてください（例：switch ではなく uiSwitch を使用します）。

export const mySound = 'https://remotion.media/my-sound.wav';

3. packages/docs/docs/sfx/<name>.mdx にドキュメントページを作成する

既存のページ（例：whip.mdx）の形式に従ってください。次の内容を含めます。

• image、title（キャメルケースのエクスポート名）、crumb: '@remotion/sfx' を含むフロントマター
• 次回のリリースバージョンを指定した <AvailableFrom> タグ
• <PlayButton> のインポートと使用方法
• 説明
• @remotion/media の <Audio> コンポーネントを使ったサンプルコード
• 値のセクション。URL はフェンス付きコードブロックに記載します
• 再生時間のセクション（ファイルを取得し、macOS の afinfo を使って再生時間と形式を確認します）
• クレジットのセクション。ソースへのリンクとライセンスを記載します
• 変換のセクション。URL 全体を使った文を記載します：このファイルを remotion.dev/convert で開く
• 関連する効果音へのリンクを含む「関連項目」セクション

4. サイドバーと目次に登録する

• packages/docs/sidebars.ts — @remotion/sfx カテゴリの項目に 'sfx/<name>' を追加します
• packages/docs/docs/sfx/table-of-contents.tsx — <PlayButton size={32}> を含む <TOCItem> を追加します

5. SFX の波形を再生成する

packages/remotion-media に効果音を追加し、packages/sfx/src/index.ts からエクスポートした後、ドキュメントで使われる波形サンプルを再生成します。

bun packages/docs/generate-sfx-waveforms.ts

この処理では ffmpeg を使って、エクスポートされた各効果音を約 2000 個の波形サンプルに変換し、packages/docs/components/sfx-demos/sfx-waveforms.ts を更新します。

6. skills のルールファイルを更新する

packages/skills/skills/remotion-markup/sfx.md のリストに新しい URL を追加します。

7. ビルドする

cd packages/sfx && bun run make

命名規則

ファイル名	エクスポート名
my-sound.wav	mySound
switch.wav	uiSwitch（予約語）
page-turn.wav	pageTurn

バージョン

packages/core/src/version.ts の現在のバージョンを使用します。
ドキュメントの <AvailableFrom> では、パッチバージョンを 1 つ増やします。