DAILY BRIEF
编辑图与 HTML 成片
日榜新进是可读站对齐品牌的编辑图 Skill，旁边仍是 HTML 成片、本机 3D、前端工程门禁与开源录屏。
9 月 4 日官方日榜前排仍是近七日已写过的技能库与 VoiceStudio；本期把主推荐让给日榜新进的编辑图、HTML 成片、本机 3D 与前端 Skill。Figma 透明度变量为 9 月 3 日发布；Gemini 3.8 Flash 为 9 月 2 日官方发布。
核心推荐
06 picks
-
cathrynlavery/diagram-design ★ 30.7k
面向 Claude Code、Codex、Pi 的编辑图 Skill，输出自包含 HTML + SVG，不用 Figma 也不用圆角 Mermaid。痛点是 Agent 一出图就是通用圆角盒，跟品牌站接不上；它读首页抽配色和字体，写进 style-guide，再做 WCAG 对比。差异化是 39 种类型各有浅色、深色与完整编辑三套，可把 draw.io / Mermaid 重绘成指定尺寸，静态默认、动效可选。设计师可先 onboard 自己的站，再让 Agent 出架构图、用户旅程和 Wardley 图。
-
heygen-com/hyperframes ★ 43.9k
HeyGen 开源的 HTML 成片框架，把 HTML/CSS、媒体和可 seek 动画渲成确定性 MP4，给编码 Agent 一条不用拖时间线的出片路。痛点是生成视频只交单段画面，字幕、动效和对齐要换软件；它用 data-start / data-duration 标时间，适配 GSAP、CSS、Lottie、Three.js、Anime.js 与 WAAPI，预览走本机浏览器，渲染走无头 Chrome 加 FFmpeg。差异化是 /hyperframes 路由技能把意图分给产品发布、无脸解说等工作流，/figma 可从 Figma 帧重建动画。设计师可先用 HTML 排版再 render。
-
lightningpixel/modly ★ 7.4k
本机桌面 3D 工作台，用本机 GPU 从单张图或一句话生成网格，不把稿件送上云。痛点是产品渲染和角色一致性要排队等云端 mesh，设计师拿不到可改的 glb；它把图→生成→入场景连成可视工作流，可平滑与减面，并用 GitHub URL 装 Hunyuan3D、TripoSG 等扩展。差异化是 CLI agent.py 可从图导出 .glb，编码 Agent 能把本机 3D 接进自动化。提供 Windows / Linux / Apple Silicon 安装包。适合包装、展示道具和角色草稿先出一版可带进 Blender 的 mesh。
-
addyosmani/agent-skills ★ 92.2k
Addy Osmani 把高级工程流水线写成 25 条 Skill，从 /spec、/plan、/build 到 /webperf 和 /ship。痛点是 Agent 一上来就改界面，没有组件边界、可访问性和性能门禁；frontend-ui-engineering 覆盖设计系统、响应式与 WCAG 2.1 AA，/webperf 先测再优化。差异化是每条技能带验证门禁和反理由表，并提供 web-performance-auditor 人设。设计系统团队可先装 frontend-ui-engineering 与 accessibility-checklist，再让 Agent 改组件。
-
mattpocock/skills ★ 249.5k
Matt Pocock 把自己 .agents 目录里的工程技能公开出来，覆盖格烧需求、域建模、TDD、代码库设计、架构改进和原型。痛点是通用 Agent 一开始就改代码，交出的界面变体没共同语言也没门禁；prototype 用来出 HTML 界面变体，codebase-design 与 improve-codebase-architecture 把组件边界写清。差异化是先问清楚再动手，并用 writing-for-agents 把文档写成 Agent 可解析的规范。设计系统团队可先 /setup-matt-pocock-skills 定下文档位置和标签。
-
CapSoftware/Cap ★ 21.7k
开源 Loom 平替，把录屏、本机剪辑、分享链接、评论和转写收进桌面应用。痛点是设计走查和界面讲解要交给闭源录屏云，或自己拼剪辑器；Studio 模式在本机加背景、缩放、裁切与字幕，Instant 模式边录边传得链接。差异化是可自托管、接 S3 / R2 / MinIO，也可用 Cap AI 出标题、摘要、章节和字幕，并导入旧 Loom。提供 macOS / Windows 安装包与 Docker Compose。设计师可把走查录屏留在自己的存储里。
其他值得关注
06 items
-
tt-a1i/archify 持续在榜，可验证架构图 Skill 现 ★ 47.5k，与 diagram-design 并列，一个偏工程可验证、一个偏编辑排版。
-
THU-MAIC/OpenMAIC 持续在榜，交互教室现 ★ 31.4k，幻灯与 PPTX 导出可继续跟。
-
debpalash/VoiceStudio 近七日已写过，今日仍在官方日榜且日增超 1k，现 ★ 17.3k。
-
DietrichGebert/ponytail 持续在榜，让 Agent 先复用再写新代码，现 ★ 124.9k，今日日增仍超 1.6k。
-
Figma 透明度变量与动画 Shader 9 月 3 日可在 Variables 里批量改透明度且不拆色；9 月 1 日生成式插件与 Shader 支持动画、社区发布与导出代码。
-
Coinbase × Code Connect Figma 官方评测加 Code Connect 后中位任务耗时降 19.6%、token 降 29.5%；Coinbase 用它阻止 Agent 自造组件。
热议精选
@ainotesusDiagram Design helps you make polished diagrams without fighting Figma or settling for generic rounded boxes. It can read a website to match its brand and produce self-contained HTML and SVG across 39 visual types.
@_philschmidThe easiest way to try Gemini 3.8 Flash in an agentic environment is Managed Agents. Gemini gets a dedicated remote sandbox in a single API call, with Python, Node, Git, Bash, Search, function calling or MCP.
@nikhilx22I used hyperframes skill to one shot this
总结建议
今天热榜看起来还是技能库，但没写过、又能改图表与成片工作流的，是可读站的编辑图、HTML 视频和本机 3D。
- diagram-design 用站点 token 把 39 种图画成品牌色的 HTML/SVG；Archify 仍在榜上做可验证架构图。
- HyperFrames 把排版和确定性渲染写成 Agent 可调用的 HTML；Modly 把单图变成可导出的本机 mesh；Cap 把走查录屏留在可自托管的工作区。
- Addy 与 Matt 的 Skill 用组件边界、原型和 Web Vitals 门禁抑制一开始就改界面。Figma 透明度变量与动画 Shader 上线；Code Connect 让 Agent 拿真正组件而不是自造 stepper。
要图表就 /plugin marketplace add cathrynlavery/diagram-design 并 onboard 自己的站。要动效成片先 npx skills add heygen-com/hyperframes；有 NVIDIA 或 Apple Silicon 就下 Modly 导一版 glb。已在用 Claude Code 的人加上 Addy 的 frontend-ui-engineering 与 Matt 的 prototype。走查录屏走 Cap；设计系统维护者对一下 Code Connect 能不能把组件 import 交给 Agent。