Communitygithub.com

動畫影片製作 (Animated Video)

透過程式碼製作動畫影片,使用 Remotion (React, SVG, three.js):解說、角色故事、動態圖形、動態文字、紙拼貼與動態資訊圖表,支援 2D 或 3D,可從腳本或旁白生成,適用於任何寬高比。當要求動畫化腳本、製作動畫影片或 Reel、或動態圖形時使用。不適用於編輯攝像機素材 (video-edit) 或 AI 生成片段 (higgsfield-*)。

動畫影片製作 (Animated Video) 是什麼?

此技能允許 AI 代理從文字腳本或旁白中生成完整、程式碼驅動的動畫影片。它利用 Remotion 框架來創建基於 React、SVG 和 three.js 的動畫,支援解釋性內容、角色驅動的故事、動態圖形以及 2D 或 3D 的動態資訊圖表。工作流程結構化為六個階段:概念與圖像發想、風格與格式設定、音訊建置、故事板、素材與鏡頭創作,以及最終審查與交付。此方法強調透過清晰的視覺敘事與旁白同步來最大化觀眾理解,而非依賴庫存素材或 AI 生成的片段。此技能還包含處理不同專案規模的指南,從簡單的單一代理運作到複雜的多幕製作,且包含修改現有影片或為其他時間線創建插入片段的路徑。最終輸出是可以在瀏覽器中渲染的 React 專案。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/CrissAlvarezH/ai-reel-gen-app/tree/HEAD/.claude/skills/animated-video

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

動畫影片

在 Reel Studio 工作區中: 首先載入 reel-studio 技能 (.claude/skills/reel-studio/SKILL.md) 和影片的風格技能 (styles/<id>/SKILL.md)。它們會覆蓋下方的預設值:風格已為每個影片選擇(不要提供其他外觀或一輪風格影格),旁白使用 ElevenLabs(音訊來自 Reel Studio → Ajustes → Voz)並搭配來自 tools/el_words.py 的時間戳記(而非 Whisper),新專案從風格的模板開始(而非 templates/remotion-film/)。圖像搜尋在整個網路上免費;Ajustes → Imágenes 僅控制選擇性的 API 整合與圖像生成。 使用此技能的方法:圖像發想、概念批准、故事板、無聲測試、審查。

將簡報轉換為完成的動畫影片,其中每個圖像都是透過程式碼生成的:程序化繪製,或從已批准的來源素材中建置並以確定性方式渲染。來自圖像或影片生成器的素材是單獨的路線(步驟 2)。如果存在,首先閱讀 ~/.animated-video/profile.md:使用者的陳述偏好優先於此處的預設值。

構成影片的要素

盡可能發揮創意。 對於影片展示的每個概念,尋找最令人驚豔但依然能讓觀眾理解的畫面。歡迎古怪、不可能、有趣或美麗的想法,每個想法都通過一個測試來評判:與字面上的畫面相比,觀眾是否更快理解機制,或記憶更久?字面上的畫面色只有在沒有更好的選擇時才勝出的備選方案。準確性驗證想法;旁白所支持的隱喻得以保留。

畫面解釋;聲音確認。 在靜音狀態下,觀眾從螢幕上發生的事情學習每個步驟:機制以因果關係呈現(切換、發送、點擊、複製),每行文字的想法透過其字詞可見,標籤輔助事件而非取代事件(動態)。

畫面蘊含問題。 腳本保持一個問題開放,並逐步回答。第一個影格提出那個問題,在旁白到達之前,沒有任何畫面、標籤或標題顯示答案:已經看到答案的觀眾有了離開的理由。

顏色引導視線。 及早決定每種顏色的意義:觀眾跟隨的物體帶有強調色,且是畫面中最亮、最飽和的,並且顏色在整部影片中保持其意義。為每個其他角色賦予自己的顏色,讓所有不承載意義的元素保持低調。為了匹配參考外觀,從其影格中取樣顏色並為動畫師提供數值:光線、霧氣和調色會將命名顏色推向灰色。

為每個簡報重新設計。 風格包、零件和過去的影片是起點。使用者喜歡的過往影片設定了完成度和節奏的標準,但絕不限制想法、裝置或外觀。

回饋縮小畫面範圍,絕不限制想像力。 當使用者拒絕一個想法時,記錄該想法錯誤之處(令人困惑、感覺牽強、看起來廉價),並尋找任何類型的更好想法。僅當使用者將其陳述為規則時,它才成為關於整個類別的規則,而你為其他代理撰寫的簡報僅攜帶使用者陳述的規則。

附帶建議提問,因此「是」就是一個完整的回覆。一開始就說明該技能在最高努力的強大模型下效果最佳。

根據作品規模調整製作

  • 簡短或簡單: 一個代理可以獨立完成,檢查靜態影格。圖像發想仍需交給新的代理,無聲測試仍需執行。
  • 較長或包含多幕: 讓一個代理負責圖像、概念和外觀,直到使用者批准,然後根據需要平行化建置。故事板固定每個節拍的想法;負責動畫的代理擁有決定如何移動的權力,並在看到更好的畫面時提出。為整部影片保留一個提示表,以確保音訊保持有意圖。長時間運行時,使用靜態影格和剩餘總時間發送狀態;讓代理使用機器時鐘在狀態行上蓋時間戳,因為自我報告的時間可能漂移數小時。
  • 已完成影片的修改: 詢問要重建哪些部分,推薦最薄弱的部分;保留其餘部分並將新部分拼接進去。
  • 為他人時間線插入片段(攝像機剪輯中的動畫鏡頭,由 video-edit 擁有):插入。當不清楚誰擁有時間線時,詢問一次。
  • 影片中出現的真人主持人: 在計劃這些鏡頭之前進行合成。

