作者开源了 RICOUI DESIGN，一个基于 DESIGN.md 的设计系统工作台。DESIGN.md 是一种结构化 Markdown 文档，集中记录品牌的颜色、字体、间距、组件规则与设计约束，人和 AI 都能读取。工作台支持创建、编辑、预览 DESIGN.md，浏览内置品牌设计参考库，可通过 AI 从公开网站生成初稿，并将文档派生为 Design Tokens、CSS 和 ZIP 供前端与 AI 工具使用。文章详细介绍了 DESIGN.md 的结构约定、从品牌参考到自有设计库的使用流程、AI 生成与安全边界、派生检查机制及云端存储方案，强调以 DESIGN.md 作为唯一源文件维护设计规范。
文章介绍为编码 Agent 构建设计系统的实践：由于仓库中存在多个版本的相同控件，Agent 会复制混乱并放大问题。作者正在开发 design.how，提供可安装、可直接交给 Agent 使用的设计系统与六个免费 Skill：build-design-system 从现有应用构建语义 token、规范组件与校验规则；migrate-design-system 用多 Agent 协作迁移全应用并设置预算；token-mapping 按用途映射设计值；component-docs 生成组件文档；design-review 检查截图无法覆盖的交互状态。每个 Skill 附带 TESTS.md 与适配提示，可替换为团队自定义规则。
文章以 Atlassian 与 Vercel 的实践案例为切入点，探讨 AI Agent 在产品设计任务中的上下文工程问题。对比实验显示，单一 design.md 文件在原型生成等轻量场景中表现出色，但在真实工程环境中会导致 token 消耗激增、耗时更长且不稳定。文章提出以代码库访问权限为分岔点的两条路径：仓库外的轻量三层支撑体系与仓库内的完整工程 Harness。随后系统阐述了设计上下文的五层架构——意图层、真源层、披露层、约束层和反馈层，并详细说明搭建流程：建立评估基线、编写最小意图文件、沉淀结构化真源等，强调机械可判定规则应交由工具链执行，语言模型只处理模糊判断。
文章探讨 AI 生成中文页面排版难看的根本原因：不是审美问题，而是语言结构问题。作者指出 AI 默认的 CSS 参数（负字距、1.4 行高、Inter 字体栈）都是为拉丁文设计的，而汉字等宽、信息密度高、可用的层级手段少，与字母排版从根上不同。文章分析了标题过长、断行不当、细字重浅灰、照搬多列网格等常见症状，并给出可直接使用的排版处方：正文 16–18px、行高 1.75–2.0、字距为 0、一行 30–45 字、字体栈首位用 PingFang SC，以及给 AI 修改中文排版的速查表。
文章介绍 Vercel 如何用 design.md 文件、CSS 样式表和评测闭环，解决 AI Agent 生成页面总「差一点」、需要反复人工修整的问题。核心方法是把工作拆成三层：design.md 写设计判断（读者、信息层级、拒绝的套路），CSS 承接字号、间距、表格等机械性版式约束且不占模型上下文，评测闭环把每次返工转化为可复查的规则。作者强调规则要从模糊感觉翻译成可观察动作，如「别丑」改为「表格全宽」。测试显示公开场景下机械故障从 91 次降到 39 次，约少 57%。建议从一类高频产物入手，把高频修改沉淀为规则，逐步减少返工。
文章探讨 AI 做设计时“形似神不似”的问题，指出症结在于设计背后的“为什么”没有被写进 AI 可读的上下文。作者拆解了多家硅谷大厂的实践：Vercel 通过 200 多轮评估循环筛选规则，用 design.md 使视觉错误减少 57%；Google 开源了 Stitch 的 DESIGN.md 规范；Atlassian 实测发现 DESIGN.md 适合原型和定制场景，生产环境用 MCP 更省更准；Anthropic 的 Claude Design 则反向从代码库自动提取设计系统。社区还把 60+ 大厂风格反向工程成 design.md。文章认为设计系统正被 AI 重写，并给出五条落地建议。
本文面向非计算机专业的 Vibe Coding 爱好者，整理了 12 个前端网页基础术语，包括 Frontend、HTML、CSS、Markdown、Component、State、DOM、Title Tag、Page Metadata、Favicon、Open Graph 和 Web App Manifest。每个术语都配有通俗解释、图示和可直接复制给 AI 的指令示例，帮助读者在与 AI 协作时更精准地描述需求、定位问题，提升开发效率。
文章介绍了 tldraw 作为一个可编程的 React 无限画布 SDK 的强大功能。除了基础的白板功能，它支持将 React 组件转化为画布形状、构建可视化的工作流自动化、集成 AI 视觉交互、实现多人实时协作以及作为持久化应用数据存储。tldraw 适用于构建各种空间软件，从架构图到 AI Agent 管道。
介绍了开源技能库 emilkowalski/skills，它能为 AI 编程 Agent 注入设计品味，解决 AI 生成 UI 动画和交互时缺乏质感的问题。文章详解了其核心功能、安装方法、实操流程，并对比了 Taste-Skill、Hallmark 等类似工具的差异。
年初制作了一套提示词，可自动生成文字海报。近期在 Claude Code 中开发了网页版编辑器，支持上传 Markdown 文本生成图文混排的悬浮框，并提供截图功能，灵活且节省 token，已开源。
本文介绍了 WeSight 的正式开源，这是一款开源桌面 AI Agent 控制台。它整合了 Claude Code、Codex、Hermes 等多种 Agent 引擎，通过可视化工作台实现了对本地 Agent 的统一调度、模型管理和运行监控。WeSight 支持 Agent 团队协作、IM 通道绑定（如飞书）、技能管理及桌面宠物等创新功能，旨在降低多 Agent 协作门槛，让开发者专注于创意本身。
作者通过对比传统设计书籍与 GPT2 的教学效率，整理了 100 套关于构图与布局的视觉方案。文章重点介绍了如何利用这些方案优化 AI 绘画提示词，以提升海报设计和排版的实战效果。同时，作者开源了相关的 Chrome 插件 xPoster，支持批量上传 Markdown 到 X 平台，并分享了包含 100 种布局示例的 GitHub 项目下载链接。
文章宣布正式开源 AI 工具 html-anything。该工具历时 3 天开发，包含 1.5 万行代码，旨在解决 AI Agent 输出 HTML 设计差的问题。它内置 75 套技能模板，支持 18 种主流代码 Agent CLI（如 Claude Code、Cursor 等）的自动探测与会话复用，实现零 API Key 成本。同时支持 Markdown、数据及图像等 11 种文件格式转换，并可一键发布至社交媒体或导出高 DPI 图片。
