你的故事從這裡開始
步驟 01
放入你的內容
一篇文章、一份腳本、一閃而過的靈感。從你已有的文字開始。
CLAUDE MOTION SKILLS · 適用於 CLAUDE CODE 與 CODEX
Claude Motion:
讓文章動起來。
文章 → 腳本 → 筆記 → 靈感 → 你的下一支影片
值得分享的故事，展現你的視覺風格。用你原本使用的代理，將文字化為生動的影片。
CLAUDE MOTION SKILLS動態設計習作 ↗
✳
從一個想法開始創作一段
值得欣賞的作品。
值得欣賞的作品。
文字、節奏，全新視角。
原創動態習作
HTML → 動效相容工具
✳ Claude Code CodexOpenCodeCursorKimi以及你喜愛的代理程式
就在您喜愛的工具裡。
Claude Code · 工作流程預覽
安裝本站 CLI
curl -fsSL https://claudemontiondesignskills.org/downloads/install.sh -o /tmp/cm-skills-install.sh sh /tmp/cm-skills-install.sh export PATH="$HOME/.local/bin:$PATH" cm-skills setup
安裝 cm-skills，使用裝置碼登入，再到 Claude Code 或 Codex 中創作。
使用方式
三個步驟，一個好故事。
帶上你的內容，選好方向，讓故事展現應有的動感。
做出你的風格
步驟 02
選擇視覺風格
醒目的字體、沉穩的簡報、紙張拼貼。找到最適合故事的氛圍。
隨時開始創作
步驟 03
預覽、完善、分享
編輯分鏡、預覽動效，再帶走完整專案。
動效 · 以 HyperFrames 打造
輸入 HTML，產出生動的故事。
開放的畫布、精準的時間軸，以及能完整保留的專案。
您的作品
小小的想法。
精彩地述說。
你的智慧代理精彩地述說。
你的標題 · 分鏡 01
圖層與動態
逐字講述故事
加入自己的音訊
為易讀而設計
可編輯 HTML。每個字、色彩與時刻都由您掌握。
方便反覆修改
在你的程式設計代理程式中繼續完善同一份作品。
保留完整專案
下載原始檔，使用 HyperFrames 在本機渲染。
你專屬的創作夥伴
搭配你熟悉的程式開發工具使用。
採用 HeyGen 的開源 HyperFrames 引擎（Apache-2.0），由本站獨立建置。
從草稿到完成
故事所需，盡在其中。
簡單開始，展現個人風格，掌握創作主導權。
讓它動起來。
文字 ↗動態字體排版
讓文字多一分感染力。
清晰的視角。
視覺 ↗視覺敘事
讓想法更直觀、更容易理解。
分鏡 01 → 02
故事 ↗可編輯分鏡
調整每個分鏡的順序、文案與節奏。
你的下一個故事。
工作區 ↗專屬於你的工作區
保留本機草稿，或將專案儲存至你的帳號。
準備好分享。
分享 ↗分享預覽
準備好後，即可建立公開連結。
從 HTML 到 MP4。
匯出 ↗本機影片匯出
在你的電腦上，將原始碼製作包從 HTML 渲染成 MP4。
CLAUDE CODE / CODEX
你的代理，你的創作流程。
在這裡製作初稿，再用你的程式開發代理開啟專案。描述你想調整的地方：更緩慢的揭示、更有力的開場，或不同的節奏。每個專案都能持續編輯。
| 從這裡開始 | 在本機繼續 |
|---|---|
| 文章或腳本 | 你的程式設計代理程式 |
| 可編輯分鏡 | 細緻調整的動效設計 |
| HTML 動畫預覽 | 透過 HyperFrames 輸出 MP4 |
| 你的訂閱 | 你自己的工具與方案 |
MOTION / PPT
選擇你的視覺語言。
選擇視覺方向，每一種風格都有可執行的原創作品。
配對我的內容
描述主題、受眾或氛圍。按風格關鍵字配對，也可以多選。
67 種風格與資源
選擇視覺方向，每一種風格都有可執行的原創作品。
選好風格，開始創作所有風格
動效
- Kinetic Type
- Paper Collage
- Quiet Keynote
- Data Story
- Frosted Product
- Thoughtful Paper
- Blueprint
- Soft Clay
- Watercolor Story
- Tool Focus
- Shared Paper
- Airy Signal
- Playful Selection
- Electric Layer
- Evidence Board
- Cutout Explainer
- Newsprint
- Product Brief
- Picture Book
- Purposeful Motion
- Retro Cutout
- Directors Board
- Whiteboard
- Canvas Principles
- Ink Press
- Brand Rhythm
- Geometric Proof
- Painted World
- Poster Press
- Measured Beat
- Naturalist Sketch
- Starfield Launch
- Inkline Stories
- Storyboard Studio
- Dimensional Launch
- Neon Reel
- Nordic Gouache
- Spring Captions
- Refraction Launch
- Annotated Comic
- Colorful Recap
- Single Line
- Word Cadence
- Story Route
- Motion Framework
- Geometry Lab
- Painted Verse
- Spring Stickers
- HTML Story
- Motion Recipes
- Research Reel
- Canvas Sequence
- SaaS Clay
- Inkline HUD
- Connected Build
- Precision Glow
- Pixel Warmth
- Document Clear
- Sage Order
- Connected Answers
- Red Diagonal
- Dark Material
- Conversation
- Spectrum Ribbon
- Mint System
- Monochrome Engine
- Expanding Modules
PPT
- Academic Argument
- Acid Agency
- Apricot Ink
- Aqua Campus
- Architectural Project
- Article Brief
- Blue Block Company
- Blue Lime Ledger
- Botanical Quiet
- Brand Story
- Brush Paper
- Chromatic Futures
- Cinematic Wilds
- Citrus Loop
- Cobalt Dark Pitch
- Cobalt Growth
- Cobalt Ribbon
- Cobalt Serif
- Cobalt System
- Confetti Gathering
- Consulting Storyline
- Cozy Island
- Visual Framework
- Electric Studio
- Field Notes
- Gallery Catalogue
- Golden Market
- Image Narrative
- Inclusive Cutpaper
- Ink Landscape
- Lavender Editorial
- Learning Loop
- Lilac Pitch
- Lime Endurance
- Mint Marker
- Mono Acid
- Navy Glass
- Neon Makers
- Ochre Editorial
- Orbital Workshop
- Pastel Cutout
- Primary Classroom
- Pop Motion
- Primary Doodle
- Prismatic Fashion
- Red Black Zine
- Research Paper
- Research Talk
- Sky Glass
- Slate Social Report
- Soft Gradient
- Sorbet Window
- Spectrum Strategy
- Starlit
- Steel Curve
- Storybook Margin
- Sunlit Structure
- Tidal Playbook
- Visual Canvas
- Yellow Balance
- Yellow Sketchnote
適合對象
獻給有話想說的人。
創作者
打造讓觀眾想收藏的下一個故事。
教育工作者
讓複雜的概念有清楚直觀的視覺呈現。
獨立開發者
展現你的產品與眾不同之處。
說故事的人
為你喜愛的文字找到新節奏。
價格
從這裡，輕鬆開始。
動效、61 款 PPT 風格與音訊點數。使用自己的 Claude Code 或 Codex，在本機渲染。
音訊開放狀態尚未確認。服務狀態確認前，結帳暫不可用。訂閱前請重新整理本頁檢查狀態。
原創實作
Creator
$19.90/ 月
80,000 點數 / 月
- 動效 + 61 款原創 PPT 風格
- HTML 簡報與逐頁講稿
- 自備智慧體方案，本機算繪 MP4
原創實作
Studio
$49.90/ 月
240,000 點數 / 月
- 動效 + 61 款原創 PPT 風格
- HTML 簡報與逐頁講稿
- 自備智慧體方案，本機算繪 MP4
取消訂閱於已付費週期結束後生效。已下載作品保留使用權，大模型訂閱需自備。
常見問題
幾個常見問題。
這是 Anthropic 的官方產品嗎？+
不是。Claude Motion Skills 獨立營運。Claude Code 與 Codex 的名稱僅表示工具相容性，並不代表隸屬關係。
我可以在這裡製作什麼？+
將文章或腳本轉為可編輯的分鏡，預覽 HTML 動效作品，並下載專案製作包，在本機渲染影片。
我需要訂閱 AI 服務嗎？+
瀏覽器內的分鏡與範本不依賴 AI。若想透過程式設計代理程式進一步完善作品，請使用自己的代理程式與方案。我們不提供模型使用額度。
你的訂閱+
取消訂閱於已付費週期結束後生效。已下載作品保留使用權，大模型訂閱需自備。
我的專案儲存在哪裡？+
草稿會保留在此瀏覽器中。登入並選擇「儲存至雲端」後，專案才會存入您的帳號。分享連結僅會在您建立後公開。
可以匯出 MP4 嗎？+
下載專案製作包、安裝相依套件，然後在電腦上執行其中的 HyperFrames 渲染指令。瀏覽器可匯出 HTML 與完整原始碼製作包。
您的下一個故事，從這裡開始。
Claude Code · 工作流程預覽
安裝本站 CLI
curl -fsSL https://claudemontiondesignskills.org/downloads/install.sh -o /tmp/cm-skills-install.sh sh /tmp/cm-skills-install.sh export PATH="$HOME/.local/bin:$PATH" cm-skills setup
安裝 cm-skills，使用裝置碼登入，再到 Claude Code 或 Codex 中創作。