想把一句話變成一條能播放的動效短片，很多人會先去找視頻模型。社區裏叫「Claude Motion」的玩法走的是另一條路：讓 Claude Opus 5.5 寫一段網頁代碼，由瀏覽器把動畫畫出來，你再把畫面錄成視頻。
這不是幾分鐘必成的魔法，也不要求你會寫代碼。 本文全程使用網頁和控制檯這類圖形界面。每一步都會先說明你會看到什麼，再說明點什麼、貼什麼，最後給出一句驗收標準。
開始之前，先確認一下預期：
- 目標：做出第一條能在瀏覽器裏自動播放的動效，並把它錄成一段視頻。
- 耗時：第一次大概需要半小時到一小時。時間主要花在拿密鑰、接上模型和第一輪修改上。
- 要先準備：一臺能上網的電腦、一個瀏覽器、一個能填寫自定義密鑰的聊天客戶端，以及一個能調用 Opus 5.5 的密鑰。Opus 5.5 已經可以在 API易 apiyi.com 上通過 claude-opus-5-5 這個模型 ID 調用。
- 難度：入門。會複製粘貼、會新建文件、會改文件名就夠了。
核心價值：讀完本文，你能照着步驟做出第一條動效，知道哪些提示詞可以直接套用，也知道之後去哪裏長期使用 Opus 5.5。
Claude Motion 核心要點
- 它是什麼：「Claude Motion」是社區裏的叫法，不是 Anthropic 官方單獨發佈的視頻產品。具體做法是讓 Opus 5.5 用代碼畫動畫。
- 和視頻模型的區別：它不生成畫面像素，所以改字、改數字很方便，但做不出真人臉和實拍畫面。
- 倉庫給的用法只有三步：複製提示詞，貼給 Opus 5.5，讓它渲染成 HTML。需要視頻的話，再把頁面錄下來。
- 現成素材：awesome-opus5-5-videos 倉庫收錄了 703 條作品，其中中文提示詞約 115 條。
- 第一條練手作：melvynx 的「15 秒作品集」句式，把尖括號裏的內容換成你自己的網址或產品名就能用。
- 去哪裏用：在 APIYI 調用 claude-opus-5-5，一個密鑰即可使用，按 token 計費。
本文的事實只來自三類來源：倉庫原文（README 與 data/videos.json，數據截至 2026-10-20，不是本文實測）、截圖上看得見的數字、APIYI 文檔寫明的價格。三類來源裏都沒有的數字，本文不寫。
什麼是 Claude Motion：Opus 5.5 寫代碼，瀏覽器畫動畫
「Claude Motion」是社區口語，指讓 Claude Opus 5.5 用 HTML、Canvas、SVG、Three.js 等代碼把動畫畫出來，再錄成視頻。收錄這類作品的倉庫在 README 裏寫得很直接：“Every video here was made by asking Claude Opus 5.5 to write the animation as code （HTML， Canvas， SVG， Three.js and friends）.”
因此，它和 Sora、Veo、Seedance 這類視頻模型不是一回事。視頻模型直接生成畫面像素，Claude Motion 生成的是一個「會動的網頁」。畫面裏的每個字、每個數字都寫在代碼裏，想改哪裏，就讓模型改哪裏。
| 對比項 | Claude Motion（代碼動效） | 視頻模型（Sora、Veo、Seedance 這類） |
|---|---|---|
| 畫面怎麼來 | Opus 5.5 寫代碼，瀏覽器實時繪製 | 模型直接生成畫面像素 |
| 擅長內容 | 文字、圖表、圖形、產品介紹、知識解說 | 真人、實拍質感、電影鏡頭 |
| 改一個字 | 讓它改代碼裏的那一句，其餘部分不變 | 往往需要重新生成，畫面也會跟着變 |
| 直接得到 | 一個 HTML 文件，錄屏後纔是視頻 | 視頻文件 |
| 需要的模型 | 會寫代碼的大模型，比如 claude-opus-5-5 | 專門的視頻生成模型 |
| 做不到的事 | 真人臉、實拍街景、電影鏡頭 | 字字精確、需要反覆修改的文案和圖表 |
什麼時候用 Claude Motion，什麼時候換視頻模型
先看你要什麼樣的畫面。要真人出鏡、街上實拍、電影那種鏡頭，Claude Motion 做不出來，換專門生成視頻畫面的模型。只是改畫面上的一句話、一個數字，或者做一條產品介紹、把一個知識講清楚，就用 Claude Motion。
所以做這件事，你需要的是 Opus 5.5 這種會寫代碼的模型，不需要再去找一個視頻模型。API易 apiyi.com 上已經可以直接調用 claude-opus-5-5，用一個密鑰就能接入，按實際消耗的 token 計費。
Claude Motion 倉庫裏有多少現成提示詞
截至 2026-10-20，倉庫的 data/videos.json 共收錄 703 條：動效（motion）369 條、解說（explainer）116 條、3D 117 條、交互（interactive）101 條。README 寫明 2026-10-12 又補充了一批，以解說和 3D 爲主。其中 418 條在 Skillry 上有可對照的重做版，207 條提示詞被標爲不完整，使用前要先看清文件裏的說明。
技術標籤中，Canvas 出現 267 次，SVG 183 次，Three.js 131 次，shader 92 次，GSAP 86 次，CSS 57 次，audio 39 次。這些只是標籤計數，說明模型常用這些工具，不代表你必須會。倉庫裏的中文提示詞約有 115 條，用中文寫提示詞完全可以。每條視頻和提示詞都歸原作者所有。
開始前：在 APIYI 控制檯覈對 Opus 5.5 的 6 項設置
這一節只做一件事：拿到一把能調用 Opus 5.5 的鑰匙，並確認幾項關鍵信息沒有填錯。整個過程不需要安裝任何軟件。
- 你會看到：註冊 API易 apiyi.com 賬號後進入控制檯，入口是 api.apiyi.com。控制檯是網頁，可以在裏面創建令牌，也可以查看每次調用的日誌。
- 點什麼：找到創建令牌的位置，新建一個令牌。分組選擇文檔寫明可用的 default、svip 或 ClaudeCode 之一，然後複製完整密鑰，先保存在記事本里。
- 驗收標準：令牌列表裏能看到這把新鑰匙，記事本里保存着一串完整的密鑰。
| 覈對項 | 應該看到什麼 | 爲什麼要覈對 |
|---|---|---|
| 令牌 | 列表裏有一個新建的令牌，可以複製出完整密鑰 | 後面的聊天客戶端需要填寫它 |
| 分組 | default、svip、ClaudeCode 其中之一 | 文檔寫明這三個分組可以使用 Opus 5.5 |
| 模型 ID | claude-opus-5-5（另有 claude-opus-5-5-thinking） | 名字差一個字符就調用不到 |
| 接口類型 | OpenAI 兼容和 Anthropic 原生兩種都有 | 根據你的客戶端支持哪種來選擇 |
| 價格 | 每 100 萬 tokens：輸入 4 美元，輸出 20 美元，緩存讀取 0.20 美元 | 文檔寫明與上游一致 |
| 使用日誌 | 做完後能看到這一次扣了多少 | 單條成本以日誌爲準，不靠估算 |
價格來自 API易 apiyi.com 文檔站 2026-09-23 的動態，頁面標題是 Claude Opus 5.5 Is Live，Priced Below Opus 5。Anthropic 於 2026 年 9 月 22 日發佈，這則動態的時間是 2026/9/23 13:27（UTC+8）。同一文檔裏 Opus 5 是輸入 5 美元、輸出 25 美元、緩存讀取 0.5 美元，所以 Opus 5.5 比它便宜。一條花多少，做完看控制檯日誌。
用 Opus 5.5 做出第一條 Claude Motion 動效：5 步走完
第 1 步：在聊天窗口裏接上 Opus 5.5
- 你會看到：大多數支持自定義密鑰的聊天客戶端，設置頁裏都有「API 密鑰」「API 地址」「模型」三項需要填寫。
- 點什麼 / 貼什麼：密鑰填剛纔複製的那串。地址按 APIYI 文檔裏對應接口類型給出的地址填寫。模型填 claude-opus-5-5。如果客戶端裏有「關閉思考」的開關，不要打開它。
- 驗收標準：發一句「你好」能收到正常回復，回到控制檯日誌能看到一條 claude-opus-5-5 的調用記錄。
第 2 步：貼入第一條 Claude Motion 提示詞
- 你會看到：一個空白的對話框。
- 貼什麼：先貼 melvynx 的原句。原句如下，尖括號要換成你自己的網址或產品名：
make a dynamic 15-second motion graphics video that shows what an incredible motion designer you are for
在同一條消息末尾，再補上本文建議的一句話。如果模型打不開你的網站，就再加兩三句產品介紹：
請把結果寫成一個完整的 HTML 文件，所有代碼放在一起，用瀏覽器打開就自動播放，畫面比例 16:9，不需要解釋。
- 驗收標準：回覆的主體是一大段代碼，通常以
<!DOCTYPE html>開頭、以</html>結尾。你不需要看懂這些代碼。
第 3 步：把代碼存成網頁，用瀏覽器打開
- 你會看到：代碼塊右上角通常有一個「複製」按鈕。
- 點什麼：點擊複製，新建一個文本文件，粘貼進去，然後保存爲 motion.html。Windows 用戶保存時要把類型選爲「所有文件」，否則文件可能變成 motion.html.txt。Mac 用戶用「文本編輯」時，要先點「格式」菜單裏的「製作純文本」。保存後雙擊這個文件，用瀏覽器打開。
- 驗收標準：瀏覽器打開後，畫面會自己動起來，而不是顯示一整頁文字代碼。
第 4 步：看完一遍，只改一處
- 你會看到：第一版通常能正常播放，但配色可能比較普通，節奏可能偏平，個別文字也可能超出畫面。
- 貼什麼：一次只提一個修改要求，比如：
把第 3 秒出現的那行標題改成「……」，其餘部分保持不變，重新給出完整的 HTML 文件。
- 驗收標準：用新代碼覆蓋原文件並刷新瀏覽器後，只有你要求修改的地方發生了變化。
第 5 步：把動效錄成視頻
- 你會看到：瀏覽器正在播放你的動效。
- 點什麼：先按 F11 進入全屏，Mac 用 Ctrl+Cmd+F。Windows 可以用 Win+G 打開系統自帶的錄製工具，Mac 用 Shift+Cmd+5 錄屏。先開始錄製，再刷新頁面，讓動畫從頭開始播放。
- 驗收標準：錄下來的視頻能在播放器裏從頭播放到結尾，時長接近你要求的 15 秒。
做完一步怎麼算過，4 種常見問題怎麼排
| 步驟 | 怎麼算過 | 沒過時常見的樣子 | 怎麼辦 |
|---|---|---|---|
| 第 1 步 接上 Opus 5.5 | 能收到回覆，日誌裏有 claude-opus-5-5 的記錄 | 模型報 400 | 不要把思考（thinking）設成關閉，也不要把工具調用設成「必須調用」。這兩種設置在 Opus 5.5 上都會返回 400。 |
| 第 2 步 貼提示詞 | 回覆主體是一整份 HTML 代碼 | 生成的不是視頻，而是一大段解釋 | 追加一句「只輸出一個完整的 HTML 文件，不要解釋」，然後重新發送。 |
| 第 3 步 存成網頁 | 瀏覽器裏畫面會自己動 | 打開後一片空白 | 確認文件擴展名是 .html，結尾有 </html>。代碼被截斷就讓它「接着寫完」，用了外部庫的話要聯網後再打開。 |
| 第 4 步 只改一處 | 只有要改的地方發生變化 | 文字超出畫面 | 告訴它「所有文字留出安全邊距，畫面固定爲 16:9，並隨窗口等比縮放」。 |
| 第 5 步 錄成視頻 | 視頻能從頭播放到尾 | 錄到的開頭已經播到一半 | 先開始錄製，再刷新頁面。 |
🚀 快速開始建議：第一次練手可以先在 API易 apiyi.com 申請 claude-opus-5-5 的試用額度，具體流程見文末延伸閱讀。跑完一條後，到控制檯日誌看看這次扣了多少，再決定後面怎麼用。
可選：已經在用 Claude Code 的人
這一小節可以完全跳過，跳過也能做完本文。如果你本來就在用 Claude Code，它的好處是能直接把 HTML 文件寫到你的電腦上，省去複製粘貼和修改擴展名的步驟。
按照 APIYI 文檔的寫法，密鑰放在 ANTHROPIC_AUTH_TOKEN 裏。地址使用前面控制檯那個域名，前面加上 https://，末尾不要加 /v1。模型選擇 claude-opus-5-5。另外要注意，Opus 5.5 的默認 effort 從 high 改成了 medium，寫動畫這類代碼時最好明確指定。如果你同時在用好幾個 Agent，可以看延伸閱讀裏 magpie 那篇，讓所有 Agent 共用同一把鑰匙。
4 個 Claude Motion 案例：照着 Opus 5.5 提示詞改
下面 4 條提示詞都來自倉庫原文，效果圖是清單方託管的短片截幀。它們使用的都是同一個 claude-opus-5-5，在 API易 apiyi.com 用一把鑰匙就能逐條試，不需要爲不同風格切換模型。
| 作者 | 倉庫分類 | 技術標籤 | 適合做什麼 | 怎麼改成你自己的 |
|---|---|---|---|---|
| melvynx | motion | Canvas / SVG / GSAP | 15 秒作品集 | 把尖括號換成網址或產品名 |
| ezshine | motion | Canvas / SVG / GSAP | 橫屏產品介紹（中文提示詞） | 補充你的產品特性清單 |
| songkeys | motion | Canvas | 講故事，文字少 | 換掉主題，保留風格詞 |
| Ror_Fly | explainer | Canvas | 30 秒步驟解說 | 把雞尾酒換成你的操作流程 |
案例 1：melvynx 的 15 秒作品集
這就是第 2 步用過的那句，短，只規定時長和用途，適合第一次練手。
上圖是 melvynx 的作品截幀，對應提示詞「make a dynamic 15-second motion graphics video that shows what an incredible motion designer you are for
案例 2：ezshine 的中文產品宣傳片
如果你有一個產品，想做一條橫屏介紹視頻，可以直接用這條中文提示詞：
設計個動畫，介紹本項目的各項特性，像是專業的產品介紹宣傳片，最後要生成 16:9 的mp4 視頻
「本項目」默認模型能看到項目。普通聊天窗口看不到，要在後面補三到五個特性。窗口交不出 mp4，拿到的仍是 HTML，按第 5 步錄屏。
上圖是 ezshine 的作品截幀，對應中文提示詞「設計個動畫，介紹本項目的各項特性，像是專業的產品介紹宣傳片，最後要生成 16:9 的mp4 視頻」。
案例 3：songkeys 的摺紙塗鴉敘事
適合講故事，不適合列功能。長處是風格寫得具體：摺紙、塗鴉、可愛、溫暖、文字少。
Create a short origami / doodle-style animation showing humanity’s development， progress， and civilization from birth to the present， and ultimately the hatching of AI. AI then gradually develops and advances， eventually hatching today’s Opus 5.5 （you）. Style: doodly， cute， warm， strongly narrative， no spoken language （simple text is OK， but don’t use too much explanatory/narrative text， because I want different civilizations to be able to understand it）， poetic， moving， high quality.
上圖是 songkeys 的作品截幀，對應提示詞「Create a short origami / doodle-style animation showing humanity’s development…」。
案例 4：Ror_Fly 的雞尾酒步驟解說
從空杯到做完一杯，30 秒，依次出現配料和用量。倉庫原文的拼寫錯誤 ingreidents 保留原樣。
We’re going to try a little test. Do you think you could render a recipe motion graphic animation using javascript or html （w/e you think will produce the best） to show the full recipe from start to finish （empty glass to completed cocktail） – Explainer video style – Showing the recipe ingreidents + measurements as they’re going into the cup. Should be a 30s video.
上圖是 Ror_Fly 的作品截幀，對應提示詞「We’re going to try a little test. Do you think you could render a recipe motion graphic animation…」。
Claude Motion 片子發出去之後：截圖上能覈對的數字
倉庫 Motion graphics 第一格，標籤 Canvas · AI image。提示詞很長，大意是沿用 Claude Pop 這首歌的同一條音軌，重做一版畫面。
上圖是 anabology 的作品截幀，對應倉庫記錄的那條提示詞：沿用 Claude Pop 這首歌的同一條音軌，重新做一版畫面。
下面三張截圖，是大家在各大平臺上獲得的流量，可見 Claude Motion 的流量還是很多的
抖音 @悲傷喜羊羊這條，文案寫明用了 Claude Opus 5.5。點贊 30.3 萬，評論 2498，收藏 2.2 萬，分享 11.2 萬
X @anabology 這條是 2026 年 9 月 26 日的帖子，達到了恐怖的 20.1M 次瀏覽量
抖音 @電子智人這條是 9 月 28 日的《信息論 / 驚奇之學》。點贊 86.7 萬，評論 8107，收藏 21.3 萬，分享 19.5 萬
這一條只能說明同一類動效解說有互動，不能說明用的是哪個模型。
anabology 主帖大意是：給 Opus 5.5 加上 donald 的 Midjourney 提示詞和一個情緒板，12 小時後看到結果。被引用的 donald（@donaldjewkes）只顯示 Sep 24，大意是對着電腦說了 5 分鐘，Claude 工作了 12 小時。
Claude Motion 常見問題
Q1：不會寫代碼，能做 Claude Motion 嗎？
可以。代碼由 Opus 5.5 來寫，你只需要複製、粘貼、保存成 .html，再用瀏覽器打開。整個過程中唯一需要「懂技術」的地方是獲取密鑰，在 API易 apiyi.com 註冊並創建令牌，也是在網頁上點幾下就能完成。
Q2：Claude Motion 和 Seedance 怎麼選？
真人臉、實拍質感、電影鏡頭，選 Seedance 這類視頻模型。文字、數字、圖表、產品介紹、知識解說，選 Opus 5.5。有人把單條成本寫進視頻標題，那是標題文案，不是實測，也不是官方價格。
Q3：爲什麼第一版 Claude Motion 動效很醜？
第一版通常只是能動。常見原因：沒寫風格、一次要求太多、默認 effort 是 medium。照 songkeys 把風格詞寫具體；客戶端有思考強度就調高；之後每輪只改一處。
Q4：能不能直接下載 MP4？
本文拿到的是 HTML。最穩是按第 5 步用系統錄屏。第一版不要指望直接下到 MP4。
總結
Claude Motion 不是一款視頻軟件，而是社區裏的一種做法：讓 Opus 5.5 寫代碼，讓瀏覽器把動畫畫出來，再錄成視頻。你不需要會寫代碼。
第一次按這 5 步走：在 API易 apiyi.com 拿到 claude-opus-5-5 的密鑰，貼一句提示詞，存成 HTML，只改一處，最後錄屏。一條片子花多少錢，做完看控制檯日誌，不要看別人視頻標題裏的數字。
要真人出鏡、街上實拍、電影鏡頭，別用 Claude Motion，換專門生成視頻畫面的模型。要改一句話、改一個數字，或者做產品介紹和知識講解，用 Claude Motion。
延伸閱讀
- 📘 Claude Opus 5.5 如何用代碼寫視頻？一文看懂 SVG 素材、配音、動畫、字幕 4 大環節：讀完本文想看渲染、配音、字幕怎麼拆，去這篇。本文不重複講原理。
- 📘 claude-opus-5-5 怎麼免費試用？5 步申請流程、額度與限制說明：還沒充值、想先拿額度試一條。
- 📘 claude-sonnet-5-5 對比 claude-opus-5-5:Opus 更快、Sonnet 只剩便宜？6 組數據講清企業長上下文 Agent 的最佳搭配：拿不準這件事該不該用 Opus 5.5。
- 📘 手把手教程：一個 Key 接上所有 Agent，用開源 magpie 統一接入 API 網關（以 Claude Code、Codex、Pi、Hermes 爲例）：已經有好幾個 Agent，想用同一把鑰匙。例子不是能力上限，所有 Agent 都能接。
- 📘 帶人臉視頻生成/編輯 SeeDance2.5 實戰：3 步完成真人素材入庫與合規調用：要真人、實拍感的畫面時，不要硬用代碼動效，改走視頻模型。
參考資料
- 作品與提示詞清單：github.com/yihui-dev/awesome-opus5-5-videos（README 與 data/videos.json，數據截至 2026-10-20，不是本文實測）
- 並排觀看頁：skillry.dev/ai-videos/opus-5-5
- 案例原帖：x.com/melvynx/status/2103714680577638493、x.com/ezshine/status/2103501705698750731、x.com/songkeys/status/2102743212922384673、x.com/Ror_Fly/status/2102853258582880547、x.com/anabology/status/2103534482930491441
- 價格：APIYI 文檔站 2026-09-23 動態，頁面標題 Claude Opus 5.5 Is Live，Priced Below Opus 5。輸入 4 美元、輸出 20 美元、緩存讀取 0.20 美元，每 100 萬 tokens，文檔寫明與上游一致。
