QUOTE
AI 设计工具正在从生成一张图,转向接管一条可编辑、可交付、可被 Agent 接力的设计工作流。
— OpenPencil 项目主图
OpenPencil 值得看,原因在于它不是在传统设计工具旁边加一个聊天框,而是把画布、文件格式、MCP、CLI、并发 Agent Team 和代码导出放进同一个工作区。设计资产不再只是图片,而是 Agent 可以读取、修改、接力和导出的工程对象。
它的定位很清楚:开源 AI-native 矢量设计工具,支持 Concurrent Agent Teams、Design-as-Code、内置 MCP Server,并且可以把自然语言 prompt 直接写入实时无限画布。项目当前在 GitHub 有约4.5k Star,主语言是 Rust,采用 MIT License。
01
Prompt 到实时画布
02
MCP 与 CLI 自动化
03
Rust 重写后的工程价值
01
WORKFLOW
它真正想替代的不是画图,而是断裂的设计链路
很多 AI 设计产品的问题是:生成效果看起来很炫,但产物很快断在一张静态图里。用户还要手动重画、重排、转代码、进 Git,Agent 也很难继续接手。
OpenPencil 想解决的是这条断裂链路:用户用自然语言描述页面,Orchestrator 按空间结构拆任务,多个 Agent 并行处理 Hero、Feature、Footer 等区域,生成过程流式写入无限画布,最后再进入多端代码导出。
— OpenPencil 功能架构图
「真正的变化在于:AI 不再只负责出一版效果,而是进入设计资产的生命周期。」
CANVAS
核心能力:Prompt 直接进入画布
第二层能力是并发 Agent Team。它不是让一个模型从头写到尾,而是由 Orchestrator 按空间结构拆分任务,再让多个 Agent 同时处理不同区域。这对复杂落地页、后台界面和多模块页面尤其关键。
第三层能力是模型能力适配。OpenPencil 会根据模型层级自动调整 prompt、thinking mode 和 timeout:强模型拿完整提示和 thinking,标准模型关闭 thinking,小模型则使用更简化的嵌套 JSON prompt 来提高稳定性。
— OpenPencil 工作流程图
03MCP AND CLI
让设计被 Agent 接管
CLI 工具op则承担终端侧自动化入口。它既可以接收文件,也可以接收 stdin,还支持 batch design DSL。这让需求文档、Agent 编排、设计画布和代码导出之间不再完全靠人工复制粘贴。
op start
op start --headless --file design.op
op design @landing.txt
op import:figma design.fig
cat design.dsl | op design -
PRODUCT SURFACE
不只画布:设计系统、代码导出和 Git 集成
画布层:无限画布、缩放、智能对齐、吸附、图形、文字、Frame、布尔运算、图标和多页文档。
设计系统层:设计变量、多个主题轴、组件系统、CSS sync、可复用 UIKits 和.pen文件导入导出。
工程层:PNG、JPEG、WEBP、PDF 导出,以及 React、HTML、Vue、Svelte、Flutter、SwiftUI、Jetpack Compose、React Native 等代码目标。
协作层:clone wizard、分支、pull/push、merge、冲突面板、内联 JSON 编辑和三方 diff。
RUST CORE
为什么要重写成 Rust
— OpenPencil Rust 重写价值图
55.5 MB
桌面端单二进制
2.18 MB
Web gzip 体积
重写后的收益包括:桌面端不再捆绑浏览器引擎和 Node runtime,10,000-node live canvas 在嵌套 auto-layout 场景中可以写入、读取和快照布局,空闲 CPU 接近 0%;一次热路径修复还把 wheel-zoom CPU 从约 69% 降到接近 0%。
更重要的是,编辑器状态、渲染、MCP、CLI、AI providers、codegen、Figma import 和 Git integration 都在同一个 Rust workspace 中。对 AI-native 设计工具来说,这种一套核心跑多端的结构,比单纯把 Electron 换成 Rust 更关键。
一个 Rust workspace 承担产品主体
PROJECT STRUCTURE
核心在crates/:包括编辑器核心、UI、native host、web host、CLI、MCP、AI、orchestrator、codegen、Figma parser 和 Git integration。
RENDERING
渲染上,native 端使用skia-safe,浏览器端使用 CanvasKit WASM/WebGL2,UI 框架是 pure-Rust GPU-Skia UI frameworkjian。
ECOSYSTEM
它在 ZSeven-W 工具族里的位置
— ZSeven-W AI-native 工具族
INSTALL
安装和开发入口
brew tap zseven-w/openpencil
brew install --cask openpencil
brew install zseven-w/openpencil/op
bash scripts/start-web-rust.sh
cargo run -p op-host-desktop
OpenPencil 更适合正在把 AI 引入设计与前端协作流程的团队,也适合想把设计资产纳入 Git、MCP 和 Agent 工作流的开发者。
∞
THE END
画布正在变成 Agent 的工作环境
如果这个方向跑通,未来的 UI 设计工具可能不再只是视觉稿编辑器,而会变成 Agent 的设计执行环境:需求进来,Agent 拆任务,上画布,用户审改,代码导出,Git 接管。
END
来源链接:https://github.com/ZSeven-W/openpencil
我是山行AI,持续关注 AI 工具链、Agent 工程和开源项目。如果你觉得今天这篇有收获,欢迎点赞、在看、转发三连,我们下篇见。
