live-panel-skill：让架构图动起来

GitHub Stars 760

分类：音视频创作

将仓库放入助手的技能目录，以 live-panel 调用。从示例生成 JSON，设置节点、连线和日志，再渲染并检查文字溢出、重叠及重播一致性。内置环形、漏斗和嵌套循环视图，支持 4:5、3:4、1:1 画幅。需 Python 3.8+、Chrome/Chromium 和 ffmpeg，无需 API 密钥；支持 macOS、Linux，Windows 需 WSL。适合流程讲解，动画计数须标明模拟，不接入真实监控数据。

视频图像与设计开发教学与研究

一句话价值

用一份 JSON 生成终端风或浅色信息图风的动态架构图，展示数据流、日志和状态变化，输出 MP4 或循环播放的网页。

适合场景

开发者
内容创作者
教育工作者

亮点

用 live-panel 把“用户请求 → 主代理 → 搜索与代码工具 → 返回结果”做成 4:5 终端风架构动画。保留完整布局，加入流动的数据包和日志，输出 MP4、HTML 和 JSON。
用浅色主题和 loop 视图展示“计划 → 执行 → 检查 → 未通过则重试”的流程，做成 3:4 信息图动画；模拟计数请明确标注，并保留引用来源。
检查这份 live-panel 配置在多个时间点的文字溢出和重叠，验证重播一致性，修正后导出 1:1 视频和预览截图。

安装指引

npx skills add https://github.com/ythx-101/live-panel-skill