LongCut logo

【Vibe Coding 學習地圖】用實戰帶你搞懂 Gemini、Google AI Studio、Antigravity 的使用情境

By 工程師下班有約

Summary

Topics Covered

  • AI优化提示词避开弯路
  • Gemini网页纯前端易抄袭
  • AI Studio免费额度假模
  • 迭代对话快速补齐功能

Full Transcript

嗨, 大家好, 我是 鼎 渊 欢 迎 来 到 工 程 师 下 班 有 约 如果你 刚 开始 接 触 vi be coding 可能 会

有一 种 感 觉 工 具 很多, 教 学 很多 但 不知道 该 怎么 开始 才 不会 走 渊 网 路 因 此 这 支 影片 会 从 实 战

dem o 的 方 式 带 你有 系 统 的 建 立 使 用 观 念 让 你知道 不同 阶 段 该 选 择 怎么样 的 AI 工 具

比 较 合 适 我 会 从 入 门 的 G em ini 到 进 阶 的 Go ogle AI Studio 再 到 偏 专 业 应

用 的 Ant i G rav ity 实 际 示 范 他们 各 自 的 特 点 以及 使 用 时 需要 特 别 注意 的 AI 陷 阱

另外 这 支 影片 中 提 到 的 工 具 与 歧 视 词 我 整 理 一 篇 文 章 放 到 B log 让 大家 参 考 连 接

在 下 方 的 影片 描 述 现在 应 该 很多 人 使 用 G em ini 处 理 自己 的 日 常 工作 事 宜 不管

是 文 书 应 用 图 片 生 成 还是 简 报 草 稿 它 都 能 给 我们 带 来 经 验 的 表 现 同 时 它 也是 最 适

合 新 手 入 门 vi be coding 的 工 具 因为 它 只 要 打 开 浏 览 器 就 能 够 操 作 用 简 单 的 对

话 就 能 生 成 漂亮 的 网 页 完成 后 还 可以 把 成 果 分享 给 朋友 这 边 我就 直接 示 范 给 大家 看 像 我 本 身

是 一个 作 家 如果 想 要 制 作 一个 宣 传 自己 书 籍 的 l ending page 就可以 请 AI 来 协 助 设 计 但

第一 步 我 会 先 提 出 自己 的 基 础 需 求 请 它 优 化 成 完 善 的 提 示 词 一 开始 我 先 说 明 自己 的

需 求 是 提 供 书 籍 请 AI 生 成 网 页 然后 请 AI 优 化 我 提 供 的 初 始 提 示 词 最 后 提 供 初

步 的 pr ont 请 AI 延 伸 这 边 我 先 点 击 提 交 相信 有 些 人 会 觉得 我们 要 学 那么 多 提 示 词

架 构 好 累 哦 到底 AI 是 在 帮 我 还是 在 搞 我 下次 你有 这样 的 想 法 时 不 妨 学 我 先 描 述 自己 脑

中 的 想 法 然后 请 AI 协 助 优 化 成 更 完 善 的 提 示 词 像 这 边 AI 就 帮 我们 撰 写

了 一个 更 完 善 的 提 示 词 点 击 右 上 角 复 制 代 码 之 后 我 建 议 大家 开 启 一个 新 的 对 话 窗

然后 贴 上 去 这么 做 是 为 了 避 免 上 下 文 的 一个 干 扰 同 时 我们 要 点 开 工 具 选 择 Can vas

这样 才 能 够 生 成 网 页 另外 最 下 方 的 部分 我们 要 放 上 给 AI 参 考 的 书 籍 资 讯 这 边 我就 用 今年

刚 出 版 的 工 程 师 下 班 有 约 来 当 做 范 例 那 我们 把 这 边 的 书 籍 大 纲 贴 上 去 之 后

就可以 点 击 提 交 送 出 稍 等 一 段 时间 我们 的 网 页 就 生 成 完 毕 了 但 要 提 醒 一下 大家 有

