composer本身不支持技术插图动画，因其非动画工具，无时间轴、关键帧或svg动画导出能力；真正可行动画需依赖excalidraw-animate官方导出流程或inscode平台生成含正确animateorder/duration参数的html。

Composer 本身不支持技术插图动画 —— 它不是动画工具，也没有内置时间轴、关键帧或 SVG 动画导出能力。 如果你正尝试用 Composer（如 Figma 插件版、或某些旧称混淆的工具）直接生成带交互或序列动画的技术插图，大概率会卡在导出空白、元素不动、或浏览器里无法播放的阶段。

为什么 Composer 不能直接做技术插图动画

Composer 常被误认为是「Excalidraw 的增强版」或「带动画的绘图工具」，但实际它只是 Excalidraw 的一个社区插件/衍生部署（如 excalidraw-animate），本身不提供独立运行环境。真正的动画能力来自：excalidraw-animate 的 JS 渲染逻辑 + HTML 导出模板 + 浏览器执行。

• Composer 若指 InsCode（快马）平台里的某个「Composer 模式」：它本质是前端封装层，底层调用的是 Kimi-K2 模型 + SVG/CSS 动画生成器，动画逻辑不在 Composer 本地执行
• Composer 若指 Adobe 相关工具（如 After Effects 的旧称）：那它根本没集成 Excalidraw 工作流，无法读取 .excalidraw 文件
• 常见错误现象：导出的 HTML 打开后静止不动、animateOrder 属性被忽略、浏览器控制台报错 Uncaught ReferenceError: animate is not defined

真正能动起来的路径只有两条

想让技术插图从静态变动态，必须绕过「Composer 是否支持」这个伪命题，直奔可执行链路：

Workflow Decomposer

工作流任务拆解与模型编排技能。使用场景：(1) 收到复杂工作任务需要拆解为可执行步骤，(2) 需要为不同步骤选择最合适的模型，(3) 需要跟踪工作流进度和模型使用情况，(4) 长时间任务卡住需要问题诊断和解决方案。

下载

• 用 excalidraw-animate 官方导出流程：在 Excalidraw 编辑器中打开文件 → 点右上角 Export → 选 Animated HTML → 下载后双击用浏览器打开（注意：不能用 VS Code Live Server 直接跑，需确保 index.html 同级有 excalidraw-animate.js）
• 用 InsCode（快马）平台替代：访问 https://www.inscode.net → 输入描述（如“三层微服务架构图，数据库先出现，然后是服务层”）→ 选择「技术图解」模板 → 自动生成含 animateDuration 和分组逻辑的 HTML，且自带预览与下载
• 不要手动复制 excalidraw-animate 的 JS 到 Composer 项目里：它的依赖（如 zustand、react）与 Composer 运行时冲突，90% 情况下会白屏

参数写对了，动画才不会断档

animateOrder 和 animateDuration 必须成对出现在元素的 customData 字段中，且值为数字（非字符串）。很多人导出后动画只播第一帧，就是因为：

• animateOrder: "1"（引号导致解析失败）→ 应写成 animateOrder: 1
• 多个同 animateOrder 的元素没加 groupIds → 它们会同时闪现，失去「逐层构建」效果
• animateDuration 设为 0 或负数 → 浏览器跳过该帧，表现为「某一层突然消失」
• 导出 HTML 后手动改了 script 标签顺序 → excalidraw-animate.js 必须在 excalidraw.js 之后加载

最容易被忽略的一点：动画是否生效，和你在哪个编辑器里画图无关，只取决于最终 HTML 是否包含正确初始化代码块 —— 尤其是 excalidraw.animate() 调用是否被执行。别在 Composer 界面里找「播放按钮」，那个按钮不存在。