Motion Skills
← Skills
付费发布

界面变形动效

按钮变成播放器,搜索框长出结果:一个对象就地变形。

粘贴到 Claude Code、Codex、Cursor 或任何支持 Skills 的 Agent 中。

需要: Node.js 22+、FFmpeg、Chrome。不需要 API Key。

其他配色和画幅

界面变形动效 · 纸白 · 9:16
配色: 纸白 · 9:16
界面变形动效 · 电光 · 1:1
配色: 电光 · 1:1

同一个模板换了配色和画幅后渲染出的结尾画面。

5 套配色

  • 墨黑 · 默认
    ink
  • 纸白
    paper
  • 电光
    electric
  • 黑白
    noir
  • 沙色
    sand

在提示词里写上配色名就能切换,也可以自定义强调色、背景色和文字色。

安装提示词
阅读 https://claude-motion.com/skills/ui-morph-effects/install.md,按说明安装「ui-morph-effects」Skill,然后用它做出第一个视频。

粘贴到 Claude Code、Codex、Cursor 或任何支持 Skills 的 Agent 中。

示例提示词
Use the ui-morph-effects skill with the tabs effect for Ledger: tabs "Monthly | Yearly | Lifetime", second tab title "Yearly plan", rows "Every template: included | Commercial use: included | Updates: 12 months", 1:1, my accent #2563eb, no Example tag.
风格提示词(Claude Motion 或 Opus 5.5)
Make an 8-second 16:9 seamless loop for [who will watch, e.g. designers], playing [where, e.g. the hero of our product page]. Use only the query and three results below. Near-black background.

A small search pill with a magnifier and the gray word "Search" widens to full width, a caret appears and the query types itself. Three result cards rise into place one after another, each with a colored tile, a bold title and one metric. An orange hover outline moves from the first result to the second. End frame: at 6.6 seconds everything reverses, so the last frame matches the first.

Query: [e.g. "spring campaign"]
Three results: [title · metric] (e.g. "Spring launch email · 48% opens")

无需安装:粘贴到 Claude Motion(Team 或 Enterprise),或直接发给 Opus 5.5,就能得到相近的风格。每次运行结果会有差异;用 Skill 则每次结果一致。