前言

上一篇从 PRD 走到了网页实现：选择合适的 Skills，整理界面约定，再检查生成页面的视觉和功能。

但真正开始做页面时，还有一个更直接的问题：AI UI 工具这么多，到底该选哪一个？

过去做一个产品原型，往往要经过“需求文档 → 线框图 → 视觉稿 → 交互原型 → 前端代码”多个环节。现在，Google Stitch、Pixso AI、Figma Make、墨刀 AI、v0 和 Uizard 都可以用文字生成界面，有些还能继续生成代码、连接数据库并发布网站。

它们看起来很像，实际交付物却不同：Stitch、Pixso AI 和 Uizard 更偏设计与原型，Figma Make 连接设计与可运行产品，墨刀 AI 更贴近产品经理工作流，v0 则更偏代码与部署。

所以，选择前先问自己：最后需要的是一张可编辑设计稿、一个可演示原型，还是一套能继续开发的代码？这篇逐一介绍六款工具的功能、使用方式、价格、模型和自定义能力，最后再放到同一张表里比较。

本文价格与模型信息核查时间为 2026 年 10 月 28 日。AI 产品更新很快，实际方案、额度与地区可用性请以官方页面为准。文中的“可自定义模型”是指能否接入用户指定的第三方模型或 API Key，不只是切换平台预设模型。

一、Google Stitch：从一句话直接生成 UI 与前端代码

是什么？

Google Stitch 是 Google Labs 推出的实验性 AI 界面设计工具。它可以把自然语言、图片、草图或线框图转成 UI 设计与前端代码，并支持多轮对话修改、主题调整、多页面交互，以及将结果贴到 Figma 继续编辑。

与只生成“界面图片”的工具不同，Stitch 的目标是生成有结构的页面。设计完成后，可以继续建立可点击原型，或导出前端代码交给开发者。

为什么使用？

适合快速探索方向：同一需求可以快速生成多种版式、色彩与视觉风格。
降低设计到开发的落差：结果能进入 Figma，也能输出前端代码。
支持图片输入：可以把手绘草图、线框图或参考页面转成数字界面。
上手门槛低：不用先学习复杂的设计软件，产品、运营和独立开发者都能快速使用。

它更适合前期构思和原型验证，而不是直接取代成熟设计系统、完整后端或正式上线前的工程验收。

怎么使用？

使用 Google 账号登录 Stitch。
选择要制作 Web 或移动端界面。
输入产品类型、目标用户、页面内容、视觉风格和设备尺寸。
有草图或参考图时一并上传，减少 AI 猜测。
通过对话修改版面、文案、色彩或组件，也可以建立多个页面并连接交互。
完成后贴到 Figma 深化设计，或导出前端代码继续开发。

一条有效提示词可以这样写：

设计一个手机端个人记账 App 首页，面向刚工作的年轻用户。
首页包含本月收支、预算进度、最近交易和新增记账按钮。
使用温暖、简洁的视觉风格，重要金额需要高对比，并提供空状态。

价格怎么样？

截至本文核查日期，Stitch 仍属 Google Labs 实验产品，可免费使用，官方尚未公布正式付费分级。免费不代表无限使用，实际生成额度和功能可能根据账号、地区和产品实验调整。

支持什么模型？能否自定义？

Google 在 2025 年底宣布将 Gemini 3 引入 Stitch；早期版本则以 Gemini 2.5 Pro 的多模态能力为核心。产品内可能出现 Rapid、Thinking 或其他模式，但模型名称和可用功能会持续调整。

一般用户目前不能填入自己的 OpenAI、Anthropic 或其他模型 API Key，也不能自由部署自定义模型。换句话说，Stitch 可以使用 Google 提供的模型与模式，但不属于 BYOM（Bring Your Own Model）平台。

二、Pixso AI：设计、白板、原型与交付的一体化工作台

是什么？

Pixso AI 是整合在 Pixso 协同设计平台中的 AI 能力，覆盖设计文件、原型、白板和研发交付。它可以完成文生设计、智能排版、文案建议、设计系统建立、文生图、流程图与信息整理，也提供 D2C（设计转代码）和 C2D（代码转可编辑设计稿）能力。