结 果 不 代 表 我们 的 内 容 是 正 确 的 比如 我们 可以 看到 书 籍 是 没有 封 面 的 我们 也可以 看到 作

者 是 没有 头 像 的 另外 我们 点 击 立 即 购 买 这 本 书 它 只是 导 向 到 我们 博 客 来 的 首 页 根 本

不是 真 正 进 入 到 我们 书 籍 的 页 面 那 另外 如果你 发 现 了 这 些 问题 想 要 补 充 资 讯 的话 我们 是

可以 直接 在 这个 地方 跟 AI 持 续 对 话 来 调 整 我们 这 些 不 满 意 的 细 节 像 这个 地方

我就 有 贴 上 书 籍 的 购 买 链 接 以及 我们 作 者 的 头 像 还有 书 籍 的 封 面 连 接 要 特 别 提 醒 一下

大家 如果 你想 要 在 G em ini 加入 图 片 你 需要 把 图 片 上 传 到 图 床 的 网 站 上 然后 贴 上

图 片 的 网 址 这样 才 会 有 效 你 单 纯 提 供 给 G em ini 图 片 要 求 它 放 到 网 页 目前 是 没有

效 果 的 哦 好 那 我们 在 调 整 完 毕 后 就可以 看到 我们 的 书 籍 封 面 另外 我们 在 下 方 的 这个

作 者 头 像 也可以 顺 利 显 示 出 来了 同 时 我们 如果 点 击 立 即 购 买 这 本 书 好 它 终 于 不是 只

跳 到 我们 博 克 莱 的 首 页 有 跳 转 到 我们 指 定 的 网 页 了 这 边 再 跟大家 介 绍 一下 G em

ini 一个 有 趣 的 功 能 如果你 点 击 右 下 角 的 新 增 G em ini 功 能 AI 会 根 据 网 站 的 这个

主 题 来 自 动 增 加 对 应 的 功 能 那 我们 就 来 看看 G em ini 会 为 这个 网 站 增 加 什么 功 能

吧 这 边 我们 可以 看到 AI 把 我们 新 增 了 一个 定 AI 职 丫 导 师 的 一个 功 能 读 者 可以 输 入

自己 的 职 场 困 惑 然后 AI 来 协 助 回 答 那 这 边 的话 我们 就 点 击 职 丫 导 航 然后 我们 输 入 一个

职 丫 的 问题 比如 说 我 现在 35 岁 想 转 职 工 程 师 还 来 得 及 吗 然后 点 击 获 取 定 的 建 议 你

就可以 看到 我们 这个 AI 连 我的 头 像 都 直接 产 生 出 来了 他 就 跟我 直接 说 35 岁 转 职 工 程 师 绝

对 还 来 得 及 重 点 不 在 年 龄 而 在 于 你 做 出 这个 决 定 的 策 略 与 选 择 那 甚 至 还有 产 生

出 一个 对 应 的 推 荐 章 节 那 这个 是 AI 说 的 不是 我 说 的 大家 的人 生 一定要 自己 仔 细 的 去 做 评 估

那 我们 可以 透 过 这个 初 步 的 操 作 验 证 出 这个 AI 机 械 人 是 可以 去 做 一个 使 用 的 确 认 我们 的

网 页 都 调 整 的 差不多 之 后 你可以 点 击 右 上 角 的 功 用 选 择 分享 在 取 得 连 结 之 后

就可以 直接 向 大家 展 示 你 所 完成 的 这个 成 果 这 边 我就 开 启 一个 新 的 分 页 贴 上 这个 网 子 那 大家

可以 看到 我们 这个 网 页 是 符 合 我们 预 期 来 去 做 一个 显 示 的 但是 大家 应 该 会 发 现 到 一

件事情 我们 上 方 跟 下 方 都有 G em ini 的 一个 浮 水 印 我 个 人 觉得 这个 浮 水 印 是 有 点 碍

眼 的 所以 这 边 要 跟大家 分享 一个 小 技 巧 那 就是 使 用 Go ogle Site 来 免 费 建 立 网 站 这

