remotion-render
React Remotionコードから動画をレンダリング
也可从以下获取: inference-sh-7,tul-sh,inference-sh-8,inference-sh-6
プログラムによる動画生成は複雑であり、専門的なレンダリングインフラストラクチャが必要です。このスキルは、React Remotionコンポーネントをクラウベースのレンダリングを通じてMP4動画に変換し、開発者がレンダリングサーバーを管理することなくコードから動画を生成できるようにします。
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“remotion-render”。 フェードインテキストアニメーション付きRemotionコンポーネント、3秒間、1080p
预期结果:
- レンダリングジョブが正常に送信されました
- 進捗: 0% -> 25% -> 50% -> 75% -> 100%
- 動画URL: https://cdn.inference.sh/outputs/abc123/video.mp4
正在使用“remotion-render”。 進捗パーセンテージを表示する動的プロップ付きアニメーションカウンターコンポーネント
预期结果:
- 提供されたプロップでコンポーネントをコンパイルしました
- 60 FPSでフレーム1-180をレンダリング中
- 出力: 1080x1080 MP4、H.264コーデック、5秒間
- ダウンロードリンクは7日後に有効期限切れ
安全审计
低风险Static analysis detected 31 external command patterns and 8 network URLs, but all are FALSE POSITIVES. The skill uses the infsh CLI with proper allowed-tools constraints (Bash(infsh *)). External commands are intentional platform integration, not arbitrary execution. Network URLs point to legitimate service endpoints. Weak crypto finding triggered by SHA-256 documentation reference (SHA-256 is secure). Pipe-to-shell on line 17 is optional user-run CLI installation, not skill-executed code.
低风险问题 (1)
风险因素
⚙️ 外部命令 (31)
质量评分
你能构建什么
自動化された動画コンテンツ生成
マーケティングチームは、顧客データをプロップとしてRemotionテンプレートに渡すことで、手動編集なしで各受信者向けのカスタマイズされた動画を大規模に生成できます。
データ可視化動画
開発者は、動的なチャート、グラフ、データアニメーションを、プレゼンテーション、ソーシャルメディア、ドキュメント目的で共有可能な動画形式に変換できます。
アニメーションUIプロ���タイプ
デザインチームは、画面録画なしで、ステークホルダーレビュー、デザインドキュメント、または引き継ぎ資料用にインタラクティブなReactアニメーションを動画ファイルとしてエクスポートできます。
试试这些提示
3秒間かけてウェルカムメッセージをフェードインさせるシンプルなRemotionコンポーネントを作成し、1080p解像度で生成します。remotion-renderスキルを使用して動画を生成してください。
5秒間か���て0から100までアニメーションするパーセンテージカウンターを表示する動画を生成します。カウンターの下にローディングインジケーターを含めます。RemotionのuseCurrentFrameおよびuseVideoConfigフックを使用してください。
3つの連続するタイトルカードが次々とフェードインするRemotionコンポーネントを作成します。各カードは遷移前に2秒間表示されます。スムーズなモーションにSequenceコンポーネントとspringアニメーションを使用してください。
名前、会社、実績を含むユーザーデータプロップを受け入れるRemotionテンプレートを作成し、パーソナライズされた表彰証書アニメーションを生成します。その後、各受信者に異なるプロップ値を渡して複数の動画をレンダリングします。
最佳实践
- 異なる環境で確実なレンダリングを行うため、Remotionコンポーネントは純粋で副作用のない状態に保ってください
- 手動フレーム計算の代わりに、スムーズでプロフェッショナルなアニメーションにRemotionのinterpolateおよびspring関数を使用してください
- クラウドレンダリングに送信する前に、Remotionプレビューでコンポーネントをローカルテストして早期にエラーを検出してください
避免
- レンダリングが分離されたクラウド環境で行われるため、Remotionコンポーネント内でAPI呼び出しやネットワークリクエストを行わないでください
- RemotionはNode.jsコンテキストでレンダリングされるため、localStorageやwindowオブジェクトなどのブラウザのみのAPIを使用しないでください
- タイムアウトやプラットフォーム制限を超える可能性があるため、過度に長い動画時間または極端に高い解像度は避けてください