Pixso 还有偏向从零生成网站的 Paico。两者都属于 Pixso 生态，但定位和 AI 点数相互独立，购买前要分清楚使用入口。

为什么使用？

中文与本土协作体验较完整：适合重视中文输入、国内存取和本地服务的团队。
工作流完整：从白板脑暴、UI 设计、交互原型到研发交付都能放在同一平台。
适合团队共创：设计师、产品经理和开发者可以按席位分工。
支持 D2C、C2D 与 MCP：方便将设计稿、代码和 AI 开发工具串起来。

怎么使用？

登录 Pixso，建立设计、原型或白板文件。
在顶部工具列开启 AI 助手。
用自然语言描述页面、流程或需要修改的区域。
让 AI 生成初稿后，在画布中手动调整，或继续用对话修改。
建立交互原型、共享给团队评审，再通过研发模式或 D2C 交付。

使用前最好先说清楚品牌色、组件规范、目标设备和页面状态。只输入“做一个电商首页”，通常只能得到通用模板。

价格怎么样？

Pixso 提供免费使用入口，团队版、企业版和私有化方案依席位与权益计价。AI 另采点数制，分为个人、团队与企业点数，三种点数不可互通；不同模型和任务会按实际 Token 消耗扣除点数。

官方价格页会同时展示不同席位的月付或年付价格，例如团队席位可见人民币 38 元或 68 元/月等档位，企业方案与私有化部署则需根据角色和需求确认。自 2026 年 6 月起，官网曾调整为主要提供年付订阅，因此采购时应直接查看即时价格页。

支持什么模型？能否自定义？

截至本文核查日期，Pixso 官方已宣布接入 DeepSeek V4 Pro 与 DeepSeek V4 Flash，由系统根据速度和任务复杂度进行调度。一般用户不需要，也不能自行填写模型 API Key。

普通方案没有公开的自定义底层模型入口。大型企业可以咨询私有化部署，但“可私有化”不等于一定可以任意替换模型，具体模型、数据隔离和部署方式需要在采购时确认。

三、Figma Make：把设计上下文变成可执行产品

是什么？

Figma Make 是 Figma 的 AI 原型与 Web App 建构工具。它可以根据文字提示、Figma 设计稿和设计系统生成可执行界面，并通过对话修改代码和交互。

现在的 Figma Make 不只做“能点击的展示稿”。它可以发布到公开网址，也能使用 Figma 托管的 Payload 后端，或连接 Supabase，加入数据存储、登录、文件和内容管理等能力。

为什么使用？

能直接利用 Figma 上下文：设计稿、组件、变数和团队设计系统都能成为生成依据。
从静态稿快速进入功能验证：适合制作高拟真原型、内部工具和小型 Web App。
协作链路短：设计、讨论、修改、分享和发布都留在 Figma 生态。
可连接后端与 MCP：比单纯的 UI 生成器更接近可运作产品。

怎么使用？

在 Figma 建立 Make 文件。
输入需求，或将现有 Figma 设计稿、组件和设计系统作为上下文。
通过对话要求 AI 增加页面、交互、响应式布局和数据状态。
在模型选择器中，按任务速度、质量与点数成本切换模型。
需要数据库或登录时，让 Make 建立 Payload 后端，或在设置中连接 Supabase。
测试完成后发布到 figma.site 网址；正式用途还要检查权限、安全、无障碍和跨设备表现。

如果要使用第三方服务金钥，应放进 Make 的环境变数设置，不要直接贴在聊天提示词中。

Figma Starter 免费方案提供有限使用和每月最高 500 AI credits。Professional Full seat 为 16 美元/月，含每月 3,000 credits；Organization Full seat 为 55 美元/月，含 3,500 credits；Enterprise Full seat 为 90 美元/月，含 4,250 credits。组织与企业方案通常按年计费。

Figma Make 在付费方案的 Full seat 中提供完整权益，其他席位和免费方案可以有限试用。实际消耗取决于模型、任务复杂度、对话历史和附加上下文，不能只用“一次生成多少点”估算成本。