边 我们 先 回 到 G em ini 点 击 程 式 码 的 分 页 全 选 所有 的 程 式 码 复 制 起 来 之 后 切

换 到 我们 的 Go ogle Site 点 击 空 白 网 站 选 择 页 面 在 下面 的 这个 地方 选 择 整 页 迁 入 名

称 我就 打 工 程 师 下 班 有 约 完成 点 击 新 增 迁 入 内 容 迁 入 程 式 码 贴 上 刚 刚 我们 从 G em

ini 复 制 的 程 式 码 选 择 下 一个 点 击 插 入 这样 子 就 完成 了 接 下 来 再 回 到 我们 页 面 的 分

页 我们 要 把 工 程 师 下 班 有 约 的 这个 分 页 拉 到 最 上面 然后 把 原 本 一 开始 默 认 的 首

页 给 删 除 接 下 来 点 击 右 上 角 的 发 布 网 址 的 部分 我们 可以 自由 命 名 比如 我 这里 就 直接

打 定 然后 再 输 入 今天的 日 期 那 确 认 我们 的 网 址 没有 重 复 之 后 它 就可以 点 击 发 布 完成 后

我们 的 网 页 就 顺 利 上 线 了 我们 可以 点 击 右 上 角 这个 下 拉 选 单 然后 用 查 看 已 发 布 的 网

页 就 会 成 功 跳 转 到 我们 刚 刚 发 布 的 网 页 那 这 边 大家 可以 看到 我们 的 网 页 都是 顺

利 显 示 的 那 点 击 立 即 购 买 也 会 跳 转 到 我们 期 待 的 网 页 同 时 我们 会 发 现 跟 G EM

IN I 相 比 上面 以及 下面 的 这个 浮 水 印 的 标 签 都 已经 消 失 了 但 如果 我们 把它 往 下 滑 来 操

作 这个 AI 的 功 能 贴 上 去 你 会 发 现 它 是 无 法 取 得 定 的 这个 建 议 的 这是 因为 如果 你想 要

使 用 AI 功 能 会 需要 搭 配 G EM IN I 的 AP I Key 我们 从 G EM IN I 去 做 分享 之 所以 能

够 使 用 我们 的 AI 功 能 那 是 因为 我们 有 登 录 自己 的 Go ogle 账 号 但 如果 想 让 对 方 在 不

登 录 Go ogle 账 号 的 状 态 下 也 能 使 用 G EM IN I 的 AI 功 能 你就 需要 提 供 我们 的 AP

I Key 所以 接 下 来 我们 把 视 角 切 换 到 G EM IN I 然后 在 程 式 码 的 这个 位 置 搜 寻 AP

I Key 那 这个 就是 我们 所 需要 输 入 AP I Key 的 地方 如果 没有 填 写 的话 你要 透 过 Go ogle

site 这 类 的 方 式 发 布 网 站 你是 无 法 使 用 G EM IN I AI 功 能 的 那 至 于 这个 K ey 要 如何

取 得 我 会 在 下一 节 Go ogle AI Studio 的 介 绍 中 跟大家 说 明 但 我 依 然 不 建 议 大家 使 用

这是 因为 免 费 的 AP I Key 额 度 很 少 另外 如果 你想 要 正 式 使 用 发 不到 正 式 的 网 站 那

你 一定要 绑 定 账 单 那 如果 我们 的 账 单 额 度 没有 设 定 好 你的 信 用 卡 可能 会 被 刷 爆 这 边 再

给 大家 建 立 一个 基 础 观 念 G EM IN I 建 立 的 APP 基本 上 都是 纯 前 端 网 页 也 就是 说 它

所有 的 这 些 业 务 逻 辑 全部 都是 公 开 的 也 就是 说 如果 有人 想 要 抄 袭 你的 网 站 只 要 点 击 滑 鼠

右 键 选 择 检 查 网 页 元 素 然后 稍 微 往 上 滑 一点 点 把 我们 这个 H T N L 的 元 素 点 击 右 键

