composer 与 app 操作演示无关，真正可用的路径只有三条：录屏+标注、figma+smart animate、lottie+bodymovin，且均不依赖 composer。
Composer 不是制作手机 App 操作演示动画的工具——它既不能录屏、不能模拟触摸事件，也无法导出带交互反馈（如按钮按压态、滑动轨迹、状态切换）的 H5 或 MP4 交互流程。你看到的“Composer + App 演示”大概率是混淆了以下三类工具：
- 把
SOLIDWORKS Composer（工业 CAD 动画软件）误当作移动端动效工具 - 把某款国产教育平台或剪辑软件里名为 “Composer” 的简易合成模块当成专业交互录制器
- 在前端项目中用 PHP 的
composer安装了lottie-web或swiper，但误以为动画逻辑由composer控制
真正能做 App 操作演示的路径只有三条，且都和 composer 无关：
用录屏+标注工具生成基础操作流
适合快速出稿、内部培训场景。关键不是“怎么动”，而是“用户视线落在哪”：
- 用
QuickTime Player（macOS）或Windows Game Bar（Win10/11）直接录真机/模拟器操作，注意开启“显示鼠标点击”和“触控反馈”（iOS 模拟器需在Hardware > Touch > Show Touches打开） - 导入到
ScreenFlow或Camtasia后，手动加光标高亮、点击脉冲动画、区域放大镜——这些效果靠时间轴关键帧驱动，不是自动识别 - 避免用“自动点击标注”插件：它们依赖固定坐标，一旦 UI 适配不同屏幕尺寸就错位
- 导出时禁用硬件加速编码（尤其 macOS 上的 HEVC），选
H.264 + MP4，否则微信内嵌 WebView 会卡顿或黑屏
用 Figma + Smart Animate 做可交互原型动画
适合交付给开发看逻辑、给客户演示流程，不依赖真机环境：
- 把每页 App 截图导入 Figma，转为
Frame，命名规范如login/idle、login/error、home/scrolling - 用
Prototype面板连线，触发方式选Tap或Drag，动画类型必须选Smart Animate（不是 Dissolve 或 Slide） - 关键细节：
Smart Animate只比对同名图层（Layer Name 一致），所以按钮按下态要重命名为btn_submit/pressed，不能只改颜色 - 导出为链接后，在微信里打开会自动降级为 GIF；如需 MP4，得用 Figma 插件
Lottie Files导出 JSON，再用lottie-web渲染——这时才轮到 PHP 的composer管理lottie-web依赖，但它只管下载，不管动画逻辑
用 Lottie + Bodymovin 实现轻量交互动画
适合嵌入 H5 页面、替换静态图、展示微交互（如下拉刷新、加载动画），但无法还原完整 App 操作链：
- 在 After Effects 中用
Bodymovin插件导出 JSON，前提是动画全部基于矢量图层（Shape Layer），不含位图、摄像机或表达式 - AE 里不能用
Trim Paths做进度条——它不支持动态参数绑定；改用Stroke+Offset关键帧，导出后可用 JS 控制anim.goToAndStop(frame, isFrame) - PHP 项目中通过
composer require "lottie-web"是无效的：lottie-web是前端 JS 库，应通过npm install lottie-web或<script src="https://unpkg.com/lottie-web@latest"></script>引入 - 微信安卓版对 Lottie 支持不稳定，建议 fallback 到 CSS 动画：用
@keyframes写简单旋转/缩放，并在 JS 中检测typeof lottie === 'undefined'后降级
最容易被忽略的一点：App 操作演示的本质是“状态机映射”，不是“画面播放”。一个“登录失败→重试→成功”的流程，需要明确每个节点的触发条件（网络返回 code=401？输入框为空？）、反馈样式（错误文字颜色、图标抖动次数）、以及超时兜底（3s 无响应显示重试按钮）。这些逻辑全在 JS 里，composer 连碰都碰不到。
