千万别手动画原型!Cursor用AI 3分钟完成3天工作量

引言:天下产品苦原型久已

想象下,当你挑灯夜战做出了一套原型,结果领导直接来了一句还可以,再出两套对比下,你是不是得疯。

但当我一个完全不懂产品的技术尝试用AI来画原型,结果产品绷不住了,他三天的成果,我三分钟搞定,还能出好几套,关键是原型效果拉满,这会画原型和不会画的看了都得沉默。

今天就给大家分享下如何通过Cursor免费快速的设计原型。点击关注回复【原型提示词】获取文中提示词全文。

一、需求分析整理

不管是手动,还是AI画原型,需求分析阶段是绕不开的。当然我们也可以通过AI辅助分析需求,形成结构化的文档。

也可以一句话让Cursor帮我们生成原型,但是这种效果不可控。在实际工作中,需求分析完后,会有完整的需求文档,我们就可以基于此文档让Cursor帮我进行原型创作。

这里以“小药箱” 产品为例,我们让DeepSeek帮我们整理了一份需求说明

我需要开发一个小药箱微信小程序,请你参考腾讯小药箱帮我整理一份需求文档

在和DeepSeek对话过程中,我们需要扮演甲方角色,而DeepSeek是产品经理的角色,通过多次沟通反复打磨形成最终满意的需求文档。

智能药箱助手微信小程序需求文档一、产品概述目标用户:慢性病患者/术后康复人群/家庭健康管理者核心价值:通过智能用药管理+家庭健康协作,降低错误用药风险,提升家庭健康管理效率二、核心功能模块1. 智能药品管理扫码建档:支持中国药品电子监管码扫码录入手动录入:提供药品名称联想(对接CFDA数据库)有效期预警:提前30天/15天/7天三级预警存量监测:剩余药量百分比提醒(支持药片计数模式)2. 用药提醒系统多时段提醒:支持每日多次用药计划智能跳过:遇用药冲突时自动调整提醒时间服药确认:双重确认机制(滑动确认+拍照记录)紧急联系人:三次未确认自动通知紧急联系人3. 家庭健康协作成员管理:创建家庭群组(最多支持8人)权限分级:管理员:完整权限协助者:查看+提醒观察者:仅查看用药日志:可视化时间轴(含用药记录照片)4. 医药知识库药品百科:适应症/禁忌/不良反应查询交互检测:自动检测当前药品组合风险附近药房:LBS定位+线上购药入口应急指南:药物过敏/误服紧急处理方案5. 健康数据中心用药统计:周/月依从率分析健康趋势:关联智能设备数据(需用户授权)报告生成:可导出PDF用药记录

二、Cursor安装及使用

访问官网下载软件:https://www.cursor.com/cn

Cursor 是一款备受瞩目的 AI 编程工具,它集成了强大的 AI 技术,致力于为开发者提供智能代码生成、错误修复、代码优化等多项功能,能显著提升编程效率和代码质量。该工具支持多种主流编程语言,如 Python、Java、JavaScript 等,无论是后端开发、前端开发还是数据科学等领域的编程工作,它都能满足需求。

图片

Cursor 还连接了多种先进的 AI 模型,如 OpenAI 的 GPT - 4o、Claude 3.7等,关键还提供免费次数使用,一般用户需求足够了。

下载完后直接安装,因为我已经安装过,这一步跳过,安装完成后打开软件即可。

图片

点击右上角齿轮旁边的菜单,唤起对话框,选择COMPOSER(不要选错了,CHAT模式虽然也能生成但是它不会自动创建文件)。将前面封装好的需求描述,整合到提示词中。然后直接回车等待即可。


点击关注回复【原型提示词】获取文中提示词全文。

图片

由于tokens的限制,Cursor不一定会一次性生成完整,我们需要检查,然后发现缺失的原型图,让它继续生成。

三、成果演示

等所有页面创建后,我们找到存放原型图的文件夹,双击index.html,通过浏览器打开,就能看到下面的效果。如果对原型图不满意,我们还可以通过与Cursor对话,来进行调整,让其重新生成。

图片

炸裂吗,喝杯水的功夫,活干完了。现在回头想想,当你埋头苦干时,别人已经干完活回家鸡娃了。

四、结语

都是牛马为何如此优秀,区别就在于善用AI。

当然,一般情况下到这里就可以交付前端开发了,但是我知道大家都不是一般人,所以我们还有高阶使用通过Figma进行编辑,这个下一篇会介绍。

产品真正的价值不在于原型设计,而是需求的理解和产品思维,所有的设计都是来着产品的灵感,而AI仅仅是工具而已。

通过AI辅助原型设计,让产品有更多精力聚焦业务,打磨出更多优秀的产品,这样才能提升产职场竞争力。

关注我,赠送DeepSeek 从入门到精通全套资料,以及AI破局三天实战营,连续三天硬核直播。有素人做AI副业从0到百万的案例,有AI数字人口播带货、AI代写带货等热门项目。直接领卡即可免费参加。

### 使用Cursor工具进行原型设计或绘制线框图的最佳实践 #### 了解Cursor的特点和优势 Cursor是一款专为快速创建线框图和低保真原型而设计的工具。它提供了简洁易用的操作界面,支持多种绘图功能,能够帮助设计师迅速实现创意并迭代设计方案。 #### 设置清晰的目标 在开始使用Cursor之前,定义具体的设计目标非常重要[^2]。这有助于确保所创建的每一个元素都服务于整体用户体验,并且可以有效评估最终成果的质量和技术可行性。 #### 掌握基本操作技巧 熟悉Cursor中的常用快捷键能极大提升工作效率。例如,“Ctrl+C/V/X”用于复制/粘贴/剪切;“Shift+拖动”保持对象比例不变;“Alt+点击”测量距离等。掌握这些基础技能可以让整个过程更加流畅自然。 #### 利用组件库加速开发流程 利用预设好的UI控件(按钮、输入框等),可以直接从侧边栏拖拽到布上,减少动调整的时间成本。同时也可以自定义保存常用的组合模块作为模板反复调用。 #### 注重细节处理 尽管是早期的概念验证阶段,但仍需关注一些重要的视觉层次关系——比如字体大小对比度设置合理与否会影响阅读体验;间距安排得当才能让页面看起来整洁有序而不显拥挤杂乱无章。 ```python # Python代码仅作示意用途,实际Cursor不涉及此类编程逻辑 def draw_rectangle(x, y, width, height): """绘制矩形""" cursor.draw('rect', {'x': x, 'y': y, 'width': width, 'height': height}) draw_rectangle(50, 50, 200, 100) ```
评论 11
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值