AI生成原型实测：一条指令生成9页APP原型图全过程

去年很多产品都在宣传一句话生成原型图、AI生成UI。我其实已经测试过一轮AI生成原型图的工具，当时的效果参差不齐。有些生成的界面非常“模板化”，一看就是东拼西凑的；有些页面结构看着还凑合，但UI视觉偏弱；还有些更偏UI视觉设计，对产品流程考虑得不多。
这几天整理收藏夹，把之前用过的一个工具又翻出来上手实测了一下，发现这小半年过去，AI在原型设计这块悄悄进了一大步。最大的变化是页面结构顺了很多，视觉也不像以前那种拼出来的感觉。而且以前只能单页单页蹦，现在能一口气连贯生成十几个页面，稳定性也有进步（虽然偶尔还是会抽风，出现界面不成形的情况）。
这次刚好测一下看看AI能不能一次生成一整套APP原型。下面是整个过程，算是个避坑与实操记录。
1. 文本指令输入

测试之前，我看到AI界面入口有展示的案例，能生成多个页面，所以这次实测就干脆奔着生成一整套APP去了。
不同AI工具对Prompt的解析路线不太一样。之前测FigmaMake的时候，感觉它对指令的精准度要求很高，你描述得越详细清晰，生成UI界面的效果才越好。而这次用的是原型为主的墨刀AI，它对指令的包容度感觉会更大一些，它内嵌了一个调研机制，会根据指令去搜索相关设计案例。所以指令不需要特别复杂，大白话就行。
我就随便丢了一句比较简单的话进去：

“请你设计出一套完整的AI宠物问诊APP界面，至少9个页面，有交互逻辑关系，设计风格简约温馨扁平化，所有页面展示在一个画板中。”
指令其实很随意，但也包含了几个关键信息：产品类型、页面数量、设计风格和最终呈现的页面布局。发出去之后，我其实也挺好奇它会怎么处理。

2. 指令分析（AI学会了反问）

但这里出现了个挺有意思的情况。没想到AI这次没有直接去搜索调研，反而把我这句简单的指令给拆解了。弹回来一个选项框，列了几个关键点让我二次确认：

• 核心的9个页面清单具体是什么？
  
• 页面之间的交互逻辑关系是哪种？
  
• 简约温馨扁平化的具体设计要求？
  
• 配色方案与核心视觉元素有没有要求？
  
• 所有页面放在同一画板的具体排版确认。
  这感觉很像在跟真实的交互设计师对需求。AI已经不像以前那种“盲生成”了，更像是在先理解需求。我就花了几分钟把准确的业务信息一一补充好发了回去。
  

3. 需求调研分析

我把具体需求发过去后，它的下一步动作是，在全网搜索目前“AI宠物问诊APP”的UI设计趋势和实际应用案例，抓取最新的信息。分析的过程其实还蛮仔细的，所以这部分有点耗时。
然后它根据搜集的这些信息，整理输出了一份“设计需求文档”。等于在动手画图前，它自己先用文字把逻辑跑通了一遍，待会儿生成页面时就按这个文档的需求来。

4. 生成完整原型界面

最后一步就到了真正出图的环节。AI根据上面那份详细需求，直接把9个完整的页面生成出来，而且也确实按我的要求在同一个画板中平铺展示。

可以看出来，整体页面的功能模块划分和视觉规范，基本都是贴合前面的需求的。另外，在核心的问诊路径上，比如从“发现症状”到“AI预诊”再到“人工专家接入”这个流程，它在画板上直接标注了交互跳转的连线。
说实话，我本来只是随便试试，结果第一版九张图整齐排出来的时候，我还放大看了看每个页面的细节，功能模块基本都对得上。后续如果需求有变，可以在这个基础上，保持原来的UI风格继续增加新页面。一般我会把它直接导出到原型设计文件里，再去逐一做细节调整，能节省一大部分画原型的时间。
一些实际体验感受：

这一轮用下来，AI在这块进步得挺快，能一口气生成多个页面或者成套原型。不过别指望它能帮你搞完，因为我试过脑子里已经有具体页面布局了，只是懒得画出来，但说不好AI生成的页面和预想的有差异，还需要花大把时间调整。
另外，AI生成的原型交互深度还是有很大限制的。目前简单的页面跳转还可以，但要想更复杂的组件状态切换或者条件触发等，还不太支持，导出之后也要重新手动添加。
这次真真实实体验过后，我觉得AI生成多页面原型图的效果，可以打个80分，毕竟我们现在需要的不是一个代替我们的AI，是一个能帮我们处理一些基础工作，提高设计速度的工具。

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！