這篇文章我會來分享我是怎麼透過 AI 做出這部影片的

或者是

以我的 Syndoc 宣傳片為例，這支影片完全由 AI 輔助開發，我只負責下指令和審核，總計花不到 12 小時。過去，這類動畫可能需要數週時間，還得熟練動畫工具。但現在，AI 能讓我們用更少的時間達到及格品質。

當然，AI 不是萬能——對於極複雜場景或極高品質需求，專業工具如 After Effects 仍提供更好掌控。本文會分享我的完整工作流，包括提示詞範例，讓你能直接上手製作類似影片。為了讓流程清晰，我會按步驟組織內容，並附上目錄。

目錄

1. 前情提要：傳統 vs. AI 動畫製作
2. 所需工具與準備
3. 我們先從站在巨人的肩膀上開始
4. 注入靈魂，撰寫你的劇本(全文重點)
5. 實作影片（以 Remotion + Claude 為例）

前情提要

傳統 vs. AI 動畫製作

傳統上，這類動畫由 Motion Designer 負責，使用 After Effects、Blender、Figma + Lottie 或甚至 PPT。這些工具強大，但學習曲線陡峭，且有局限（如 After Effects 不易程式化）。

AI 的優勢在於加速：它能處理重複任務，讓你專注創意。以我的經驗，AI 適合快速原型；如果你已是 Motion Designer，AI 能如虎添翼。但記住，AI 生成的結果需人類審核，以確保細節完美。

所需工具與準備

• AI 平台：AIStudio、Claude Code （這兩個工具都需要）
• 開發環境：Node.js。

Remotion Skill

Remotion 是一個允許你透過寫 React 程式碼快速建立影片的框架

• 其理念是，與其使用影片編輯軟體，不如寫 Code 來產生影片。

而他們最近發布了一個可以讓 Claude Code 可以理解並自主使用的 Agent Skill。
本次教學會使用 Remotion Skill

我們先從站在巨人的肩膀上開始

第一步：選一個好的範例影片

創新從模仿開始。
先找喜歡的影片作為參考，避免只參考單一來源——多看幾支，借鑒節奏與結構。

推薦參考來源

• Remotion Gallery：https://www.remotion.dev/prompts
• Manu AI 影片：https://www.youtube.com/@Manus-AI
• Linear 宣傳片：https://www.youtube.com/@linear
• Anthropic 影片：https://www.youtube.com/@anthropic-ai

以 Manu 的一支宣傳片為例，我喜歡它的節奏與互動感。

第二步：“觀察”他是怎麼做的

我們要進行「拆解」。 這在過去是最麻煩的步驟：你需要一幀一幀去觀察滑鼠怎麼動、按鈕何時變色、貝茲曲線是快還是慢...

第 0 秒，你第一眼看到中間有一個「Manus Skill」以及一個 Toggle，左下角出現一個滑鼠，並且向 Toggle 移動，去觀察滑鼠的移動軌跡、角度

第 1 秒，滑鼠剛好移動 Toggle 上，然後點擊...

但現在，我們有 Gemini 3 Pro
讓我來展示我的工作流

1. 首先打開 AIStudio，選擇 Gemini 3 Pro 這個模型

2. 直接貼上我這邊快速設計的分鏡提示詞

請分析影片中的每一個變化，將其拆解為以「Stage (功能階段)」為單位的動態指令表。

# 規則
1.  時間單位：嚴格使用「秒.毫秒」格式 (例如: `1.05s`)，而非傳統影片時碼。
    * `00:10` 代表 0.1 秒，而非 10 秒。
    * 所有時間必須是相對精確的估算值。
2.  微互動分析：不要只寫「移動」，要分析出「貝茲曲線路徑」、「Overshoot」、「淡入淡出 」、「縮放」等屬性。
3.  補間模式 ：必須標註動態的加減速邏輯，例如：`linear`, `easeIn`, `easeOut`, `easeInOut`, `elastic`, `bounce`。
4.  結構分組：將影片依據「操作邏輯」拆分為數個 Stage。每個 Stage 必須包含一個獨立的表格。

# Output Format (Strictly Follow)

請依照以下格式輸出每一個 Stage：

### STAGE [N]：[階段名稱]（[開始時間]s – [結束時間]s）

