從 React/Remotion TSX 程式碼以程式化方式產生專業影片。傳入元件程式碼,取得 MP4 輸出,並支援完整動畫功能,包括彈簧、序列和插值。
下載技能 ZIP
在 Claude 中上傳
前往 設定 → 功能 → 技能 → 上傳技能
開啟並開始使用
測試它
正在使用「remotion-render」。 Render a video with a bouncing ball animation using spring physics
預期結果:
一個 5 秒的 MP4 影片,60fps,在紫色背景上顯示一顆白色球彈跳,具有逼真的彈簧物理效果
正在使用「remotion-render」。 Create an animated title card with company branding
預期結果:
一個 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.
風險因素
品質評分
你能建構什麼
資料驅動的行銷影片
從資料產生個人化影片內容:動態標題、動畫計數器、產品展示
開發者教學動畫
建立具有動畫語法突顯、程式碼揭示效果和動態圖表的程式碼教學影片
社群媒體內容自動化
使用自訂動畫、文字疊加和品牌化自動為社群平台建立影片
試試這些提示
在深色背景上渲染帶有淡入文字「Hello World」的影片。使用 30fps、3 秒時長、1920x1080 解析度。
建立一個載入動畫,計數器從 0 跑到 100%。使用彈簧物理效果以 60fps 進行流暢動畫。
建立一個帶有三個文字元素的影片,依序淡入:「First」、「Second」、「Third」。每個出現 1 秒。
渲染一個長條圖動畫,顯示資料值 [{value: 30}, {value: 70}, {value: 50}]。長條應從 0 動畫顯示到其數值。最佳實務
- 將動畫保持在 10 秒以內以加快渲染速度
- 使用插值進行流暢的數值轉換,而非手動計算影格
- 在正式環境使用前,先在 Remotion Studio 中測試程式碼
- 傳入 props 以處理動態內容,而非將值寫死
避免
- 避免需要額外 library 的複雜 3D 轉換
- 不要在程式碼中嵌入大型 base64 圖片,請改用外部 URL
- 避免在單次執行中渲染極長的影片(超過 60 秒)