即使到了2025年，在产品设计中设计与开发之间仍然存在差距。我们在像Figma这样的工具中设计的东西与在代码中实现的内容有时候并不一致。这个差距大小取决于设计交接如何以及设计师和开发者的技能如何，这个差距可以很小，也可以非常大。如果设计和开发都由同一个人完成，就有可能填补这个缺口。不过，这需要一定的编程技能，而在UI设计领域，真正掌握编程技能的人并不多。

2025年可以成为这种现状开始改变的一年，因为有一些AI工具可以帮助你简化产品设计并为你编写代码。这些工具包括Cursor AI、Lovable、Bolt。这些工具的核心理念即利用AI生成一个完全功能的产品。随着AI工具的迅速发展，创造了一个新的专家类别——氛围码农——那些没有扎实编程技能的人，他们借助AI来生成代码。

在这篇文章中，我将探讨利用Cursor AI创建一个功能齐全的iOS应用（股票监控应用）的过程。我还将讨论如何最大限度地利用与AI协作创作，并在文章的最后提到这种方法的关键不足。

你需要以下三样东西：

1. MacBook 或 iMac
2. Xcode . Xcode 是一个集成开发环境，用于开发 macOS、iOS 和 iPadOS 的软件。
3. Cursor AI . Cursor AI 是一个带有 AI助手 的开发环境，用于生成代码。

在 Xcode 里，您只需创建一个新的项目。然后点击 iOS 选项卡下的应用项目。

在 Xcode 中选择模板。

一旦你点击“下一步”，你就需要给项目起个名字并选择你想要存储的文件夹。

在 Xcode 中给项目起个名字。

Xcode 创建的项目将会非常基础——它只包含必要的文件和一个屏幕（技术上会是一个 ContentView，显示“Hello World”）。确保 Xcode 能够构建项目，并且项目可以在预览中看到。

一旦你创建了一个项目并且确保Xcode能够构建它，你就可以前往Cursor AI生成代码。

一旦你在 Cursor AI 中打开一个项目，你就能看到你的工作环境。如果你之前用过像 Visual Studio Code 这样的 IDE，你会发现 Cursor AI 十分熟悉。基本上，它和 VS Code 的设计差不多，但是增加了一层 AI 功能。

大多数情况下，你将主要与3个面板互动。

1. 左边的面板是项目文件树列表
2. 底部的面板是终端界面

在 Cursor AI 中，左侧和底部的面板已经打开了。

1. 右边的面板有一个AI助手。

三个面板都在 Cursor AI 里打开了。

所有的魔法都会发生在第三个面板上，也就是有AI助手的那个面板。我们会让AI助手生成代码。在我的例子中，我提供了一个构建股票价格应用的提示。一旦我点击发送，AI助手就会帮我生成代码。

在发送第一个提示之前，你需要检查一些事项，以便更好地利用Cursor AI。首先，确保添加了_.cursorrules_文件，在该文件中提供在编写代码时Cursor应遵循的具体指南。因为我正在开发一个iOS应用，将以SwiftUI为例提供相关指南。

光标规则文件，用于SwiftUI项目

如果你在想这个文件该写些什么，我有解决方案给你——要么写下你觉得对你项目有意义的内容，要么使用Cursor社区提供的说明。查找这类说明的一个好地方是Cursor.directory。只需在搜索框中输入你项目中要使用的技术，你就能找到可以直接使用的规则。

特定技术与语言的规则集。

另一个你需要做的是提供开发者文档，并针对设计特定领域的最佳实践。你可以通过在Agent窗口中给相关文档打标签来实现这一点。比如我自己，我就给Apple Swift和Apple设计技巧的文档打了标签。

在Agent里给文档打标签。

有两种方法可以添加新文档。要么选择“上下文”，然后选择“文档资料”，再点击“新建文档”。

正在添加新文档到上下文中。

或者点击_齿轮_图标，进入功能选项卡，然后在页面上向下滚动到文档。

在“光标设置” -> “功能” -> “文档”这个选项中，添加新的文档。

最后一步是通过点击你希望AI用来生成代码的文档，将这些文档添加到上下文信息中。

往上下文中加两个文件。

一旦你将项目规则添加到Cursor，并为上下文添加相关文档，就可以使用AI助手生成代码了。这是整个过程中最具有挑战性的一步，因为你得清楚地说明你想要构建什么及其原因。

您提交给AI代理的提示应该是：比如

• 清楚地说明你要构建的应用程序是关于什么的；
• 这个应用会有哪些界面，以及这些界面是怎么连接起来的；
• 说说每个界面需要具备的内容和功能。

你得明白，AI 第一次尝试做到完美的应用程序几率很低。所以做好准备不断迭代和优化你的初始提示和后续指令。

一个用于生成iOS股票价格应用的指令

一旦你提交了请求，Cursor 就会开始为你生成代码。作为用户，你可以完全控制 Cursor 提供的更改，这是它的优点之一。你可以选择接受或拒绝 Cursor 提供的每一个建议，只有当你接受了 Cursor 的建议，它才会实际修改文件。

Cursor AI会根据你的提示为你提出代码修改建议。

你可以打开 Xcode 回到 Cursor 生成的结果内容看看。

StockPrice 这个 app 是由 Cursor AI 生成的。

如我之前所说，你第一次尝试就得到最终解决方案的可能性不大。所以你需要给Cursor提供更多提示来完善这个应用。可以改进的地方有改进业务功能（调整内容或功能）和视觉效果。例如，下面是我尝试让应用看起来更好看的一个例子。你可以看到我使用了一个简单的提示，“ 让StockListView和StockDetailsView看起来更漂亮 ，”而Cursor很清楚我想要的效果。

使用AI来优化App。

如果你回到 Xcode 里，你会发现这款工具所做的改动让应用看起来更漂亮。

更精致的应用程序界面设计。

问：我能否使用Cursor AI来创建一个完整的应用而不用学编程技巧呢？

A：我诚实地回答是不行，至少现在不行。Cursor 是一个非常好的协作工具，但你仍然需要掌握方向盘，确保 Cursor 生成的代码质量。

我能使用Cursor来构建具有复杂业务逻辑的复杂的应用程序吗？

A：你可以尝试，但可能需要在Cursor AI和Xcode之间进行多次来回调整。你需要不断调整和优化你的提示，并准备好深入代码来完善细节。根据我的经验，Cursor适合用来构建简单的应用（比如我在这里分享的StockPrice应用），并且当你有特定的任务需要完成时，它也可以作为一个很好的辅助工具（例如，当你需要优化某个特定界面的设计时）。

问：你认为UI设计师是否需要会用像Cursor AI这样的工具？

A：是的，以后UI设计师的工作中，氛围设计会变得越来越重要；大家在设计初期时会练习氛围设计，这将有助于缩小设计和开发之间的差距。

这是Nick Babich写的文章（https://babich.biz/）。