问题
使用开源设计工具 Penpot 的团队卡在两个断点上:一是设计师积累了大量 Sketch 文件,"a number of Sketch files that I would like to move to Penpot",但 Penpot 不支持 Sketch 导入,换工具意味着历史资产作废;二是设计师在 Penpot 里完成设计后,"Developers have to create in their own versions like HTML or Flutter",开发人员只能照着设计稿手工重写界面,没有像 Figma 那样的导出能力。两条 GitHub issue 分别积累 18 和 11 条评论,说明这是 Penpot 社区持续多年(2021 至 2022)仍未解决的真实摩擦,但痛点强度不高(pain 2-3)。
目标用户
两类人:正在或打算从 Sketch / Figma 迁移到开源 Penpot 的设计师(常出于成本或开源偏好,多为中小团队与独立设计者);以及使用 Penpot 的团队里需要把设计落地为 HTML/Flutter 的前端开发者。市场规模定性判断:Penpot 是开源新生态,用户基数远小于 Figma,但迁移诉求集中在社区内,触达成本低。
解决方案
- Sketch → Penpot 批量导入:解析 .sketch 文件,将画板、图层、文本与矢量图形转换为 Penpot 项目,保留基本结构与命名。
- Penpot → HTML 导出:选中画板一键导出为独立 HTML+CSS 文件,布局用 flex/grid 语义化还原,而非整图切片。
- 差异报告:导入后生成一份映射报告,标出哪些图层/效果无法完美转换,减少用户排查成本。
- AI 的角色:利用视觉模型对比转换前后的渲染截图,自动检测丢失或错位的元素;对导出的 HTML 做结构清理与命名规范化。
为什么是现在
信号显示 Penpot 作为开源替代品正在吸引 Sketch/Figma 用户迁移,而其互操作生态仍是空白——这两个请求从 2021 年挂到 2022 年仍未被官方解决,正是第三方工具切入的窗口期。
MVP 范围
第一版只做两件事:1) 解析 .sketch 文件并把画板、图层、文本样式转换为 Penpot 可导入的格式;2) 对单个 Penpot 画板导出为语义化的静态 HTML+CSS 页面。不做组件逻辑绑定、不做响应式断点推断、不做 Flutter 导出(列为后续路线)、不内置设计编辑器。可以以 Penpot 插件 / 开源 CLI 的形式发布,先验证使用量再考虑产品化。
风险
- 平台依赖风险(最高):产品完全寄生在 Penpot 和 Sketch 的文件格式上,Penpot 官方一旦实现 Sketch 导入或 HTML 导出(这两个都是其 issue 区的高票请求),产品即失去存在理由。
- 格式风险:Sketch 文件格式非公开标准,版本变动可能导致解析器频繁失效。
- 变现风险:目标用户是开源工具社区,付费意愿证据为零,更适合做开源项目引流而非直接收费。
- 质量风险:设计稿到代码的转换天然有损耗,输出质量不够好时用户会退回手工重写。
已有产品
信号证据
这张卡片依据的原始讨论。摘录保持原文,点“原文”查看上下文。
GitHub Issues · penpot/penpot10月31日功能请求▲ 1311 条评论
“Currently as our UI designers are creating the projects again the Developers have to create in their own versions like HTML or Flutter or any other”
UI designers create projects in Penpot, but developers then have to recreate them manually in HTML, Flutter or other formats because there is no export to HTML.原文
GitHub Issues · penpot/penpot4月16日功能请求▲ 1918 条评论
“As I currently work with Sketch, I have a number of Sketch files that I would like to move to Penpot in the future.”
I currently work with Sketch and have a number of Sketch files that I would like to move to Penpot in the future.原文