它能做什么
UI Motion Studio 可以把产品发布、课程介绍、工具功能、数据成果和知识科普内容整理成一条带节奏的 UI 动效短片。它适合需要“看起来像发布片，但又希望能快速改文案、换主题、复用结构”的场景。
成片本质上是一个浏览器可播放的 HTML 文件。它可以作为网页中的演示页面，也可以全屏播放后录制为短视频素材，用在小红书、抖音、视频号、B 站、公众号或产品介绍页中。
核心能力
制作流程
- 读内容：提炼主题、受众、重点信息、真实数据和目标平台。
- 定审美：选择主题、主色、版式密度和竖横比例。
- 写动效脚本：给每一幕安排不同动效手法和节奏。
- 工程生成：用代码生成单 HTML 成片，保持舞台比例和播放控制。
- 本地自测：用浏览器检查画面、动画、文字溢出和不同屏幕尺寸表现。
如何实现
底层采用前端代码驱动：HTML 负责结构，CSS 变量负责主题，GSAP 时间轴负责动效节奏。每一幕都按“内容对象 + 动效手法 + 时间轴”组织，便于替换文案、裁剪分镜或另存横竖版本。
项目内部包含模板引擎、主题库、生成器、表单页和动效配方。公开页不提供这些源文件，也不提供可复制的完整生成包；如果需要使用这套能力，可以按项目定制成片，或购买对应 skill 后在本机环境中使用。
公开边界：本站只展示项目说明、功能范围、实现思路和演示页面；不公开付费 skill 的源代码、完整模板包、内部字段契约或可直接复制的生成器提示词。
如需下载或使用，请联系作者。
项目收费：39.9 人民币
动效演示
此横版演示页，是由UI Motion Studio 动效工坊生成的成片效果，不是项目源文件。
定制方式
你可以直接把需求写成一句话，也可以按模板补齐信息。信息越完整，成片越贴合；如果还没想好内容，也可以先给产品名和几个关键词，由我先整理分镜、主题和动效方向。
最短提示
- 用 ui-motion-promo 做一条产品动效片。
- 用 UI Motion Studio 生成一个宣传片 HTML。
- 做一条横版 UI 动效成片。
- 给这个产品生成竖版动画宣传片。
推荐填写模板
用 ui-motion-promo 生成一条 UI 动效宣传片。
产品名：
一句话 slogan：
核心卖点：1. 2. 3.
真实数据：1. 2. 3.
主色 / 参考风格：
目标平台：竖版 9:16 / 横版 16:9
想用主题：
输出位置：
还没想好内容时
用 ui-motion-promo 帮我做一条产品宣传动效片。
我先给你产品名和几个卖点，你按流程帮我补成分镜、主题和动画方案，最后生成 HTML。
最少需要提供：产品名、一句话 slogan、3 到 6 个要讲的点、主色或参考图、目标平台，以及是否有真实数据。没有真实数据也没关系，会删除数据幕，不会编造数字。