支持什么模型？能否自定义？

Figma Make 会持续更新模型清单。核查时可选模型包括 GPT-5.6 Terra、GPT-6.1 Sol、Claude Sonnet 4.5、Claude Opus 5.5、Gemini 3.8 Flash、Gemini 4 Argon，另有会随时间调整的预设模型。不同模型的点数消耗可能差异很大。

用户可以在官方清单中切换模型，但目前没有面向一般用户的自有模型 API Key 或任意 BYOM 入口。Figma 支持自定义 MCP 连接器，代表模型可以读取外部工具与数据，但这不等于替换 Figma Make 的底层模型。

四、墨刀 AI：更贴近产品经理的原型智能体

是什么？

墨刀 AI 是面向产品设计全流程的 AI 助手。它除了能用文字、截图和草图生成可编辑原型，还提供 PRD 撰写、产品调研、方案评审和通用模式。

生成结果可以持续对话修改、同步到墨刀原型中拖拽编辑，也能输出 HTML/CSS。官方还提供 REST API 和远程 MCP，方便从 Claude Code、Codex 等工具调用原型、图片与文件生成能力。

为什么使用？

产品经理导向明确：不只画 UI，也能处理需求分析、PRD 和方案评审。
中文需求理解与模板较友好：适合国内产品和设计团队。
生成结果可继续编辑：AI 初稿可以进入墨刀原型工作流，而不是停留在一张图片。
可用 API 与 MCP 连接：能把原型生成接入 AI 编码工具和内部流程。

怎么使用？

登录墨刀 AI，选择通用、原型设计、方案撰写、产品调研或方案评审模式。
按任务需要选择快速、质量或旗舰模式。
输入需求，也可以上传草图、线框图或竞品截图。
通过多轮对话调整页面、文案和交互。
将结果导入墨刀原型进行可视化编辑、分享与评审，或取得 HTML/CSS 交给开发。

若要连接外部工作流，可以建立墨刀个人令牌，再使用官方 REST API 或远程 MCP。令牌等同账号凭证，不应放入公开文件、截图或 Git 仓库。

价格怎么样？

新用户可获得短期体验积分。墨刀 AI 采用动态积分制，成功完成的步骤才扣费，任务越复杂、执行越久或使用的模型档位越高，消耗越多。

官方页面显示基础 AI 积分包约 68 元/月，约可生成 20 次；年付通常有折扣，积分按月发放且每批有效期为 30 天。墨刀原型或超级会员与 AI 积分是不同权益，采购时要确认方案是否真的包含足够的 AI 额度。

支持什么模型？能否自定义？

墨刀主要以 快速、质量、旗舰等能力档位对外呈现，官方没有在产品页完整公开各档位的底层模型名称。付费方案可解锁高质量模型，但不能据此推断具体是哪一家模型。

一般用户不能填入自己的模型 API Key。墨刀提供的 API Token 和 MCP Token 是调用墨刀服务的身份凭证，不是自定义大模型密钥，两者不要混淆。

五、v0：偏向开发者的全端 AI 建构工具

是什么？

v0 是 Vercel 推出的 AI 应用建构工具，早期以“文字生成 React 与 Tailwind CSS 组件”闻名，现在已经扩展成可以读取图片和项目上下文、修改代码、连接数据库、同步 GitHub 并部署到 Vercel 的开发代理。

很多人仍把它称为“v0.dev”，目前官方主要使用 v0.app 网域。它的核心输出是可以执行和持续开发的应用，而不是传统设计工具中的向量图层。

为什么使用？

代码落地快：特别适合 React、Next.js、Tailwind CSS 和 Vercel 生态。
能从页面一路做到部署：生成、预览、修改、GitHub 同步和上线流程连贯。
适合开发者继续接手：可以直接检查和修改实际代码。
模型选择更开放：企业方案可以从 Vercel AI Gateway 目录加入更多模型。

如果团队最终交付物是 Figma 图层和完整设计系统，v0 不是最自然的主工具；如果目标是尽快得到可执行前端，它通常比纯设计生成器更直接。

怎么使用？

