ythx-101/live-panel-skill

解决的问题

它解决了为社交媒体（如 X 或小红书）创建看起来像实时监控仪表板的专业动画架构图的困难。用户无需手动制作动画元素或编写复杂的视频代码，只需在一个 JSON 文件中定义系统的布局和行为即可。

工作原理

该项目充当渲染器和智能体技能。你提供一个定义了方框、连线、数据包流、日志和计数器的 JSON 配置文件。系统使用确定性的“运动语法”，其中每一帧都是时间的纯函数，确保动画的一致性和可重复性。它将这些配置渲染为 H.264 MP4 视频或可在任何浏览器中循环播放的独立 HTML 页面。它还包含一个验证脚本，用于检查文本溢出或布局重叠，以确保最终输出的精美度。

适用人群

它专为希望可视化智能体架构、系统数据流或多智能体树的 AI 研究人员、工程师和内容创作者设计。对于那些希望将图表生成集成到其 AI 智能体工作流（例如使用 Claude Code 或 Cursor）中，让智能体自动生成并验证其自身架构图的用户特别有用。

亮点

• 确定性动画： 使用基于固定种子和时间的渲染引擎，确保每次生成的帧完全相同。
• 智能体就绪： 包含一个 SKILL.md 文件，允许 AI 智能体编写、渲染并自我验证其架构图。
• 多平台支持： 支持标准的社交媒体宽高比（4:5, 3:4, 1:1）以及两种独特的视觉主题：terminal-dark 和 light-pastel。
• 无繁重依赖： 仅使用 Python 标准库、本地 Chrome/Chromium 实例和 ffmpeg 即可在本地运行，无需 API 密钥或云服务。
• 内置质量控制： 包含一个 check_frames.py 工具，可在最终渲染前自动检测文本溢出或元素重叠等布局问题。