1. 考前准备真限时,别裸考连着三周每天都在赶需求,结果周五下午临时接到通知,周一上午有个AI产品原型马拉松,四个人一组,四个小时,用AI工具从零做一个能拿去见客户的产品原型。第一反应是想拒绝,第二反应是也行,正好把手头这些AI生成原型的野路子系统性验证一遍。先说结论:四个小时能不能做出来一个像样的产品原型?能,但前提是别把它当成一场“AI神笔马良”表演,而是要当成一个“有限时间内的高效交付”项目来打。AI在这里更像一个效率放大器,帮我把传统的4-5天原型周期压缩到半天级别。为什么这件事值得聊聊?因为大多数人对AI做原型的认知还停留在“挺神奇的”这一步,但实际工作中真正的问题是:需求还是那个模糊的需求,评审还是那个抠细节的评审,只是交付时限被压缩到了极致。你需要一种能够应对这种极端情况的工作流,而不是零散地用几个AI工具瞎试。这场的规则如下:八个原型方向任意选,比如智能客服面板、数据监控大屏、移动端健康管理应用等。我选的是“智能客服工作台”,因为这块业务画起来信息密度高,组件复用性强,AI生成的页面结构不容易显得空。手里能用什么工具?Figma的AI插件、即时设计里的智能生成能力、或者直接在ChatGPT/Claude里生成HTML再转成图片。为了速度,我决定用“对话生成手动微调”的组合路数:先让AI帮我重构页面结构,再让它生成组件代码和说明,最后在Figma里快速拼装。结果证明,这个策略是对的。但真正拉开差距的不是生成瞬间的爽感,而是考前那半小时的思考和准备。我做了三件事:第一,把原型的方向、目标用户、核心需求关键词写在纸上,作为所有提示词的“全局上下文”;第二,把可能用到的组件清单列出来,比如导航栏、数据表格、卡片、统计指标、图表类型、弹窗状态;第三,背了几套适用于不同生成场景的提示词模板。这三件事让我后面的四个小时节省了至少一个半小时。因为提示词工程的核心逻辑不是“会写漂亮话”,而是“能不能一次把话说清楚,让模型少犯错,让自己少改稿”。只要上下文给足、约束给满、输出格式固定下来,AI生成的东西基本都在可用范围内。2. 第一个小时:需求拆解和信息架构定稿2.1 把模糊需求压成一张可执行的卡片所有的原型项目最怕的不是功能多,而是功能散。智能客服工作台如果只是把聊天窗口、工单列表、知识库按钮堆在一起,那做出来的东西就是一个“啥都有,啥都不专业”的半成品。AI生成页面也怕这个,因为它会把你的需求理解得特别贪心,一旦提示词里写了“做一个完整的客服工作台”,它就会开始自由发挥,给你塞进去十几个模块。前一个小时我主要干的是做减法。先把“智能客服工作台”的核心用户画像简化成三个:一线客服专员、客服组长、运营管理者。然后给每个角色定义他们在这个工作台里最高频的三个操作场景。客服专员最常做的是查客户信息、回消息、转工单;组长最常做的是看坐席状态、审核升级会话;运营管理者最常做的是看满意度趋势、看热点问题分类、看高峰时段分布。这三个角色的诉求汇总以后,工作台的核心信息架构就浮现出来了:左侧导航:工作台、会话列表、工单中心、知识库、数据报表主区域上部:当前会话详情,包含用户信息、历史订单、标签主区域下部:快捷回复推荐、智能填单建议、知识库推荐条目右侧面板:坐席实时状态、团队在线人数、今日满意度这个架构我用了大概十五分钟手工梳理完,然后开始写第一组提示词,直接让AI按这个结构帮我完善细节和校验遗漏。2.2 第一次让AI参与,不是生成页面而是出问答清单大部分人用AI做原型的第一反应是“让AI直接给我画页面”,但成熟的做法是分步走:先让AI帮你把信息架构做压力测试,再让它出页面。因为页面是结果,信息架构是原因,原因错了,结果再漂亮也要推翻重来。我的第一组提示词是这样的:你是一名资深产品设计师,正在设计一个智能客服工作台。已经确定的目标用户包括:一线客服专员、客服组长、运营管理者。请基于这些角色,对以下信息架构提出可能出现的问题和缺失模块,不要直接重写架构,只以问答清单的形式输出: - 左侧导航:工作台、会话列表、工单中心、知识库、数据报表 - 主区域上部:当前会话详情 - 主区域下部:快捷回复、智能建议 - 右侧面板:坐席状态、团队数据 要求: 1. 站在三类角色视角分别提出模块疑问 2. 列出每个模块最关键的3个交互状态(如空状态、加载状态、异常状态) 3. 指出架构中可能的功能冲突点这组提示词有个隐藏技巧:我用了“不要直接重写架构,只以问答清单形式输出”。这其实是提示词设计里的一个经典方法,先限制输出范围,防止AI跑偏。它不会因为觉得某个模块该删就顺手帮你改了,而是老老实实做审查。反馈质量出乎意料。它指出了几个我漏想的点:客服专员在会话中需要“客户历史咨询摘要”,否则每次都要手动翻记录;组长需要“实时服务质量抽查”快捷入口,而不是只看坐席状态;运营管理者对“热点问题趋势图”的需求比“满意度数值”更迫切,因为后者是结果指标,前者才能指导行动。这几条直接让我把信息架构从六级导航压缩成五级,把“历史咨询摘要”确定为会话主区域的固定组件。这个环节的结论,直接决定了后面AI生成页面的质量上限。2.3 定稿信息架构,输出给所有AI工具的统一上下文信息架构一旦定稿,我马上做了一件事:把它压缩成一个上下文字符串,后续所有提示词里都带上它。这不是形式主义,而是为了让AI在多次对话中保持记忆一致性。【全局上下文】智能客服工作台,面向一线客服、组长、运营管理者。核心模块: 1. 工作台:今日接待量、平均响应时长、满意度、待处理工单 2. 会话列表:进行中、已结束、需转接、异常会话 3. 工单中心:待分配、处理中、已解决、已升级 4. 知识库:热门条目、搜索入口、分类目录 5. 数据报表:满意度趋势、坐席绩效、热点问题TOP10 设计风格:现代简约、信息密度适中、优先保障业务效率这段上下文我会放到每个提示词的第一行,让AI不管在生成页面结构还是组件说明时,都不会脱离这个设定。有人觉得这样写提示词很啰嗦,但我实测下来,带上下文的生成结果和不带上下文的结果,在可用性上差距极大。不带的话,AI经常会在一次长对话里自己发明一个新模块,或者把导航结构悄悄改了,后期校对成本高得吓人。3. 中间两个小时:分模块生成、逐屏拼装3.1 主工作台页面:提示词里加约束比加形容词更管用信息架构定了之后,我第二个小时主要精力放在生成核心页面。核心页面就是工作台首页,也叫“坐席工作台”,它是客服专员打开系统后看到的第一个界面,直接决定了这个原型的“专业感”能不能立住。这时候的提示词策略跟第一阶段完全不同,第一阶段要的是“AI指出问题”,这个阶段要的是“AI给出结果”,所以要走“具体场景明确结构格式约束可执行输出”这种工程化提示词。【全局上下文】同上 请生成智能客服工作台首页的页面结构描述,要求: 1. 顶部导航:系统名称、全局搜索、通知、用户头像 2. 左侧菜单:5个主要模块,图标文字 3. 主内容区:用栅格方式描述,左侧60%为会话列表,右侧40%为当前会话详情 4. 会话详情中要包含:用户信息卡片、历史咨询摘要、最近订单记录、对话内容气泡 5. 页面右下角要有智能推荐浮窗,展示AI建议的快捷回复 输出格式: - 每个区域用一个表格描述,包含:区域名、位置、组件类型、内容说明 - 表格后附一段设计说明,解释这个布局如何提升坐席效率这组提示词有几个关键点:第一,明确用“6:4栅格”来锁定布局,不让AI自由发挥;第二,要求“表格描述”而不是段落描述,这能让输出信息密度更高;第三,最后要求“设计说明”,这看起来像是多了工作量,但实际是让AI在生成时优先考虑业务效率而定下的逻辑约束,输出内容会更自洽。生成结果里,AI在会话气泡下面自动加了一个“客户情绪倾向”标签,用颜色区分积极、中性、消极。这个细节我压根没提,但AI基于“智能客服工作台”的业务常识自动脑补出来的,而且加的位置很合理。这就是为什么建议让AI参与组件设计而不是只做排版工具,它能帮你补全你自己都没想到的业务细节。3.2 数据报表页面:别让AI直接“画图表”而是“描述图表”数据报表页是这个项目里最容易被忽视、但最可能翻车的部分。为什么?因为AI在文本对话里生成图表描述很容易,但如果你期望它直接输出一个可用的可视化代码或者漂亮的图表截图,大概率会失望。四小时场景下,根本没有时间调试一个生成式图表的颜色和布局。我的做法是让AI生成图表的数据结构和布局描述,然后用Figma自带的可视化插件或者手动拼图表组件来实现。提示词如下:【全局上下文】同上 请为数据报表模块设计一个页面,核心展示: 1. 今日概览:四张指标卡,分别是接待量、平均响应时间、满意度、工单积压量 2. 近7日满意度趋势:使用折线图 3. 热点问题TOP10:使用横向条形图,数值从高到低排列 4. 坐席绩效对比:使用表格进度条的组合方式 要求: - 每个图表区域必须说明数据来源和更新频率 - 指标卡需要定义正常值范围和预警阈值 - 页面布局要求信息清晰、适合投屏演示这个提示词有意思的地方在于“指标卡必须定义预警阈值”。我加这个要求是因为原型做完之后要拿去应付评审,如果只是静态截图,评委一定会问“如果满意度暴跌怎么展示?”。有阈值就有讨论空间,这个原型就有了“可讲故事”的深度。AI输出内容里,它把满意度预警阈值设定在“低于85%时卡片变红,同时旁边出现优先改进建议文案”。这里我用了一个快速微调,把“变红”改成“卡片右上角显示警示图标颜色渐变到浅红”,因为大面积的红色块在大屏上很容易造成视觉压迫感。这是一个纯审美层面的调整,AI不懂这种细节,需要人来兜底。3.3 移动端页面:用同一个上下文生成多端适配数据报表搞定之后,距离结束还有大约两个小时,我决定追加一个移动端页面。别觉得这是给自己加戏,现在很多产品原型的要求都要覆盖手机端,哪怕只是示意图,有横跨PC和Mobile的展示能力会明显提高方案完整度。移动端的提示词我做了三件事的调整:第一,布局约束从栅格改成了“单列瀑布式”;第二,组件密度降低,每个屏只保留1-2个核心操作;第三,手势交互提示让AI补全,比如左滑出现快捷操作、长按进入编辑模式。【全局上下文】同上 请为智能客服工作台设计手机端页面,目标用户为一线客服专员,场景是“离开工位时快速处理一条客户消息”。要求: 1. 首页为会话列表,每条会话展示:客户名、最新消息摘要、未读状态、等待时长 2. 点击进入会话详情页,聊天内容下沉到底部,顶部展示客户信息摘要 3. 底部固定操作栏三个按钮:快捷回复、转工单、结束会话 4. 支持左滑会话出现“标记已读”和“置顶”操作 输出格式:按页面逐个描述,每个页面包含布局说明、组件清单、交互说明、异常状态处理。说实话,移动端这一轮生成的完成度比PC端高,因为AI见过了太多移动端的聊天类页面模板,结果它把快捷回复、转工单这些按钮放在底部固定栏时,还主动附带了一个“快捷回复按钮长按时可预览全部模板”的交互细节,这不算是复杂的创新,但对原型演示来说很够用了。3.4 组件与状态设计:提示词里要求补全空状态和异常状态到这里,原型的主要页面骨架已经立住了,但一个职业产品设计师不会止步于此。原型评审中最容易被挑战的问题永远是:空状态长什么样?加载失败怎么办?没有数据时用户能看到什么?大多数AI生成的页面描述都会默认“数据丰满、一切顺利”,这是我们要人为反向补全的地方。所以我专门设计了一组针对状态设计的提示词,这是整场比赛中性价比最高的一组。【全局上下文】同上 请为以下三个场景各设计一个异常状态页面: 1. 会话列表为空:客服专员刚登录,还没有任何客户发起会话 2. 热点问题TOP10无数据:数据报表模块尚未采集到足够数据 3. 会话加载失败:网络异常导致当前会话内容无法刷新 要求: - 每个状态页面包含:插画或图形描述、主文案、辅助说明文案、操作按钮建议 - 文案语气要符合客服工作台的专业调性,不能卖萌 - 操作按钮要具备业务含义,不能是笼统的“重试”这里我刻意要求“操作按钮不能是笼统的重试”,因为这是个非常常见的设计偷懒点。AI给我的结果:会话列表为空时建议主按钮是“查看知识库开始准备工作”,这个思路很好,它把空状态从“没事干”引导成了“预学习”;会话加载失败时建议按钮是“切换至离线模式”,这个也合理,因为客服场景下网络波动频繁,离线模式本身就是真实需求。这四个页面的状态设计补全,让我在最后评审阶段几乎没有收到“这个情况你考虑过吗”之类的突然袭击。所有状态都准备好截图或标注,随时能调出来应对提问。4. 最后的收尾复盘:踩坑、时间分配和效率心法4.1 全程最大的坑:提示词里写了“完整”两个字,结果生成了一堆废料第二个小时刚开始的时候,我心急了一点,在第一版提示词里写了“请完整生成一个智能客服工作台的页面原型描述”。这四个小时里,这是最大的一次失误,没有之一。AI拿到“完整”这个指令后会怎么应对?把能想到的全部都塞给你,从登录页到帮助中心,从角色权限管理到操作日志,一口气给你列了十四个模块,页面信息严重超载,有些模块之间还有功能重叠。而且它还会自己发明一个“智能质检评分”模块,虽然听起来酷,但没有实际业务规则支撑,放在原型里反而会被评委追问到崩溃。这个问题背后的逻辑很简单。提示词工程里,“完整”只是一个模糊的、面向范围的词,而不是一个面向约束的词。AI无法自主判断“完整”的边界,它只会把它理解成“尽可能多”。所以正确做法就是我在信息架构阶段做的那样,先在prompt里把模块范围锁死,再让AI生成。你看我这四小时里真正高效的提示词,没有一个是让AI自由发挥的,全部都有结构、有约束、有格式。还有一个容易忽略的小坑:提示词越长,AI输出的响应越长,处理时间越久。在四小时赛程里,如果每次生成都要等两分钟,那么十次生成就浪费二十分钟。我后来把提示词做了压缩,把背景信息收敛到一行,把目标收敛到三点以内,把输出格式收敛到表格或列表。质量没降,速度明显提升。4.2 时间到底怎么分配才合理:4小时的隐形节奏表对外说起来是“四小时做完一个原型”,但实际上手你会发现,真正用来和AI对话的时间可能只有两个小时,其他时间都花在思考、拼装、检查、微调上。我把自己的时间分配列在这里,给你们一个参考:时间段内容产出前30分钟需求梳理、角色分析、信息架构初步搭建一页纸的需求卡片30-60分钟用AI校验信息架构,补齐模块和状态修订后的信息架构清单60-120分钟生成PC端核心页面:工作台首页、会话详情、数据报表三个页面的完整布局与说明120-150分钟生成状态组件和异常页面空状态、加载失败等四套方案150-180分钟补做移动端页面移动端聊天流程两条180-240分钟检查整体逻辑、调整视觉一致性、准备演示话术可直接演示的原型包这个节奏最关键的转折点在第60分钟。如果到了这个时间点你还在反复改信息架构,那后面基本就崩了。因为AI生成页面虽然快,但每轮对话都需要一到三分钟,如果架构没定就反复重生成,时间和心情都消耗不起。四小时比赛本质上不是“谁对AI玩得最溜”,而是“谁能在最短时间内完成决策”。4.3 工具组合怎么选:纯对话式生成比“AI直接出图”更适合考试场景出发前我纠结过要不要用Figma里面那堆AI生成插件。后来我放弃了,原因很简单:插件生成的质量波动太大,而且高度依赖模板库,冷门组件表现极其不稳定。在四小时的高压场景下,最稳的方案反而最实用:用ChatGPT或Claude做结构化设计对话,先把页面布局、组件、交互用文本定下来,再花少量时间在即时设计或者Figma里快速拖拽拼装。这套流程的好处有两个。一是文字描述天然适合评委评审,每一页都有设计说明,讲起来不费劲。二是可以随时回滚。如果发现某一页AI给的方案不对,我可以回到文本框里修改组件名或者位置顺序,拼命重生成,而不用在画板里一点点调整图层。说白了,这是个纪律问题。AI设计工具再怎么花哨,输出的永远只是素材和方案,真正的信息架构决策和视觉决策还得靠人。谁把这个边界想清楚,谁就能在四小时里稳定输出。4.4 一张可以带走的验收清单:演示前必查的5个关键点最后一步,我把这套方法总结成了一张验收清单,以后再做同类原型时直接照着过。分享给你:所有核心页面是否有明确的“用户角色对应”:是给客服专员看的还是给组长看的,页面上的信息权重对吗?每个模块是否有“异常状态说明”:空状态、加载失败、数据异常,至少要有一种状态设计,不能只有理想状态导航切换是否有“业务闭环”:比如会话页面里能发起转工单,那工单中心的数据就得能对应上演示故事线是否清晰:挑一条最重要的用户路径讲完,不要贪多AI生成内容是否做了人工去重:导航、按钮、模块名不能重复出现,同一术语全文要保持一致这个清单帮我规避了很多低级的逻辑漏洞。AI生成的模块叫“工单处理”,在另一页里叫“工单中心”,这看起来是小问题,但评审会抓住不放,最后只能现场改字,影响整体节奏。4.5 效率心法:AI产出的是初稿,人才是终稿这四个小时里我用得最顺的提示词,其实是心态层面的一句话:AI从来不是用来替你思考的,它是用来帮你把思考结果快速变成可讨论的东西。有了思维上的准确定位,提示词工程就会从“玄学”变成纯粹的工程方法:上下文替它立边界,约束让它别跑偏,格式让结果可复用。最后给准备尝试这类“限时AI产品原型挑战”的朋友一条建议:赛前别急着研究工具的高级玩法,先花一小时想清楚你的业务、角色和核心流程。如果你连自己的需求都讲不明白,给AI再多的提示词也只是浪费它的时间和你的电费。真正能让你在四个小时内交出完整原型的,永远是你对业务的理解力和决策的速度。