正在打开每日关注
正在打开每日关注
通过文件化约束、单界面迭代与人工视觉评审，让 Codex 和 Claude Code 的 UI 生成可持续复用。
When building UI with AI agents, design work starts fresh on every prompt. This can get really frustrating when you are trying to follow a design system in a large codebase across many agents. A *WIP* solution I have been building is /design-loop. It’s a design engineering loop for Codex + Claude code. How it works: it reads your codebase, creates a /design.md contract, builds a backlog, then improves one surface at a time. It asks you questions around the design and helps you establish an initial system if you don't have anything set up. It follows this pattern: brief → design references → implementation → visual review (screenshots) → human critique → revision. Your design taste should live in files, not in the agent’s temporary context. The system also tracks what decisions have been made, what patterns should repeat, what should be removed, and what the product should not become. Constraints to hopefully make the output better. Disclaimer: expect continual iterations of this skill.
是什么
design-loop 是 brijr/skills 中面向 Codex 与 Claude Code 的设计工程 skill，提供材料显示用 npx skills add ... 安装；页面元数据为 20 stars、2026-06-09 首次出现、2 次安装。它不是组件库，而是把设计判断写入仓库文件、按 session 运转的协作流程。
核心设计
先读代码库并形成 design/POV.md 与 design.md 设计契约，再固化类型、间距、颜色、圆角、阴影与动效约束；建立 backlog，每轮只做一个 surface，执行 brief → 设计参考 → 实现 → 截图评审 → 人工批评 → 修订。初始化只做一次，之后在 human gate 停止，把决策、复用模式、删除项和产品边界写回 design/。
关键洞察 核心是把会随 prompt 消失的设计品味转成可读取、可审计、可复用的资产。先打磨一个垂直切片作为参照，再向外系统化；新 Agent 通过文件恢复上下文，Git 记录每轮变化。
边界与风险 材料标注项目仍是 WIP，成效需持续迭代验证。流程依赖截图、人工审美和严格 session 边界，不能替代产品取舍；当前信息未给出完整文件格式、自动校验或真实改造案例，不宜把流程描述和安装数当成效果证明。