design.md:2026年的设计系统新原语
文章指出在2026年,项目中最重要的设计文件不再是 Figma 库,而是位于代码仓库根目录下的 design.md。文章解释了随着 Claude Code、Cursor 等 AI 编程工具的普及,通过 Markdown 文件定义视觉规则(如 Token、布局、组件样式)已成为让 AI 生成符合品牌 UI 的最佳实践。文中提供了 design.md 的标准五段式骨架,并详细说明了如何通过颜色、排版、组件和可访问性规则来约束 AI 生成结果。
文章指出在2026年,项目中最重要的设计文件不再是 Figma 库,而是位于代码仓库根目录下的 design.md。文章解释了随着 Claude Code、Cursor 等 AI 编程工具的普及,通过 Markdown 文件定义视觉规则(如 Token、布局、组件样式)已成为让 AI 生成符合品牌 UI 的最佳实践。文中提供了 design.md 的标准五段式骨架,并详细说明了如何通过颜色、排版、组件和可访问性规则来约束 AI 生成结果。
文章提供了具体、可操作的design.md编写指南,结合2026年AI编码工具趋势,观点新颖且时效性强,结构清晰,信息密度高。
文章指出了利用 AI 编写前端界面时风格单一、提示词难以精确描述的问题。作者推荐了 'Awesome Design Skills' 合集,该合集包含 67 套设计系统技能文件,涵盖毛玻璃、极简等多种风格。用户只需一条命令即可引入这些规范,适配 Claude Code 等工具,从而让 AI 按照既定标准生成界面,极大提升了开发效率和风格的可控性。
文章介绍了一个名为 UI UX Pro Max 的项目,它通过为 AI 编程助手内置包含 161 条行业规则、67 种风格和 161 套配色的大型设计推理引擎,解决了 AI 写前端代码“功能强但审美差”的痛点。安装该 Skill 后,AI 能根据产品类型自动匹配专业的设计系统、风格、字体及色彩方案,并自动进行反模式检查,支持 React、Vue、SwiftUI 等 13 种技术栈。
程序员鱼皮开源的《Vibe Coding 零基础入门教程》9个月内 GitHub 突破 2 万 Star,内容从几十篇扩充到 170 篇,并被豆包等 AI 平台推荐。教程覆盖基础入门、AI 编程工具(Cursor、Codex、Claude Code 等)、模型实测横评、近 30 套项目实战、经验技巧、产品变现和编程学习资源,还包含 18 篇 OpenClaw 保姆级教程。文章介绍了教程结构、适合人群、学习路线及近 3 个月的更新内容,同时推广配套的 B 站霸榜视频课程,强调教程完全免费开源并将持续更新。
文章探讨编码智能体架构的演进:单会话聊天窗口已无法承载日益庞大的智能体任务。作者总结了六大新兴架构模式,重点阐述三种:主智能体正在转变为编排者,通过委派子智能体完成工作(如 OpenAI Agents API、Cursor Projects、GitHub Copilot、Gemini CLI);子智能体作为临时隔离的工作单元,可在独立沙盒或 worktree 中运行,随需启停;工作状态正从智能体会话中迁移到外部系统(Git、知识库、共享记忆等),使工作可以超越单个会话的生命周期。文章认为更大系统而非单个会话正在决定智能体智能的运用方式。
本文深度拆解 Lauren 的 pstack 第二篇,探讨如何让 AI Coding Agent 在写代码前正确理解问题。文章介绍了 /how、/why、/teach、/recall 等上下文工具的用法,强调用代码而非文档来规划:先写使用教程倒推架构,通过低成本原型比较不同方案,用 /architect 让多模型并行设计并交叉评审,以及在多阶段计划中要求每一步都以可复查的证据结束。作者认为,Agent 可能比人更快更强,但最终是否接受方案仍需人来判断,验证应从开发前就开始参与决策。
程序员鱼皮在收到B站100万粉丝奖牌后,整理了征集到的40多个热门问题的完整文字版回答。内容涵盖9个部分:自己的编程启蒙经历、日常使用的AI编程工具(Cursor、Codex、Claude Code等)、Vibe Coding时代如何提升编程能力、给学生和求职者的建议、如何坚持编程之路、创业历程与公司经营情况等。文章传递了拥抱AI编程趋势、多动手实践、持续学习适应变化的核心理念。
作者基于3年超过2000小时的AI编程经验,分享其截至2026年Q3的完整Agentic Engineering工具配置。包括:界面工具(bb、cmux、Ghostty、Herdr、Corral);模型与订阅的性价比方案(OpenCode Go、ChatGPT、Claude Code、Cursor等组合,强调订阅优于API计价);云端Agent趋势(引用Cursor合并PR中云Agent占比从10%升至60%),并推荐自建VPS+Herdr避免生态锁定;以及语音输入提速、Pi Agent等harness工具。核心观点是追求以最少花费获得最多token,并追踪多Agent状态管理。
本文介绍如何利用Claude Code在半天内构建出代理机构收费8000-12000美元的营销网站。作者指出,默认提示词只会生成模板化网站,关键在于通过安装设计技能(如frontend-design和ui-ux-pro-max)、参考顶尖设计网站截图、使用结构化提示词,以及进行三轮精细打磨(排版、间距、动效)来达到专业水准。文章还提供了部署到Cloudflare Pages的步骤,并强调通过迭代不断提升网站质量。
文章指出使用 AI 直接编写网页往往导致设计模板化、缺乏质感,并介绍了 5 个用于提升网页设计水平的 Skills(taste-design, web-design, emilkowalski, magicslide, Design MD Collection)。文章提供了一个完整的工作流:从确定设计规范和参考,到生成代码及 UI 抛光,帮助独立开发者消除“AI 味”,打造高保真的产品页面。
文章指出,使用 Codex Skills 不应像逛插件商店一样盲目安装,而应围绕核心工作流进行选择。作者推荐了三个安装阶段:第一阶段优先安装前端设计类(如 frontend-design)和浏览器验收类 Skill,以实现从“写页面”到“审页面”的闭环;第二阶段安装研究类(如 last30days)和内容类 Skill,用于产出高质量长文;第三阶段按需补全 Figma 和销售类 Skill。此外,作者建议通过自定义 AGENTS.md 来固化工作流程,提升 Agent 的执行稳定性。
作者作为非技术人员,详述了利用 Claude Code 在两天内构建并部署一个内容日历 Web 应用的全过程。文章总结了五个关键教训:使用 Plan Mode 先规划、分阶段构建功能、利用 CLAUDE.md 约束规范、使用截图优化设计反馈,以及克服对部署的恐惧。
本文针对使用 Claude Code、Cursor 等 AI 工具进行“氛围编程”时屡屡碰壁的用户,总结了 20 条实战规则。文章将规则分为规划与构建两个阶段,核心建议包括:先在 Plan Mode 明确需求、用截图而非文字描述视觉需求、确定技术栈、每次只专注单一功能以及频繁进行 Git 提交。作者强调,Vibe Coding 的核心不在于工具本身,而在于用户是否学会了如何清晰地向 AI 表达意图。