登录 v0，建立新聊天或项目。
描述技术栈、页面、数据、交互、响应式与错误状态。
上传截图或参考文件，让 v0 生成第一版应用。
在预览与 Design Mode 中检查界面，再通过对话或代码直接修改。
需要后端时连接数据库或外部服务。
同步 GitHub，经过人工审查和测试后部署到 Vercel。

不要把生成成功等同于可以直接上线。登录、付款、权限、数据迁移和敏感信息处理仍需要工程审查。

价格怎么样？

Free：0 美元，适合体验，通常有每日 7 则讯息限制。
Plus：30 美元/人/月，含每人每月 30 美元 credits，并提供每日登录额度和团队协作。
Business：100 美元/人/月，含每人每月 30 美元 credits，增加预设不训练等隐私能力。
Enterprise：定制报价，提供 SSO、RBAC、优先资源和进阶控管。

旧 Premium 方案正逐步停止向新用户提供。v0 根据模型 Token 消耗 credits，复杂项目的实际成本可能高于单纯订阅费。

支持什么模型？能否自定义？

v0 自有模型分为 v0 Mini、v0 Pro、v0 Max、v0 Max Fast，分别偏向低成本、平衡、最高能力和高速输出。

Enterprise 团队可以在模型选择器中加入 Vercel AI Gateway 目录的自定义模型，并调整推理强度或 Fast Mode；是否开放由团队拥有者控制。这是六款工具中自定义模型能力较明确的一款，但它主要是在官方 Gateway 目录中选择，并不等于可以上传任意模型权重。Vercel AI Gateway 另支持付费层 BYOK，实际能否在 v0 工作区使用仍要依企业设置确认。

六、Uizard：让非设计师也能快速完成原型

是什么？

Uizard 是一款低门槛 AI UI 设计和原型工具。它的 Autodesigner 可以从文字生成多页面、可编辑的产品设计，也能把截图、手绘线框和草图转成数字界面。

Uizard 内建拖拽编辑器、模板、组件、交互和分享能力，定位更接近“人人都能使用的 UI 设计工具”，而不是专业前端 IDE。

为什么使用？

适合非设计背景用户：产品、创业者、学生和业务都能快速生成可展示原型。
草图数字化方便：可以扫描手绘线框或参考页面，再转成可编辑组件。
原型速度快：适合工作坊、提案、用户访谈和早期概念验证。
内建协作与交付：可以共享原型，付费方案提供 React/CSS 开发交付。

它的优势是简单和快速；如果需要大型设计系统、精细向量编辑或正式产品代码，仍要搭配其他工具。

怎么使用？

建立项目，选择从空白、模板或 Autodesigner 开始。
描述产品、目标设备、用户、主要页面和风格。
也可以上传截图、线框图或手绘草图。
在拖拽编辑器中调整组件、文字、色彩和页面跳转。
以交互原型分享给团队或受访者；需要时再导出图片、PDF 或进行开发交付。

价格怎么样？

Free：0 美元，每月 3 次 AI generations，最多 2 个项目。
Pro：年付折算 12 美元/Creator/月，或月付 19 美元，含每月 500 次 AI generations。
Business：年付 39 美元/Creator/月，含每月 5,000 次 generations、品牌套件和优先支持。
Enterprise：定制报价，提供不限 generations、设计系统设置和企业服务。

Uizard 按 Creator 席位收费，免费查看者不等于付费 Creator。团队估算成本时要同时计算席位数与 AI 使用量。

支持什么模型？能否自定义？

免费方案使用 Autodesigner 1.5，Pro、Business 与 Enterprise 使用 Autodesigner 2.0。这是 Uizard 自有的产品化 AI 引擎名称，官方没有对外列出其所有底层基础模型。

Uizard 支持自定义品牌套件、图示、字型和企业设计系统，但这些是设计内容自定义，不是模型自定义。一般用户不能接入自己的模型或 API Key。

七、AI工具对比

核心能力对比