| 時間 (Time) | 元素 (Element) | 動作 (Action) | 持續 (Duration) | 緩動 (Easing) | 備註 (Tech Specs) |
|:--- |:--- |:--- |:--- |:--- |:--- |
| **[觸發點]** | **[物件變數名]** | **[具體變化描述]** | **[長度]** | **[曲線]** | **[座標/參數/路徑細節]** |

**Example Row:**
| 0.20 | `Cursor` | 沿貝茲曲線移動至按鈕中心 | 0.50s | easeInOut | 路徑: curviness=1.2; 模擬真實滑鼠軌跡 |
| 0.70 | `Button_Primary` | 按下狀態：縮小至 0.95x | 0.10s | easeOut | transform-origin: center |

# Execution Steps
1.  觀看影片，定義出所有的功能階段。
2.  針對每個 Stage，列出所有參與的視覺元素。
3.  詳細填寫表格，對於看不清楚的數值（如具體秒數），請依據專業經驗提供最合理的「估算值」，確保開發者可以直接照著數值調整。

# Start
請依據上述規範，分析這部影片：

3. 上傳素材，直接選擇 YouTube Video

4. 填上你的 Youtube 網址，以及幀率（建議是 10 張）

一部影片大概是一秒 30 張，但是這對 LLM 是很大的負擔，所以 Google 會把這部影片壓縮成一秒十張再給 LLM，通常來說 10 張已經很足夠

5. 結果

以下是 AI 生成的結果：

STAGE 1：Intro & Toggle Interaction（00.00s – 04.00s）

核心邏輯：展示品牌 Logo 與核心開關互動，背景暗示大量數據/卡片流動。

STAGE 2：UI Dashboard Transition & Menu（04.00s – 11.00s）

核心邏輯：轉場文字帶入主介面，演示導航至選單的過程。

STAGE 3：Upload Skill Workflow（11.00s – 16.50s）

核心邏輯：演示拖曳上傳檔案的流暢互動。

... 下略 ...

注入靈魂，撰寫你的劇本

不要照抄，要借鑑節奏
每個產品都有自己的靈魂

AI 分析出的結構（Stage 1 ~ Stage 6）我會將其視作為骨架。所以現在，我們要填入自己的血肉。

首先，擬定草稿

第一步，先將你腦海裡想要的感覺先大概想過去，先想像那個畫面並且用文字記錄下來。

根據 Manus 的結構，但內容必須改編成我的故事：

在我的工作流程中，我不會改動 Manus 的 Stage，而是調整每一個 Stage 裡頭的細節。以剛才的影片為例，它分成了 Stage 1 到 Stage 6 共六個階段，我這邊以 Stage 1 為例。

Stage 1 (第 0 秒到第 4 秒)
這階段的目標是快速切入重點，讓用戶立刻知道這支影片想要傳達的意思。這跟寫貼文做行銷的邏輯一樣，基本上就是一個「Hook（鉤子）」，你需要快速擊中用戶的痛點。

為什麼我會建議大家多找一些參考影片呢？

因為在現在這個階段，我們可以去看各家影片的 Stage 1 是怎麼做的，從中挑選喜歡、而且覺得難度適中的範例，將其引導進來。

先從目標受眾開始

我寫腳本時，一定會先釐清產品的核心 TA（目標受眾）是誰。

1. 如果產品是面向企業端（B2B）：
   內容應該更加簡潔，直接闡述功能的核心價值。
2. 如果產品是面向一般客戶端（B2C）：
   且當產品很單純時，有時候可以花更多時間在特效設計甚至是品牌塑造上。

總而言之，你的目標受眾會直接決定整個產品呈現出來的感覺。

以場景（Stage）為單位來進行設計：

思考每個 Stage 應該給用戶什麼樣的想法與情感衝擊。設計整個動畫時，必須圍繞在「希望用戶產生怎樣的心理想法」這件事情上。

好比說我的 Syndoc 專案：

Stage 1（Hook）：
這通常是一個 Hook Stage，目的是用來形成共鳴。我的目標是讓用戶立刻意識到「思考很快，但寫文件卻是一件很慢的事情」。透過這種衝擊感，吸引用戶繼續往下看。

每個 Stage 都應該有各自的目標，也就是你希望用戶看完後產生什麼樣的情緒反應。特別是 Stage 1 肯定要是 Hook，不能讓用戶在前三秒都還沒看進去就直接跳轉離開。