remotion-render
React/Remotion コードからビデオをレンダリング
こちらからも入手できます: inference-sh-6,inference-sh-7
React/Remotion の TSX コードからプロフェッショナルなビデオをプログラムで生成。コンポーネントコードを渡して MP4 出力を取得。spring、sequence、interpolation を含むフルアニメーションをサポート。
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「remotion-render」を使用しています。 spring physics を使用したバウンシングボールアニメーションのビデオをレンダリング
期待される結果:
現実的な spring physics で紫色の背景に白いボールがバウンシングする様子を示す 60fps の 5 秒 MP4 ビデオ
「remotion-render」を使用しています。 会社のブランディングを含むアニメーションタイトルカードを作成
期待される結果:
会社のロゴがスケールインし、タグラインがフェードアップし、滑らかな背景グラデーションアニメーションを含む 3 秒のイントロビデオ
セキュリティ監査
安全All static findings are false positives. The detected 'external_commands' patterns are markdown code fences in documentation, not actual shell execution. The 'pipe to shell' pattern is the standard documented install method for the inference.sh CLI with SHA-256 checksum verification. Network URLs are legitimate service integrations (inference.sh, remotion.dev). The skill makes API calls to inference.sh to render videos - this is intended functionality.
リスク要因
🌐 ネットワークアクセス (6)
品質スコア
作れるもの
データ駆動型マーケティングビデオ
データからパーソナライズされたビデオコンテンツを生成：動的タイトル、アニメーションカウンター、製品ショーケース
開発者チュートリアルアニメーション
アニメーション構文ハイライト、コードリビルエフェクト、動的ダイアグラムを含むコードチュートリアルビデオを作成
ソーシャルメディアコンテンツ自動化
カスタムアニメーション、テキストオーバーレイ、ブランディングを備えたソーシャルプラットフォーム向けビデオ作成を自動化
これらのプロンプトを試す
暗い背景にフェードするテキスト 'Hello World' のビデオをレンダリング。30fps、3 秒の長さ、1920x1080 解像度を使用。
0 から 100% まで変化するカウンター付きのローディングアニメーションを作成。スムーズなアニメーションのために spring physics を使用し 60fps で動作。
順次フェードインする 3 つのテキスト要素を含むビデオを作成：'First'、'Second'、'Third'。それぞれ 1 秒間表示。
データ値 [{value: 30}, {value: 70}, {value: 50}] を示す棒グラフアニメーションをレンダリング。棒は 0 からそれぞれの値までアニメーション。ベストプラクティス
- より高速なレンダリングのためにアニメーションを 10 秒以内に抑える
- 手動のフレーム計算ではなく、スムーズな値の遷移のために interpolation を使用する
- 本番環境で使用する前に Remotion Studio でコードをテストする
- 値をハードコーディングするのではなく、動的コンテンツのために props を渡す
回避
- 追加ライブラリを必要とする複雑な 3D 変換は避ける
- コード内に大きな base64 画像を埋め込まない - 代わりに外部 URL を使用する
- 非常に長いビデオ（>60 秒）を 1 回のパスでレンダリングしない