复 制 元 素 就可以 直接 整 包 带 走 这 边 我 把 视 角 切 换 到 M T Grav ity 简 单 的 对 话 就

有 办 法 建 立 网 站 但是 透 过 G EM IN I 所 建 立 出来 的 应 用 别 人 也可以 毫 无 难 度 的 抄

袭 但 我 依 然 建 议 大家 可以 先 使 用 G EM IN I 作 为 Vi be C oding 入 门 的 工 具 因为 我觉得

成 就 感 就是 一 切 的 起 点 那 同 时 也 欢 迎 大家 订 阅 我的 频 道 我 会 带 你有 浅 入 深 的 掌 握 Vi

be C oding 所 需要 的 相 关 知 识 透 过 刚 刚 的 示 范 大家 可以 看到 用 G EM IN I

Vi be C oding 会 得 到 一个 H T N L 档 案 结 构 相 对 简 单 而 接 下 来 要 分享 的 Go ogle

AI Studio 则 是 以 前 端 专 案 的 角 度 呈 现 这 边 我们 先 选 择 Vi be Code 的 G EM

AI Apps 来 建 立 第一 个 AI App 在 广 网 中 你可以 看到 它 有 许 多 可以 选 择 的 AI 应 用 像 是

图 片 生 成 语 音 辨 识 影片 生 成 等 应 有 尽 有 这 边 我 先 选 择 最近 爆 货 的 N ano Banana

作 为 范 例 带 大家 完成 第一 个 有 AI 功 能 的 网 页 这 边 我就 跟 他 说 使 用 者 只 要 上 传 照 片

就可以 转 换 成 自己 想 要 的 风 格 界 面 先 列 出 五 个 常 见 风 格 也 允 许 使 用 者 自己 输 入 接

着 点 击 Bu ild 就可以 开始 看 G EM IN I 表 演 了 稍 等 一 段 时间 后 这个 AI App

就 完成 了 我们 直接 来 体 验 看看 这 边 可以 选 择 F ull Screen 把 我们 的 这个 画 面 放 大 这 边 我 先

选 择 自己 的 照 片 然后 再 选 择 S ci per 这个 风 格 后 点 击 右 下 角 的 G ener ate Trans

form ation 它 就 会 开始 帮 我们 转 换 这 边 就可以 看到 它 帮 我们 得 到 对 应 的 一个 结 果 了 在 确 定

结 果 能 够 符 合 我们 需 求 后 我们 可以 点 击 右 上 角 Le ave for Screen 离 开 全 萤 幕 的

画 面 如果你 对 里 面 的 一些 细 节 有 不 符 合 需 求 的 结 构 你 也可以 在 左 边 的 这个 地方 跟

它 持 续 的 对 话 来 修 改 那 技 巧 就 跟 刚 刚 跟 G EM IN I 的 沟 通 方 式 也是 一 样 的 在

确 认 结 果 符 合 需 求 后 我们 就可以 分享 成 果 点 击 右 上 角 的 分享 符 号 把 P ub lish your

app 打 开 这样 别 人 才 能 够 看 得 到 而 把 D ef ault to Full Screen 打 开 才 能 够 预

设 显 示 全 萤 幕 否 则 会 是 跟 Go ogle AI Studio 对 话 的 撕 窗 用 这 种 方 式 分享 APP

一 样 是 要 登 录 Go ogle 账 号 才 有 办 法 使 用 这 边 我 把 APP 的 分享 网 址 复 制 下 来

用 另 一个 Go ogle 账 号 打 开 给 大家 看 在 使 用 这个 APP 前 你 会 先 收 到 一个 讯 息 告诉

你 这个 是 其 他 开 发 者 的 作 品 你要 点 击 Con line new to the app 才 能 继 续 操 作

这 边 我 上 传 一下 自己 的 照 片 然后 选 择 一个 风 格 开始 转 换 OK 我们 用 AI 来 渲 染 图 片

的 功 能 是 可以 正 常 使 用 的 但 我要 提 醒 一下 大家 用 这 种 方 式 分享 APP 的 上面 以及 下面