工具	核心定位	主要输入	主要输出	可编辑设计稿	代码能力	后端/部署	最适合谁
Google Stitch	AI UI 探索与设计转代码	文字、图片、草图	UI、原型、前端代码、Figma	支持贴到 Figma	强，偏前端	后端需另接；可进入其他开发流程	想快速探索 UI 的设计师、产品与独立开发者
Pixso AI	一体化协同设计平台	文字、设计档、白板内容	设计稿、原型、白板、D2C	强	中到强，支持 D2C/C2D	以设计交付为主	中文产品、设计及研发团队
Figma Make	设计上下文驱动的 Web App 生成	文字、Figma 设计与系统	可执行原型、Web App	与 Figma 生态深度整合	强	支持 Payload、Supabase 与发布	已使用 Figma 的成熟团队
墨刀 AI	产品经理 AI 智能体	文字、截图、草图	PRD、调研、可编辑原型、HTML	强，可导入墨刀原型	中到强	可通过 API/MCP 连接	产品经理与国内产品团队
v0	AI 全端开发代理	文字、图片、代码库	React/Next.js 应用	以视觉模式和代码编辑为主	很强	GitHub、数据库、Vercel 部署	前端、全端开发者与技术型创业者
Uizard	低门槛 AI UI 与原型	文字、截图、手绘线框	可编辑 UI、交互原型	强	中，付费方案可交付 React/CSS	以原型分享为主	非设计师、学生、创业者与工作坊

价格、模型与自定义能力对比

工具	免费使用	主要付费方式	公开模型/引擎	可切换官方模型	可接入自有模型
Google Stitch	有，实验阶段免费	尚未公布正式付费方案	Gemini 3；早期为 Gemini 2.5 Pro	根据产品模式而定	否
Pixso AI	有免费入口	席位订阅 + AI 点数	DeepSeek V4 Pro、V4 Flash	主要由系统调度	一般方案否；私有化需咨询
Figma Make	有限试用，Starter 有 AI credits	席位订阅 + AI credits	GPT、Claude、Gemini 多款模型	是	否；自定义 MCP 不等于自定义模型
墨刀 AI	有短期体验积分	订阅/积分包，按实际消耗	官方以快速、质量、旗舰档位呈现	可切换能力模式	否
v0	有，每日消息数受限	席位订阅 + Token credits	v0 Mini、Pro、Max、Max Fast	是	Enterprise 可加入 Gateway 模型，支持受控 BYOK
Uizard	有，每月 3 次生成	Creator 席位 + 每月 generations	Autodesigner 1.5/2.0	根据方案固定	否

按场景怎么选？

想免费快速把灵感变成 UI：先试 Google Stitch。
团队重视中文协同设计与研发交付：选 Pixso AI。
已有 Figma 设计系统，希望做高拟真或带后端的原型：选 Figma Make。
工作核心是 PRD、产品调研和可编辑原型：选墨刀 AI。
最终目标是 React/Next.js 代码与快速部署：选 v0。
不懂设计，只想快速做出可展示、可访谈的原型：选 Uizard。

实际工作中不一定六选一。例如可以先用 Stitch 探索视觉方向，在 Figma 完善设计系统，再用 v0 实现；国内团队也可以在墨刀完成需求和原型，再通过 MCP 将内容交给 AI 编码工具。

八、其它AI工具介绍

九、总结

这六款工具虽然都能生成界面，但真正的分界不在“谁画得最好看”，而在于你希望 AI 把工作推进到哪一步：

Google Stitch 擅长快速生成与探索 UI；
Pixso AI 强调中文协同设计和完整交付链路；
Figma Make 善于利用成熟设计上下文建立可执行产品；
墨刀 AI 更懂产品经理的文件、调研与原型流程；
v0 直接面向代码、GitHub 和部署；
Uizard 则把原型设计门槛降到最低。

选型时至少要看五件事：最终交付物、现有工作流、团队角色、数据安全和长期成本。AI 可以大幅缩短从想法到第一版的时间，但生成结果仍要经过需求确认、设计评审、代码审查、安全测试和真实用户验证。

工具真正的价值，不是替你跳过所有专业环节，而是让团队更早看到可操作的成果，把时间留给更重要的判断。

6 款 AI UI 工具怎么选？🎨 从idea到原型到设计搞到可执行产品