在设计到开发的整个链路里,“页面从哪里来”一直是一个被反复讨论的问题。有人从设计稿开始,有人从原型开始,而现在,我发现还有一种方式 —— 从 AI 开始。这也是我做 deeppage 的初衷:能更快地把想法转成可以落地的页面,同时也让设计稿标注不再成为协作中的阻碍。目前平台主要提供两类核心能力:
✦ 第一类:通过 AI 直接生成前端页面
这是这次更新里我最想重点分享的能力。


1.1 支持纯文本 & 文本 + 参考图,生成 PC 或移动端页面
你可以用一句描述(甚至一句模糊的想法),直接生成:PC 端、移动端页面,既适合快速产出Demo,也适合做结构探索。
1.2 面向开发者:支持 HTML 与 Vue 3 代码导出
生成的页面不仅能预览,也能直接导出成:纯 HTML / Vue 3 代码
这意味着它不只是“展示用页面”,你可以直接把代码拉走集成进项目,或继续二次开发。
对于前端来说,是一个能省下大量初期搭建时间的工具。
1.3 面向设计师:快速生成页面并转换为标注
设计师常需要把思路变成页面,再转成标注交接给开发。
现在可以直接:用文字生成页面,在线一键转为标注,交接效率会比传统流程更快,适合快速做视觉探索、结构草稿、甚至某些情况下替代部分重复性制作。
1.4 面向产品经理:把草图、想法快速变成可视化页面
产品经理可以用它完成:原型“美化”,将需求描述直接转成页面,让想法更容易被团队理解,减少来回沟通,对于需要快速确认方向的团队,这能显著压缩沟通成本。
✦ 第二类:Sketch 插件导出标注(线上 + 本地双模式)

除了 AI 页面生成,我也补齐了设计师交接的关键环节:标注导出。
2.1 导出到线上平台(推荐)

你可以把 Sketch 标注导出到线上平台: https://deeppage.cn
通过在线平台,可以解决传统标注工具的多个痛点:
- 规避“本地标注不同步”问题
- 标注更新自动实时覆盖,无需每次重新发文件
- 提供在线切图压缩,前端直接取用
- 更方便分享与协作
- 支持团队管理、文件管理和权限控制
对于多人协作团队,这几项都非常关键。
2.2 导出到本地(为私密场景与兼容性而准备)

仍有不少团队需要本地导出,如:
- 有保密要求的项目(不允许上传外网)
- 现有流程依赖本地文件
- 正在从 sketch-measure 迁移
- sketch-measure 已不维护且对 Sketch 2025 兼容差
因此我保留并加强了本地导出能力,确保:完全离线、兼容 Sketch 2025、适配已有导出工作流。
✦ 最后
希望通过 AI 页面生成 + 标注导出这两类能力,让设计、前端和产品之间的协作更自然,效率更高。
欢迎来试用、给我反馈,让这个工具继续向更实用的方向走:https://deeppage.cn/home