都有 预 设 的 文 字 我 自己 是 不 太 喜欢 的 啦 另外 点 击 右 上 角 的 D ef ault Screen 你 专 案 的

程 式 码 是 直接 公 开 给 对 方 看 的 甚 至 可以 根 据 这个 APP 来 去 做 二 次 创 作 所以 大家 在 分享 前

要 先 注意 到 这 些 细 节 另外 我不 建 议 大家 使 用 D ef ault App on Google Cloud 的 这个 功 能

因为 它 是 需要 绑 定 付 费 的 专 案 才 有 办 法 去 做 使 用 的 因 此 当 别 人 使 用 这个 APP 那 账

单 是 算 在 你的 头 上 的 除 非 你 很 清楚 自己 在 做 什么 否 则 我不 建 议 透 过 这 种 方 式 来 分享

APP 那 这 边 的话 也 带 着 大家 看一下 前 面 提 到 的 AP I Key 到底 是 在 哪 里 我们 先 回 到 Go

ogle AI Studio 的 首 页 滑 到 最 左 下 方 我们 会 看到 Get API Key 点 击 进 去 之 后 点 击

右 上 角 的 Cre ate API Key 这里 你可以 先 给 自己 的 AP I Key 做 一个 命 名 然后 选 择 对

应 的 一个 pro ject 就可以 建 立 属 于 自己 的 AP I Key 了 但是 使 用 上 它 会 分 成 免 费 版

以及 付 费 版 两 种 以 免 费 版 来 说 我们 可以 从 Res Lim its 这个 地方 来 看一下 我们 使 用 到

的 模 型 点 击 All Mod els 原 则 上 我们 都 只 能 使 用 一些 比 较 旧 款 的 模 型 像 我们 最

新 推 出 的 G em ini 3 Pro 这 类 的 模 型 都是 不 可以 使 用 的 但 如果 你的 专 案 有 绑 定

信 用 卡 那么 各 种 最 新 的 模 型 都是 可以 使 用 的 像 这 边 G em ini 3 Pro 这 些 模 型

都 能 够 使 用 但是 使 用 前 你要 先 搞 清楚 自己 在 做 什么 因为 这 些 模 型 你 用 多少 就 算 多少 钱 其实

Go ogle AI Studio 除 了 能 建 立 有 AI 功 能 的 APP 外 它 也是 可以 建 立 一 般 的 前 端

专 案 这 边 我就 以 抽 签 分 组 的 APP 来 做 范 例 并 在 建 立 完成 后 分享 如何 帮 我们 把 成 果

保 存 到 G em ini 3 Pro 做 版 本 控 管 并 在 后 面 透 过 Ant i - G rav

ity 补 齐 专 案 的 细 节 然后 在 G it Hub 配 具 上 免 费 部 署 那 因为 刚 好 最近 接 近 了 尾

压 时间 相信 许 多 公 司 都 会 有 抽 奖 的 需 求 这 时 不 妨 自己 Vi be Code 一个 我的 提 示 词

是 这样 设 计 的 我是 一个 H R 想 要 制 作 一个 网 站 可以 上 传 CS V 或 贴 上 姓 名 作 为 名 单 来 源

有 两 个 功 能 一个 是 奖 品 抽 签 会 有 动 画 随 机 抽 取 那 这 边 的话 我 可以 设 计 对 应 的 重 复

抽 取 或者 是 不 重 复 另 一个 则 是 自 动 分 组 可以 设 定 要 几 原 分 组 后 的 结 果 会 有 我们 的 视

觉 画 来 显 示 那 我们 这 边 点 击 Bu ild 等 AI 完成 后 我们 来 验 证 一下 功 能 是不是 符 合 需 求

这 边 我们 也 先 点 击 F ull Screen 我们 先 贴 上 准 备 好的 姓 名 点 击 加入 名 单 接 着 我们 切 换 到

幸 运 抽 签 的 这个 页 面 点 击 开始 抽 奖 那 这 边 的话 可以 看到 它 是 有 一个 对 应 的 抽 签