1. 尋找圖像與概念

在導演指南中選擇主軸:故事(想要某物的某人)或解說(某物如何運作、為什麼、數字的意義)。圖像來自一個新的、未見過製作規則的發想代理,由一個獨立的挑選者判斷(尋找圖像);然後是真正不同的概念、你的建議,以及被選中的概念,轉化為帶有每個節拍圖像的計時節拍表。完成的腳本確定文字,而非圖像。如果安裝了影片腳本技能,請根據其檢查清單檢查旁白。

在開始建置之前,即使是簡短的作品,也要先獲得使用者對概念及其圖像的批准。

2. 鎖定格式與風格

  • 當請求指定了格式和風格時,一行確認即可。否則,展示真正不同的風格,作為同一節拍的風格影格(風格)並讓使用者挑選;如果選中的風格有風格包,則閱讀該包。
  • 詢問路線及其成本:程式碼製作每個鏡頭免費且一致;AI 影片每個片段收費且會漂移。
  • 查找影片中出現的真實物體、地點和界面的照片。如果出現真人,詢問其素材存放位置並從中提取影格。

3. 建置音訊主幹

每個節拍都根據旁白計時(沒有旁白時,則根據先選定的音樂基底)。偏好使用者的錄音;在錄音存在之前,基於替代字詞時間戳記(已標記)進行建置。templates/remotion-film/align.py 提供字詞時間戳記和響度包絡線;使用 cue("phrase") 從字詞中導出每個提示,因此新的配音會重新計時影片。字幕是手寫的語義單元,並與轉錄稿對照檢查。音樂和音效隨首次剪輯一起提供:使用者的檔案、素材庫或磁碟上的樣本(templates/parts/audio/designed.py),任何合成的內容都需標記。

4. 骨架與故事板

複製 templates/remotion-film/,連接幕次、字幕和音訊,並在時間線上渲染靜態影格(流程)。未經驗證的事實不會出現在影片中。

在完整動畫之前向使用者展示一個關鍵影格故事板:以選定風格呈現每個節拍的靜態影格,建立在實際場景檔案中,以便成長為完成的鏡頭。已批准的靜態影格不顯示它們之間是否有任何動態;當意義存在於動態中時,一個動態故事板(在配音上以粗略形狀執行節拍)可以廉價地展示它。

5. 建置素材與鏡頭

如果已安裝素材庫,首先搜尋素材庫。重複出現的元素在故事需要的每個尺度下成立:根據角色指南繪製角色;零件包含地球儀、iMessage iPhone、設計聲音、寫實套件和用於密集 three.js 動態的動態套件。對你拿取的內容重新調整風格。

當多個代理負責動畫時,給他們一個書面的外觀和標準,取自風格包和錨定影格(參考影片每個節拍的影格,或故事板)。在每種風格中,真實物體、界面、公司或地點必須可辨識為其本身,並且替代品也需獲得同樣的關注。從繪製它的常數中導出每個幕次的聲音事件,以便移動節拍時也移動其聲音。

6. 審查與交付

代理查看影格,而非播放:透過連續影格序列檢查動態(時間性檢查)並透過測量檢查音訊,並說明哪些僅被測量。當你無法信任自己的判斷時,讓獨立的新代理進行判斷(審查);當一輪迭代收穫甚少或最重要的問題需要使用者介入時,停止迭代。

在首次完整剪輯交付使用者之前,一個新的評審對其執行無聲測試;修正無法跟隨的部分。被拒絕的完整剪輯需從圖像重新開始(重新開始)。

渲染最終版本(render.sh 會標準化響度;長影片需分段渲染)並檢查第一個影格、最後一秒和響度。報告路徑、未解決的問題、跳過的檢查、來源圖像,以及任何合成或發明的內容。每個版本都提交到專案的 git 儲存庫。如果已安裝素材庫,關閉其目錄。

應要求,按照反思協定進行反思。

Individual skills in this repo

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

CrissAlvarezH/new-style

Create a new visual style for the creator's videos in a Reel Studio workspace (styles/<id>/style.json): interview him for its name, feel, colours and what each one means, fonts, motion, where pictures come from, reference links and images, then write the style so it shows in Estilos and new videos can use it. Use when he asks for a new style or presses "Nuevo estilo" on the Estilos page.

CrissAlvarezH/persona-hablando

The "Persona hablando + animaciones" format of a Reel Studio video — the creator talks to camera in his own recording; you transcribe it, agree the cuts with him (pauses, flubs, retakes), cut it, and lay the video's style animations over or between his shots. Use for any video whose format.txt says persona-hablando.

CrissAlvarezH/reel-studio

How a narrated explainer video is made in a Reel Studio workspace, in any visual style — script, pictures, voice, images, build, board, sound, mute test, render — following the creator's settings from the studio (profile, format, voice, image sources). Use for any new or revised video in a project's videos/ (projects/<id>/videos/). The video's style adds its own skill (styles/<id>/SKILL.md) for the look and the Remotion kit; LESSONS.md has what past videos taught.

CrissAlvarezH/video-script

Write short-form video scripts that hold viewers, using the creator's own video analytics. Use when choosing the hook of a chosen idea, writing or tightening a script before filming (talking-head or narrated explainer), or turning a posted video's insights into lessons. Coming up with ideas is content-ideas'.

相關技能