全自动设计神器曝光！一个提示词让Claude 4狂生3000行代码，iOS界面秒出（提示词来了！）

全自动设计神器曝光！一个提示词让Claude 4狂生3000行代码，iOS界面秒出（提示词来了！） 全自动设计神器曝光！一个提示词让Claude 4狂生3000行代码，iOS界面秒出（提示词来了！） Modified June 20, 2025 注意：使用Curosr+Claude 4 Sonnet（不是thinking模型） 如何使用这个提示词？ 使用方法超级简单： 1. 新建一个文件夹（用来存放生成的设计文件） 2. 用Cursor打开这个文件夹 3. 选择Agent模式，选择 Claude 4 Sonnet 模型（注意：不是Thinking模型） 4. 输入上面的提示词，回车 稍等片刻，下面给大家演示一下！ 开发流程实战演示 输入完提示词，Cursor会很快给你几个问题，让你确认： 这一步是需要你来告诉这个万能的提示词，你希望做什么样的产品！ 拿我们前面的"给你码"来举例，我输入的产品描述是： Code block Plain Text 做一个产品叫：给你码，现在很多AI应用都需要邀请码，然后产品蝗虫们都找不到但又想用邀请码，所以可以开发一个邀请码共享平台，这样AI应用可以来这里发布邀请码，用户也可以发布自己的邀请码，风格要酷炫一些，其他的你作为资深AI产品经理帮我补充 接着，Cursor会继续追问细节： 你可以详细描述需求，也可以像我这样简单说说，让AI发挥创意： Code block Plain Text AI应用可以选择三个：纳米AI搜索，Lovart，天工SkyWork作为示例，你可以使用搜索获取这三个产品的信息，其他的你看着办 然后Claude会开始输出， 一次生成3000行代码都没问题 ！是的，Claude 3.7大约只能输出1000行，而Claude 4的代码输出能力有了质的飞跃。我们静候佳音就好，它会完成整体的输出： 这里我们中断了一下，预防模型输出太长，只需要输入"继续"两个字，接着会一直到整个UI稿输出完毕： 最后，打开生成的UI.html文件，就能看到本文开头展示的那些精美界面了！ Claude 4到底哪里更强了？ 其实这个直出设计稿的提示词，在3月份就完成了，那会用Claude 3.7也能出整套设计稿，但效果不够稳定。一直拖到Claude 4发布，我才重新调整了提示词。 经过40多版提示词的调试，才达到现在相对稳定的效果。从个人体验来说，我觉得Claude 4 Sonnet的 审美能力并没有显著增强 ，但 代码输出能力有了几倍的提升 ！最直观的感受是： 1. 每次可以输出3000行以上的代码 ，而且几乎不出错 2. 代码质量更高 ，生成的HTML/CSS更加规范和优化 3. 指令理解更精准 ，能更好地遵循UI设计规范 有趣的是，同一套提示词用Claude 4 Sonnet Thinking模型反而容易出各种bug，所以这里强烈建议用Claude 4 Sonnet模型。 结语 通过Claude 4一键生成iOS设计，我们看到了AI在设计领域的巨大潜力。它不仅大大提高了设计效率，还能保证设计质量，是产品开发过程中的强大助手。 这个提示词的成功，也证明了提示词工程的价值。通过精心设计的提示词，我们可以引导AI生成符合预期的高质量内容，实现从创意到成品的快速转化。 好了，今天的分享就到这里。如果你想看高考祈福App的提示词，以及继续查看更多有关这个提示词的设计流程，欢迎打开咱们AI编程蓝皮书查看： 你们有没有用AI做过设计？效果如何？欢迎在评论区分享你的经验！ 我是AI产品黄叔，我们下期再见！ 注意：使用Curosr+Claude 4 Sonnet（不是thinking模型） 如何使用这个提示词？ 使用方法超级简单： 1. 新建一个文件夹（用来存放生成的设计文件） 2. 用Cursor打开这个文件夹 3. 选择Agent模式，选择 Claude 4 Sonnet 模型（注意：不是Thinking模型） 4. 输入上面的提示词，回车 稍等片刻，下面给大家演示一下！ 开发流程实战演示 输入完提示词，Cursor会很快给你几个问题，让你确认： 这一步是需要你来告诉这个万能的提示词，你希望做什么样的产品！ 拿我们前面的"给你码"来举例，我输入的产品描述是： 接着，Cursor会继续追问细节： 你可以详细描述需求，也可以像我这样简单说说，让AI发挥创意： 然后Claude会开始输出， 一次生成3000行代码都没问题 ！是的，Claude 3.7大约只能输出1000行，而Claude 4的代码输出能力有了质的飞跃。我们静候佳音就好，它会完成整体的输出： 这里我们中断了一下，预防模型输出太长，只需要输入"继续"两个字，接着会一直到整个UI稿输出完毕： 最后，打开生成的UI.html文件，就能看到本文开头展示的那些精美界面了！ Claude 4到底哪里更强了？ 其实这个直出设计稿的提示词，在3月份就完成了，那会用Claude 3.7也能出整套设计稿，但效果不够稳定。一直拖到Claude 4发布，我才重新调整了提示词。 经过40多版提示词的调试，才达到现在相对稳定的效果。从个人体验来说，我觉得Claude 4 Sonnet的 审美能力并没有显著增强 ，但 代码输出能力有了几倍的提升 ！最直观的感受是： 1. 每次可以输出3000行以上的代码 ，而且几乎不出错 2. 代码质量更高 ，生成的HTML/CSS更加规范和优化 3. 指令理解更精准 ，能更好地遵循UI设计规范 有趣的是，同一套提示词用Claude 4 Sonnet Thinking模型反而容易出各种bug，所以这里强烈建议用Claude 4 Sonnet模型。 结语 通过Claude 4一键生成iOS设计，我们看到了AI在设计领域的巨大潜力。它不仅大大提高了设计效率，还能保证设计质量，是产品开发过程中的强大助手。 这个提示词的成功，也证明了提示词工程的价值。通过精心设计的提示词，我们可以引导AI生成符合预期的高质量内容，实现从创意到成品的快速转化。 好了，今天的分享就到这里。如果你想看高考祈福App的提示词，以及继续查看更多有关这个提示词的设计流程，欢迎打开咱们AI编程蓝皮书查看： 你们有没有用AI做过设计？效果如何？欢迎在评论区分享你的经验！ 我是AI产品黄叔，我们下期再见！ 🔗 原文链接： https://mp.weixin.qq.com/s/6ylOzxiZ... https://mp.weixin.qq.com/s/6ylOzxiZ... 原创 AI产品黄叔 AI产品黄叔2025年05月24日 20:45 北京 你有没有过这样的经历？脑子里闪过一个绝妙的产品创意，却苦于没有设计能力把它变成现实？或者为了一个简单的界面原型，不得不花大价钱请设计师？ 最近我沉迷于一件事： 用Claude 4一步生成完整的iOS界面设计 。经过一天时间调试40多版Prompt后，我终于搞定了这个神奇的提示词，让AI直接输出高颜值的iOS界面设计，而且是 一次性生成多个页面 ！ 先看看效果，真的太香了！ 第一个产品： 给你码 （没有谐音梗）！idea来源于前段时间特工宇宙的文章《码都来》，我微创新了一下，搞了个「给你码」！ 第二个产品： 高考祈福App ，马上高考了，给考生祈福吧： 看到这些界面，你可能会惊讶：「这真的是AI生成的？也太专业了吧！」没错，这就是Claude 4的实力！而且整个过程只需要一个提示词，不需要任何设计基础。 完整提示词大公开