符 号 然后 抽 奖 出来 的 一个 名 单 也 会 在 下面 去 做 一个 呈 现 然后 我们 再 到 自 动 分 组 的 页 面 因为 贴

上 人 不 少 我就 选 择 2 然后 点 击 开始 随 机 分 组 这 边 它 就 快 速 的 帮 我们 完成 了 分 组 作 业

我们 看 起 来 这 些 功 能 都是 符 合 需 求 的 但是 在 操 作 过 程 中 发 现 几 个 可以 改 进 的 地方 首先 是

名 单 的 部分 站 在 想 要 快 速 理 解 与 测 试 功 能 的 角 度 上 如果 有 模 拟 名 单 的 功 能 那 会

更 加 实 用 另外 在 贿 赂 名 单 的 部分 加 持 我们 故 意 给 它 贿 赂 重 复 的 名 单 这里 你 会 发 现 名

单 都 重 复 了 我们 应 该 是 要 把 这 些 重 复 的 名 字 给 标 记 出来 然后 提 供 个 按 钮 让 使 用 者

一 致 性 移 除 重 复 的 姓 名 才 是 一个 更 合 理 的 方 案 那 最 后 则 是 我们 这个 自 动 分 组 的

地方 因为 我们 分 组 完成 之 后 它 就是 一个 快 速 的 结 果 如果 我们 能 够 把它 下 载 成 CS V 的 记 录

会 是 更 好的 毕 竟 这 只是 一个 前 端 网 页 下次 进 来 后 记 录 就 不 在 了 那 如果 你看 到 自己 有 想 要

优 化 的 功 能 也 很 简 单 先 离 开 我们 的 全 荧 幕 画 面 然后 就 直接 跟 它 说 我 希望 增

加 以 下 功 能 名 单 这 块 我觉得 可以 有 模 拟 名 单 的 选 项 让 大家 可以 理 解 如何 使 用 并 且

在 汇 入 CS V 或 贴 上 名 单 时 如果 发 现 有 重 复 的 学 生 姓 名 则 在 预 览 名 单 处 标 记 出来

并 提 供 个 按 钮 让 使 用 者 一 致 性 移 除 重 复 的 姓 名 并 且 在 我们 自 动 分 组 后 希望 可以 下

载 成 CS V 的 记 录 等 AI 调 整 完 毕 后 我们 就 来 测 试 一下 它 增 加 的 功 能 是 否 符 合 需

求 首先 是 模 拟 名 单 的 地方 它 帮 我们 增 加 了 一个 范 例 的 按 钮 我们 点 击 一下 它 就 直接 在 这个 地方 帮

我们 产 生 出 了 一个 模 拟 名 单 并 且 也 帮 我们 模 拟 出 有 这 种 重 复 名 字 的 情 境 那 如果 在 发

现 重 复 的 状 态 下 我们 也可以 一 键 的 移 除 重 复 那 完成 了 我们 的 目前 名 单 之 外 我们 可以 再 到 自

动 分 组 的 一个 页 面 我们 来 开始 随 机 分 组 好 那 这 边 也 多 了 一个 下 载 CS V 的 按 钮 我们

可以 把它 点 击 开 来 那 这 边 的话 你 就可以 看到 它 有 根 据 我们 的 主 别 汇 整 出 对 应 的 CS V 工作

标 在 初 步 确 认 我们 的 功 能 都 符 合 需 求 后 我们 可以 把它 保 存 到 G ith ub

上面 如果 你是 第一 次 接 触 G ith ub 可以 先 到 他们 的 官 方 网 站 用 G mail 就可以

注 册 了 它 是 一个 可以 帮 你的 专 案 做 版 本 控 制 的 工 具 这 边 我们 先 点 击 上 方 的 Sub to G

ith ub 首先 你要 输 入 APP 的 N ame 那 在 这个 地方 我 建 议 大家 要 输 入 英 文 我 输

入 的是 H R Hel per

Loading...

Loading video analysis...