Google AI Studio 氛围编程指南：高效提示词技巧与实战经验
文章摘要
这篇文章介绍了如何利用 Google AI Studio 的 Build 功能进行"氛围编程"（Vibe Coding）——无需编写任何代码即可快速构建和发布 Web 应用。作者分享了一年来的实战经验，涵盖原生 Gemini 集成、隐私优势、数据库支持、提示词优化技巧、版本管理策略、发布方式，以及 AI Studio 与 Antigravity 的适用场景对比。
你可能已经知道 Google AI Studio 是一个用来体验 DeepMind 模型、调整各种参数的沙盒环境。但你知道吗？你还可以在上面免费进行 Vibe Coding（氛围编程），快速构建 Web 应用，并在几步操作内发布上线！
AI Studio 的 Build 功能是"氛围编程"的革新者——让你无需编写任何代码，就能生成功能完备的应用程序。借助 Gemini 模型的强大能力，你可以从简单的想法出发，在几分钟内迭代出完整的可部署原型。
基于我过去一年在该平台上的实践，本指南将全面覆盖 AI Studio 的核心能力、与其他工具的对比，以及如何高效地编写提示词来构建你的应用。
0. 为什么选择 AI Studio？（原生 Gemini 与隐私保护）
在深入"怎么做"之前，先回答最常见的问题：市面上那么多 AI 应用构建工具，为什么选 AI Studio？
第一个原因是 AI Studio 对 Gemini 模型的原生集成。它可以创建基于 Gemini 模型的应用，只要你在 AI Studio 内操作，就无需任何额外配置，你和你的分享对象都可以免费使用 Gemini 驱动的应用。
注：部分高级模型需要付费 API Key，但总会有免费层替代方案。
但最大的差异化优势是隐私。
在许多竞品的免费层中，除非你付费，否则你生成的所有应用默认都是公开的——任何人都能看到你在做什么。而在 AI Studio 上，你的应用严格私密。当你在做个人原型、处理敏感的客户项目，或者只是想自由探索而不担心被人看到时，这是一个巨大的优势。
图1：在 AI Studio 中分享应用——与 Google Drive 文件共享方式一致
分享机制与 Google Drive 文件完全一致，非常方便。别人无需创建新账号就能试用你的应用。
进阶技巧：与任何 Drive 文件一样，你可以将应用设置为"有链接的人可访问"。我在 LinkedIn 上发帖时就是这样做的（参见文末示例）。
不管你最终是否使用 AI Studio，这些提示词技巧同样适用于大多数 vibe coding 工具。
1. 应用画廊与 Remix
如果你是 vibe coding 新手，最好的入门方式是探索 AI Studio 内置的 App Gallery（应用画廊）。
图2：AI Studio 应用画廊——浏览和 Remix 社区作品
最佳实践：浏览画廊中感兴趣的应用，点击 Remix 按钮，查看它是如何生成代码的。这是理解代码生成逻辑的最快途径。
2. 开始你的 Vibe Coding 之旅
准备构建你自己的应用了？原理极其简单：打开 Build 页面，用自然语言描述你想要的应用功能，按回车，然后看着编码智能体（与 Antigravity 类似）自动生成 UI 和逻辑。
图3：在 Build 页面输入你的应用构想
注意：首次生成可能需要较长时间（平均约 5 分钟），可以先去泡杯咖啡，回来就能看到成品。
当应用跑起来后，你可以通过左侧的代码助手对话框继续添加新功能。
新功能：最近几周新增的特性是——代码助手现在在服务端运行。这意味着你可以关闭标签页或切换设备，它会持续为你工作。
图4：使用语音输入进行 Vibe Coding
多模态输入方式
除了文字，你还可以利用两个特殊按钮向模型提供视觉线索——直接在应用截图上画标注，这对提供 UI 反馈极为方便。
图5："标注应用"功能——直接在截图上画出你想要的修改
另一个选项是语音输入。当你在手机上想快速添加功能时非常方便，但不推荐用于精确的修改指令。
3. 创建带数据库的应用
从本周开始，你还可以让编码智能体创建跨会话或跨用户持久化数据的应用。只需在提示词中明确要求使用数据库：
图6：在提示词中明确要求使用数据库
（是的，我早就想做一个自己的购物清单应用了！）
当系统询问时点击"启用（Enable）"，魔法就会发生。
图7：点击"启用"激活 Firebase 集成
幕后发生的事情是：系统会自动配置 Firebase 集成和 Firestore 数据库，并添加 Google 账号认证，这样就能识别谁在访问什么数据。
你完全不需要了解数据库结构——编码智能体会根据应用需求自动管理一切。想让每个用户有自己的购物清单？一键搞定！想让用户能共享清单？也没问题！给物品加标签？轻而易举。
你的想象力就是唯一的限制！
4. Vibe Coding 进阶技巧
如今，"氛围编程"已经成为我的本能反应。它是原型设计用户体验的绝对最佳方式，在可能迁移到复杂 IDE 之前先快速验证想法。但如果你不够小心，很容易在让智能体高效工作这件事上浪费大量时间。
以下是我总结的 AI Studio 高效使用技巧（排名不分先后）。
4.1 先设计再构建
如果你对应用的外观有明确的构想（我个人通常没有，随性而为），一个好办法是先用 Stitch（基于 Nano-Banana）等工具迭代设计稿，然后把设计图给编码智能体，让它知道预期效果。
图8：使用 Google Stitch 进行 UI 设计迭代
4.2 善用版本控制——保存进度以便回滚
AI 会犯错。它可能误解你的提示词，或写出破坏现有功能的代码。这时你可以让它"修复错误"，大多数时候有效——但有时不管用。
氛围编程中一个非常重要的技能是：判断何时用 AI 修复、何时重新开始、何时自己动手。
我的个人建议是：如果智能体在 2 轮对话后仍无法解决问题，就别再纠缠了，回退到之前的版本，否则你可能会花一个小时跟 AI 白费口舌。当你发现自己在"解释需求"上花的时间跟"自己做"差不多时（比如"把这个时间改成另一个"），那就直接自己改。
幸好 AI Studio 让回退变得非常简单：
Checkpoints（检查点）
Checkpoints 是内置的版本历史功能，可以立即回退到上一个正常工作的状态。这是回退的最便捷方式。
图9：使用 Checkpoints 快速回退到之前的版本
注意：回退代码后，数据库变更无法回滚！不要加载到数据库更新之前的检查点。我的做法是：加载检查点 → 复制代码 → 加载最新的（有问题的）代码 → 让助手基于之前正常的版本进行修复。
GitHub 集成
GitHub 适合保存里程碑版本。当你完成某个功能后，可以用它来保存应用状态。
图10：在设置中打开 GitHub 集成
图11：登录 GitHub 账号
图12：创建 GitHub 仓库
图13：将代码提交到 GitHub
之后只需要描述新功能并提交到 GitHub 即可。
目前的一个限制是同步是单向的——适合保存状态以便复用，但还不能在 GitHub 中修改代码后同步回 AI Studio（暂时还不行）。
4.3 使用多模态提示
别只依赖纯文本！AI Studio 提供了更多输入方式：
- 语音输入：快速迭代的利器，尤其适合在手机上微调应用
- "标注应用"工具：这是我做 UI 工作时最爱的功能。截取应用截图，直接在上面画标注（"把这个按钮移到这里"、"删除这个菜单"），然后发送
进阶技巧：始终将标注截图与清晰的文字说明结合使用，给模型提供最大化的上下文信息。
4.4 拆分文件！拒绝单体架构
随着应用增长，模型可能开始"幻觉"、遗忘早期功能、或把逻辑搞混。这几乎总是结构性问题导致的。
默认情况下，AI 倾向于把所有东西塞进一个巨大的 app.tsx 文件。立即否决这种做法！
- 黄金法则：从一开始就告诉模型将不同功能拆分到独立的文件和组件中
- 为什么？这能大幅减少错误、加快生成速度。也让你更容易判断 AI 是否搞错了（比如你要求改个 UI 颜色，它却开始修改
auth-service.js——你就知道它跑偏了，可以立即叫停）。在代码审查时也能更高效，至少能让你一眼确认更新了正确的部分
4.5 强制 AI 编写文档
为了帮助 AI 记住应用的设计意图，让它尽可能多地维护文档（从微观到宏观）：
- Docstrings：强制 AI 为所有函数编写文档字符串，说明功能、输入和输出
- 文件级文档：既然每个功能一个文件，让 AI 在文件顶部维护文档，详细说明该功能是什么、覆盖哪些用例
- Design.md：让 AI 在项目根目录维护一份整体设计文档
原理：通过让 AI 将信息多次重复记录，既帮助它（也可能帮助你自己）快速定位每段代码的位置和预期行为。这有点像前向纠错码的思路——同一信息被多次记录后，被误删的概率就大大降低了。
4.6 利用 System Instructions 提效
用了一段时间后你会发现，你总是在给编码智能体重复同样的指令，迟早会厌倦。这就是 AI Studio 允许你自定义系统指令（System Instructions）的原因。别让它空着！你可以在里面定义偏好的技术栈、框架、编码风格，当然还有上面提到的所有规范。
图14：打开设置面板
图15：自定义 System Instructions
把 System Instructions 想象成给新入职开发者的入职手册——他们需要知道你的工作期望、编码规范、文档要求、沟通方式等。你可能第一次写不完美，但持续反思和优化这份手册很重要，这样下一个"新人"能更快上手、更高效地工作。
以下是我一直在使用的通用指令模板（除了更专业的指令如"相信我对模型名称的选择，不要随意更改"之外）：
## Coding/documenting guidelines
* Create a file per feature or related features, split as much as possible in different files;
* add docstrings to all functions to explain what they do;
* start each file with a long comment explaining in detail what the feature is about and the different use cases;
* maintain a `Design.md` document at the root of the app that documents all the features of the app;
* log as info all function calls (with their parameters) and log all genai calls with all their parameters (model used, prompt, config) and their outputs, just strip inline data;
* group all configurable items (like model names) in a centralized file;
* always create a way to test the scripts without altering the data;你会发现我还添加了关于日志记录（调试利器）和干运行（dry run）的指令——这两个是好习惯，不管是不是在 vibe coding。
试试看，告诉我是否提升了你的 vibe coding 体验！
5. 发布你的应用
现在你对应用满意了，想分享给全世界（或者其中一部分人），AI Studio 提供了两种发布方式：
5.1 在 AI Studio 内分享
最简单的方式就是使用 AI Studio 的分享功能。
图16：使用 AI Studio 内置分享功能
你可以选择与特定人分享，或设为"有链接的人可访问"（我在 LinkedIn 上发帖时就用这种方式）。
一个关键好处是：分享对象也能访问代码并 Remix。你也可以发送一个全屏打开应用、隐藏代码助手的链接给你的非技术朋友们。
另一个好处是：如果你的应用使用 Gemini，你的朋友们会用他们自己的免费额度，这意味着不会花你一分钱。
5.2 发布到 Cloud Run
如果你想正式向真实用户发布应用，就该选择这种方式。几步操作即可创建 Cloud Run 容器、上线应用并获取访问 URL。
图17：点击发布按钮
图18：确认发布配置
图19：应用成功发布到 Cloud Run
之后你还可以购买域名、部署到不同区域、自动扩缩容等等。但相应地，使用费用也需要你自己承担了。
6. AI Studio vs Antigravity：该用哪个？
既然 AI Studio 和 Google 的 Antigravity 使用了类似的底层编码智能体，你可能想知道该选哪个。以下是我的经验法则：
| 使用场景 | AI Studio | Antigravity |
|---|---|---|
| 前端 UI 原型 / 轻量全栈应用 | 推荐 | |
| 多模态交互（截图标注、语音） | 推荐 | |
| 通过链接即时分享原型 | 推荐 | |
| 零配置 Gemini 模型访问 | 推荐 | |
| 生产级复杂应用 | 推荐 | |
| 细粒度依赖/构建/部署控制 | 推荐 | |
| 集成到现有大型代码库 | 推荐 |
一句话总结：AI Studio 是你的创意速写本，Antigravity 是你的正式开发车间。
7. 精选作品展示
既然你已经掌握了 vibe coding 的基础，最好的学习方式就是动手实践。我刚起步时也没能完美遵循所有这些规则，但犯错正是优化工作流程的方式！
为了展示哪些是可能的，以下是我使用上述大部分方法完全从零开始 vibe coding 出来的几个应用。
更多示例可以查看我创建的 vibe-coding-challenge 仓库——当时我以为自己每周都能 vibe coding 出一个应用呢。
总结
Google AI Studio 的 Build 功能为开发者、设计师和创业者提供了一个强大的"氛围编程"平台。核心优势在于：
- 完全免费的 Gemini 原生集成
- 严格私密的应用开发环境
- 多模态交互——文字、语音、截图标注
- 数据库支持——Firebase + Firestore 零配置集成
- 一键发布——AI Studio 内分享或 Cloud Run 正式部署
记住那些核心技巧：拆分文件、写好文档、配置 System Instructions、善用 Checkpoints。这些会大幅提升你的 vibe coding 效率和成功率。
原文链接：Vibe-coding in Google AI Studio: my tips to prompt better and create amazing apps
评论