2026年Cursor+Claude3.7实现从原型到app开发

Cursor+Claude3.7实现从原型到app开发p 最近在 X 上看到了一些人在用 Claude 3 7 Sonnet 生成 app 原型图的尝试 受到启发 发现这么先生成不同界面的原型图再让 Cursor 基于原型图开发 app 会是很好的尝试 尤其是 你也可以不两步直接生成 而是在过程中更可视化地思考你要生产的原型 p

大家好,我是讯享网,很高兴认识大家。这里提供最前沿的Ai技术和互联网信息。



 <p>最近在X上看到了一些人在用Claude 3.7 Sonnet生成 app原型图的尝试&#xff0c;受到启发&#xff0c;发现这么先生成不同界面的原型图再让Cursor基于原型图开发app会是很好的尝试。尤其是&#xff0c;你也可以不两步直接生成&#xff0c;而是在过程中更可视化地思考你要生产的原型&#xff0c;这对于非专业的产品经理来说&#xff0c;会是好得多的方式。</p> 

GPT plus 代充 只需 145

我今天做了些尝试后,效果让我感到惊艳。这里给大家介绍下具体的操作方式。

可以参考我的提示词,修改其中的要求。

讯享网

这里有三个关键点:

  1. 选择Claude 3.7 Sonnet模型,不建议thinking,thinking思维链比较慢;
  2. 选择composer normal模式,或者说0.46版本中editor模式,不要选择agent,不要选择agent!agent模式对代码长度有限制;
  3. 由于一次性生成的html代码文件会太长,中间可能会截断或创建失败,你可以点击生成失败的代码文件,cursor会提醒你是否创建文件,然后把已经生成的一部分代码复制到新创建的文件中;接着,@对应代码文件,要求cursor继续补全文件。

然后,打开补全完成的html,你就获得了类似下面的整个app所有主要界面的原型图👇

用Xcode创建一个新项目,然后在Cursor中打开项目的根目录(Xcode是一个IOS应用开发软件,不知道怎么使用的可以网上搜索了解了,其他类似安卓,或者得其他应用开发,思路也是一样的)

在Cursor打开的iOS app开发项目根目录中发送上面得到的app原型图,然后要求:

 
   

这一步依然有三个关键点:

  1. 选择Claude 3.7 Sonnet模型,thinking或非thinking都可以试试
  2. 选择agent模式,必须选择agent!
  3. 这个过程中不断accept生成的代码文件就好了,创建完成后如果在Xcode调试出现bug,可以把xcode的报错提示复制回cursor,修bug场景建议使用thinking模型。

我这次测试过程中,两个步骤分别出现了一次cursor生成出错和一次Xcode报错,其他都一切顺利,得到的结果远超我的预期了。

甚至,这个app大部分功能都已经是可以正常操作,逻辑正常的。

这个两步生成app的策略其实都离不开Claude 3.7的能力,核心用到了两点:

  1. Claude 3.7生成原型的能力惊人
  2. Cursor agent模式+Claude 3.7基于原型图多步骤完成任务能力惊人

下面是其他一些原型图

以上只是演示了一个APP开发过程,其实最主要表述的是原型的开发,这一步就可以秒掉大多数基础的视觉交互设计师和前端开发工作了。只要你有产品思维,表达你想做的软件解决的是什么业务问题,需要实现的是什么样的功能就行了。

不管是APP开发、还是小程序开发,或者一个网站的开发实现,使用Cursor可以快速的实现你需要的原型,Cursor非常适合这样的工作,而且实现的界面非常标准化,配色、排版都是很到位。

当然,一个软件系统的实现并不只是一个原型就够了,如果要实现完整的功能,需要更好的项目管理和维护,这部分可以查看Cursor高级使用的一些软技术能,比如整体结构设计、项目阶段管理、规则和约束、外部工具使用,具体可以这看这》》。


小讯
上一篇 2026-03-10 10:30
下一篇 2026-03-10 10:32

相关推荐

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请联系我们,一经查实,本站将立刻删除。
如需转载请保留出处:https://51itzy.com/kjqy/210929.html