想象一下，不雇6名设计师，而是6个AI代理同时在你眼前设计界面。一个负责布局，另一个挑选字体，再另一个放置组件 — 这一切都在一个画布上实时发生。
这是什么？
Pencil是由AI驱动的基于MCP（Machine-Centered Protocol）的设计画布。由Tom Krcha创建，他是连续创业者，共同创立了被Miro收购的视频通话应用Around和被Google收购的Alter虚拟形象。
Pencil特别之处在于设计文件（.pen）就是JSON。像代码一样用Git进行版本管理，创建分支进行合并，AI代理可以直接读写。Figma做设计→交付给开发者→理解有偏差再修改的那个循环？Pencil将这整个流程消除。
这次公开的SWARM模式是核心。最多6个AI设计代理在一个画布上同时工作。可以看到各自的光标，可以用眼睛观察画面实时被填充的过程。Tom将此称为"自主设计机构"。
有什么变化？
现在AI设计工具最大的问题是单线程。1个提示词→1个结果→不满意再来1个提示词。SWARM模式打破了这个瓶颈。
| 传统AI设计工具 | Pencil SWARM | |
|---|---|---|
| 工作方式 | 1个提示词 → 1个结果 | 1个提示词 → 6个代理并行 |
| 设计文件格式 | 专有格式（黑盒） | .pen = JSON（Git兼容） |
| 代码转换 | 设计→交付→编码 | 设计 = 代码（一步完成） |
| IDE集成 | 独立应用 | Cursor·VSCode·Claude Code内置 |
| 实时反馈 | 查看结果后修改 | 实时观察代理光标 |
Peter Yang（Behind the Craft）实际演示了用SWARM模式设计旅行应用，他描述6个代理同时各自创建不同界面的过程是"重塑大脑"的体验。
特别重要的是Pencil正在创造"氛围设计（vibe designing）"这个新品类。Cursor开启了氛围编程，Pencil正在打开氛围设计的大门。Tom本人也说是因为用Cursor时用文字描述UI太痛苦，才开始了Pencil的原型。
MCP（Machine-Centered Protocol）是让AI代理能直接操控外部工具的协议。Pencil的MCP服务器让AI可以直接在画布上添加框架、插入组件、应用样式、整理布局。不只是读取，连写入权限也完全开放，这是Pencil的差异化优势。
如何开始
Pencil目前是免费的。开始只需5分钟。
- 下载Pencil桌面应用
pencil.dev/downloads支持Mac、Windows、Linux全平台。安装后立即打开无限画布。 - 连接AI代理
在设置→Agents & MCP中将Claude Code、Cursor、VSCode中所需的工具切换为ON。在Mac上会自动检测。Claude Code的话在终端输入/mcp确认连接。 - 用SWARM模式生成第一个设计
添加AI模型（推荐Claude）→SWARM模式ON→输入类似"Design a travel app with booking flow"的提示词。观察代理们实时填充界面。 - 用设计套件提升质量
使用Shadcn UI、Lunaris、Halo等内置设计系统，AI会用这些组件进行设计。能产出没有"AI感"的专业结果。 - 转换为代码
设计满意后，用claude 'Generate HTML/CSS/React based on the design in app.pen'直接转换代码。.pen文件是JSON，所以AI能完全理解结构。
Pencil是2026年1月发布的新工具。与Figma相比手动编辑功能不足，设计修改后的代码自动同步（双向同步）还不支持。不像Lovable或V0那样修改UI代码会立即改变，需要修改后再次向AI请求。最好将其作为初期原型设计和创意探索的强力工具来接近。
想深入了解
用50分钟深度展示6个AI代理实时设计旅行应用的过程。从内部运作原理（.pen = JSON）到Cursor集成和代码转换。
从环境设置到仪表盘生成、多页网站设计、代码转换，可以分步骤跟随的教程。
从设计师角度率直分析Pencil的界面、Prompt Block、UI Kit及局限性。
