SuperAPI AI 工具集

web-lottie

设计与创作

查看项目

更新于 10-15 17:27

技能介绍

用途:处理网页端 Lottie 动画相关工作,包括 lottie-web、dotLottie Web 组件、动画 JSON 与 .lottie 资产、播放器生命周期与清理、渲染器选择、无障碍以及资产校验。定位为紧凑路由器加领域检查清单,仅在任务匹配时加载对应参考。

主要能力:提供玩家生命周期、dotLottie Web 组件与 Worker、资产无障碍与安全审查、设计与导出兼容性、运行时事件与播放契约等参考文档,并附带审计 CLI 与模板。

使用方式:先检查目标仓库已安装的包、框架与运行时版本、本地设计令牌、无障碍策略和既有动效模式。按需加载 references 目录下的文档。审计 CLI 命令:node scripts/audit.mjs doctor --root . --format json;node scripts/audit.mjs scan --root . --format markdown;node scripts/audit.mjs scan --root . --format json --output web-lottie-audit.json。脚本结论仅作线索,修改行为前须对照当前代码核实。结束前运行仓库聚焦验证命令及本技能审计 CLI,报告已运行命令、已修复项、跳过项原因与残余风险。

适用场景:React Native 外使用 lottie-web、使用 .lottie 资产或 dotLottie 播放器与 Web 组件、需要控制 Lottie 播放段落/标记/事件、审查远程资产与自动播放循环。

限制:React Native 应使用 native-lottie;交互式状态机应使用 Rive;无需设计师资产的简单 UI 动效应用 CSS/WAAPI。Canvas 渲染动画需外部无障碍文本或标签;远程动画 URL 需 CSP/缓存/安全审查;循环与自动播放须考虑减少动效与暂停行为。API 细节须对照目标仓库已安装包版本核实,不得引用本地抓取路径或缓存路径。分类依据网页动画实现用途归入前端与建站。