--- area: "tech-engineering" author: Lei category: technology channel: '' companies_orgs: [] date: 2025-08-04 draft: true guest: '' insight: '' layout: post.njk media_books: [] people: - Ray - Mike - Lei - 小西瓜 - Remy - Serena project: [] series: Vibe Coding source: '' speaker: 用AI發電 summary: 多位嘉宾分享了 Vibe Coding 的实践经验，包括使用 Claude Code、Obsidian 等工具进行编程、创作动画和管理知识。讨论深入探讨了 AI 如何降低技术门槛、激发个人创造力，并展示了从个人项目到多智能体系统的多种可能性。 tags: - claude-code - vibe-coding - 个人项目 - 视频笔记 title: Vibe Coding：AI 辅助编程的实践与思考 --- ## 开场闲聊与准备 Ray: 我们其实都是这样的，咱们就是找机会聊聊天。我打算今年去墨西哥住上一个月再练一练西班牙语，现在只能让 AI 代劳翻译了。 Mike: 我也学过半年法语和将近一年西班牙语，现在都还给老师了。 Ray: 那你用 AI 赋能一下。 小西瓜: 我科目三考试的时候撞到社会车辆了，最后挂掉了。 Ray: 那驾校赔还是你赔？ 小西瓜: 教练员处理的。驾校可以报保险，但是驾校、车主、我、教练员，还有警察都在那，乱七八糟一片，特别头疼。反正我不用花钱，就是考试没过。 ## Lei：AI 辅助编程的实践、局限与思考 Lei: 大家好，今天我想分享一下我们 AI 辅助编程的一些经历和思考。我自己其实不是很想用 **Vibe Coding** (一种编程理念，强调在轻松、有氛围感的状态下，利用 AI 工具进行探索性、兴趣驱动的个人项目开发，而非严格的工程导向。) 这个词，我知道这是大家推崇的理念，我也很尊重，但我不太赞同。我是做后端开发的，我觉得 AI 编程非常好，但它确实有其局限性。 ### AI 编程的优势与局限 Lei: 好处大家都知道，它极大地降低了编程的门槛。只要愿意动手，在这些强大工具的加持下，你都可以在很短时间内见到成果。 Lei: 局限在于，我们在公司里主要用 **GitHub Copilot** (由 GitHub 和 OpenAI 开发的 AI 代码助手，能根据上下文自动生成代码建议。)，配合 IntelliJ 和 VS Code。有人说它能提高 50% 到 100% 的效率，但在目前的软件公司里，能达到 20% 到 30% 就已经很不错了。因为软件开发是一个完整的周期，环环相扣。你不是单纯把代码写完，在本地电脑跑通就结束了。一个功能从提出需求、编码、代码审查、合并、测试、部署，最终到上线，整个过程最短也要两周。 Lei: 我觉得目前的 AI 最主要节省的是编程环节的时间，这方面确实很厉害。但是，在后续的迭代和沟通上，尤其是在有一定规模的团队里，瓶颈并不在写代码本身。 ### 代码审查的挑战 Lei: 我举个简单的例子。最近我写了一段代码，大约五六百行，用 AI 辅助，不到一个小时就写完了，编译错误它也能自己调试。但我把代码提交 **PR** (Pull Request，在版本控制系统如 Git 中，开发者向项目主分支提交代码更改请求以便审核和合并的一种机制。) 之后，麻烦才真正开始。前后有五位同事来审核，提出了各种修改意见：这里有更好的库可以用，那个命名不规范，建议把某些部分合并重写等等。我们来回交流了大概 40 次，我周一写完的代码，到周五还没能合并进主干。 Lei: 这就是问题所在。大家可能会想，为什么不省略这些流程？但这是为了避免 **技术债** (Technical Debt，在软件开发中，为了短期速度而选择的非最优解决方案，这些选择会在未来导致额外的重构和维护成本。)，防止一次改动破坏了其他地方的功能，在大厂这是绝对要避免的。代码有很多种写法，AI 写出了一种，但审核的时候同事们认为不符合团队的模式（Pattern），就必须改掉。这个过程虽然也是学习，但也凸显了 AI 在团队协作中的瓶颈。 ### 本地模型的体验 Lei: 我也一直在跟踪 AI 的发展，玩过一些 **本地模型** (指在个人计算机上本地部署和运行的 AI 模型，与之相对的是通过网络 API 调用的云端模型。)，比如在我的 M1 Max (64G 内存) 上跑 Llama 和 Gemma 2.5B。本地模型的好处是数据隐私，也可以自己微调。但实际体验是，我的机器也只能跑中型模型，效果和 GPT-3.5 差不多，而且生成速度很慢，像一个字一个字地往外蹦，感觉在浪费生命。所以折腾了一段时间后，我就不搞了。 ### 个人项目：视频文字稿检索网站 Lei: 我想强调，并非所有问题都需要用编程解决，很多时候现有工具就足够了。我做了一个个人网站项目，初衷是为了解决一个痛点：我看过很多视频，过后想回忆某个细节却怎么也想不起来。视频的关键词搜索功能又很弱。我试过视频总结工具，但发现我真正需要的不是总结，而是能对视频全部内容进行文字检索的工具，因为触动我的往往是某个小故事或几句话，而不是框架。 Lei: 半年前，我发现可以让大模型直接输出 HTML 格式的文本，于是我开始自己动手。我写了一个 Prompt，让 AI 把视频字幕文件整理成 HTML。我早期的做法非常简单粗暴，把所有生成的 HTML 文件放在一个文件夹里，用一个脚本每次重建索引文件。当文档数量达到几百篇时，这种方法就没法扩展了。 Lei: 于是我向 Gemini 讨论，询问构建个人博客网站的最佳实践。它告诉我可以采用 **SSG** (Static Site Generator，静态网站生成器：一种能将模板和内容数据结合，预先生成所有 HTML 页面文件的工具，部署简单，加载速度快。) 的方案。我先和 AI 讨论确定了技术选型和需求，这个过程就像写一份 **PRD** (Product Requirement Document，产品需求文档：一份详细说明产品目标、功能、用户、范围和约束的正式文件，用于指导开发团队的工作。)。然后，我在 VS Code 里，使用公司订阅的 Gemini Agent 来辅助写代码，它能帮我生成和修改代码，解释代码用途。 Lei: 最终的成品网站，可以让我对所有视频文字稿进行全文搜索，我还可以手动添加标签（Tag），或者加入我自己的想法和笔记。虽然这个过程可以进一步自动化，但我认为没有必要，因为这些内容是我自己要看、要挑选的，我必须参与其中。写代码本身很简单，但想清楚要做什么，并充分利用好 AI 的能力，才是真正不容易的地方。 Ray: 谢谢Lei。我觉得你做的这个东西还是太慢了，可以更快的。你知识储备太丰富了，反而可能限制了自己。我建议你的个人项目可以玩得再野一点，更疯狂一些。 Lei: 这是因为我要全职工作，个人项目只能在休假时花点时间搞一搞。而且如果你要追求细节，比如像 Alex 的网站那样在各种设备上都有完美的显示效果，那需要打磨的东西就非常多了。 ## 小贤：从植物基因研究到 AI 全栈开发 小贤: 大家好，我本来是做植物基因研究的，2023 年参加了一个软件工程师的密集训练班想要转行。但训练班强度很大，没什么时间消化，学习效果很差。后来朋友推荐了 ChatGPT，我立刻就付费了 GPT-4。当时班里很多人还想用免费版，但我觉得作为初学者，提供充足的上下文（Context）非常重要，付费是值得的。 ### AI 辅助学习与项目开发 小贤: 虽然老师们总说 AI 生成的代码质量不好，但我还是坚持用。可以说，我整个结业项目——一个完整的网站——基本上就是靠 AI 完成的。我的 **Vibe Coding** 经验就是从那里开始的。最近大家都在分享 **Claude Code** (一款深度集成 AI 功能的代码编辑器，以其强大的上下文理解和代码生成能力而著称。) 的厉害之处，我也开始用了。 ### 个人 App 项目：任务管理器 小贤: 我是一个任务管理控，一直想复现一个我很喜欢的经典 App。它的核心功能很简单：有大项目和子项目，完成后打勾。重点是它有一个进度条，能提供多巴胺回馈。一般的待办清单，你勾掉一项它就消失了，没有成就感。我喜欢那个 App 就是因为它有完成度的百分比显示。 小-贤: 一开始我用 Claude 的 Artifact 功能很简单的实现了这个版本。后来我决定把它做成一个完整的项目，在和 AI 讨论后，选择了用 Flutter 框架重写。整个过程，包括把之前的 React Native 代码转换成 Flutter，都是在 AI 的帮助下完成的。虽然现在的 UI 我还不太满意，但功能基本都实现了。 小贤: 我在里面设计了一些比较独特的规则，比如一个任务下面可以有多个层级的子任务。还有一个暂停功能，比如一个任务包含几个子步骤，我时间来不及只完成了大部分，我可以选择“暂缓未完成的任务”，这样系统会记录下来，但完成度百分比会相应扣除，这让我心里有个数。这个功能因为逻辑复杂，导致 bug 特别多。此外还有删除任务后的“撤销”功能，以及任务的拖拽排序等，这些前端细节对于主要做后端的我来说，花了非常多的时间去调试。 ### AI 工具接力：拯救网站项目 小贤: 因为有财务焦虑，我最近想做一个可以变现的网站。我和一个叫 **Vercel v0** (一个由 Vercel 推出的 AI UI 生成工具，可以通过自然语言提示词快速生成基于 React 和 Tailwind CSS 的网页界面代码。) 的 AI 网站构建工具讨论，它帮我生成了一个很漂亮的网站，甚至能自己部署。但最后部署上去的网站打不开，还耗尽了我的免费积分。好在这个网站可以下载完整的代码包。于是我把代码下载下来，丢给 **Claude Code**，让它帮我拯救和重构整个网站。 小贤: 我还尝试了另一个网站构建工具 **Lovable**，我把之前和 AI 讨论的所有需求整合成一个巨大的 Prompt 喂给它，它生成了一个非常细节、分页很多的网站。这个过程让我体会到，不同 AI 工具有各自的特点，可以接力使用。比如用一个擅长设计的 AI 生成初步的 UI，再下载下来交给 **Claude Code** 这样强大的编码工具去完成后续的逻辑和部署，这是一个非常高效的工作流。 Ray: 这个思路非常好。用不同的 AI 工具接力，去薅它们的羊毛，利用各自的免费额度。比如用 **Vercel v0** 或 **Lovable** 设计出漂亮的界面，然后下载下来，丢给 **Claude Code** 帮你完成剩下的工作，这样可以集各家之长。 ## Arlene：用 AI 赋能个人知识管理与产品落地 ### 实践一：Obsidian 与 AI 结合的知识库 Arlene: 我之前一直不知道怎么 debug，因为没有编程背景。最近我开始看吴恩达的 Python 基础课，同时在 YouTube 上看到一个视频，讲如何用 **Claude Code** 的终端去操控 **Obsidian** (一款基于本地 Markdown 文件的个人知识管理和笔记软件，以其强大的双向链接和插件生态系统而闻名。)。我看完后就尝试把我学课程的笔记、个人知识库都通过这个方式来管理。 Arlene: 我可以直接在终端里用语音输入告诉 **Claude Code**：“给我建一个文件夹，把某某笔记放进去”，它就能帮我自动整理文件结构。我把课程链接发给它，它就为我生成了一个非常详细的笔记模板，格式和双向链接都做得很好。 Arlene: 我还用这个系统来辅助我做小红书内容。我口述需求，让它帮我生成小红书文案的 Prompt 模板。最近发的一个帖子，从有想法到最终发布，只花了 25 分钟，非常高效。这样，我所有的个人知识、笔记、创作素材都汇集在 **Obsidian** 里，AI 可以随时基于这些完整的上下文来帮我创作，并且可以方便地更新我的 Prompt 库。 Ray: 我给你两个建议。第一，你可以直接用 VS Code 打开你的 **Obsidian** 库（Vault），这样比在终端里更方便，你可以直接选中文字或@某个文件，让 AI 去处理。第二，你应该让 AI 帮你建立一个“长期记忆”（Long-term Memory）文件，里面记录关于你是谁、你的写作风格、你发布过的内容等。这个个性化的记忆库未来会非常值钱。 ### 实践二：零基础用 Vercel v0 创建 Landing Page Arlene: 我之前是做会计的，完全没有编程基础。上周我用 **Vercel v0** 帮 Mike 做了一个产品的落地页（Landing Page）。它一开始生成的样子完全不是我想要的，我通过不断和它对话、提供参考网站的风格，迭代了十几个版本后，才比较接近最终的样子。 Arlene: 我的经验是，当它生成的版本比较接近你的目标后，后续的修改一定要具体而微小。如果一次性提很多模糊的需求，比如“更现代化一点”，它改出来的东西可能完全偏离。对于一些小地方，比如修改文字，直接在它的设计界面手动改会比对话更快，也更节省额度。虽然我最终迭代了五十多个版本，很多时候是因为我自己词不达意，但相比请人设计，成本还是低非常多。这个过程让我对使用 AI 工具不再那么害怕了。 ## Remy：为朋友打造自动化数据抓取工具 Remy: 我帮我朋友做了一个小工具，解决他工作上的一个痛点。他每天需要关注四十多个网页链接，并从中手动提取公司信息、发布时间等数据，填入一个 CSV 表格。这是一个非常耗时且重复的工作。 Remy: 我做的工具是一个在终端里运行的脚本。它的输入是一个包含几十个 URL 的文本文件。它会自动通过网络爬虫去抓取网页信息。这些链接中，80% 的内容是图片形式，所以需要用到图片文字识别（OCR）功能。我用了阿里的 OCR 模型来识别图片中的文字，然后把识别出的文字再喂给阿里的 AI 推理模型，让它最终整理出 CSV 表格所需要的数据。 Remy: 目前这个工具可以运行，但准确率在 85%到90% 之间，最后一步还是需要人工检查。我认为问题可能在于，把所有数据提取的任务都交给同一个 AI，任务过于复杂。我接下来的想法是，把任务拆解开，比如 CSV 表格中的每一个字段（Column）都交给一个单独的、更专注的 AI 去处理，通过这种“多专家”协作的方式，也许可以提高整体的准确度。 Ray: 这本身就是一个系统工程的设计思路。把复杂的任务拆分，让不同的模型（或者 Agent）接力完成，就像 **Claude Code** 里的 Sub-agent 机制一样，这能有效提高稳定性和准确率，同时也能节省 Token。 ## Serena：用 Remotion 和 AI 实现代码驱动的视频动画 Serena: 我这周也下载了 **Cursor** (一款专为 AI 辅助编程设计的代码编辑器，深度集成了 AI 对话、代码生成和调试等功能。) 和 **Obsidian**。我看到一个视频博主的剪辑做得特别好，就把那个动画效果截图发给了 **Claude Code**，问他这是怎么实现的。它告诉我可以用一个叫 **Remotion** (一个使用 React 框架来以编程方式创建视频和动画的库。) 的工具。 Serena: **Remotion** 的原理其实很简单，视频就是一帧一帧的图片连续播放。你可以用写 React 代码的方式来驱动视频的每一帧，从而创建出非常复杂的动画效果。我让 AI 帮我分析了截图中动画的实现方式，然后它就用 **Remotion** 帮我复现了。虽然还有点小问题，但已经能做出类似的效果了。 Serena: 我还问 **Claude Code**，教学视频里的动画可以做成什么样。它不仅给我描述，还能直接生成 Demo 代码。比如数据可视化动画、进度条、年份滚动条等等。这让我瞬间觉得，以前遥不可及的那些酷炫动画，现在我也可以做了。我准备以后就把我想做的动画效果都截图保存下来，需要的时候就让 AI 帮我用代码实现。 Ray: 这非常棒！我们现在也正在用 **Remotion** 来做社群里的一些动画。视频本身就像一个 UI 界面，动画里的元素就是 UI 元素。你可以收集一堆你喜欢的动画风格和元素，建立自己的库，以后就可以让 AI 帮你快速组合和生成视频了。 ## 小西瓜：Obsidian 与 API 打造个人输入系统 小西瓜: 我最近也在搞 **Obsidian**。我平时读纸质书，想把感想记录下来很麻烦。我的想法是，用音频记录我的读书感想，然后用 AI 把音频转成文字，这些文字就成了我最原始、最个人化的输入。无论是以后要开发 App 还是写博客，我都可以从这些本地的、纯净的输入开始。 小西瓜: 我在 **Obsidian** 里做了一个工作流。我用手机录音，然后调用 API 将音频文件转录成文字。我试过讯飞星火和 ElevenLabs 的 API，发现 ElevenLabs 的效果最好，而且有免费额度。我把整个流程写成了一个 Prompt，然后直接在 VS Code 里用 **Claude Code** 的终端模式运行。我把音频文件的路径丢给它，它就能自动完成调用 API 转录、整理笔记、移除口水话等所有步骤，并把最终的文本分类整理好放回我的 **Obsidian** 库里。 小西瓜: 以前我觉得调用 API 很麻烦，但现在可以让 **Claude Code** 帮你搞定一切。它就像一个智能的 Agent，你把原材料和操作指南（Prompt）给它，它就能帮你完成整个流水线的工作。 ## Mike：超越 Vibe Coding，构建多智能体协作系统 Mike: 我很早就开始用 **GitHub Copilot** 的早期版本。上个月我去拜访了《AI 降临》的作者，他疯狂地向我强调，一定要买你能负担得起的最贵的 AI 工具。刚才 Ray 说Lei做得慢，其实不是慢，我们来这里的目的就是消灭“不知道你不知道”（Unknown Unknowns）。Lei现在用的工具可能只能解决 20-30% 的问题，但如果换到 **Claude Code**，可能就能解决 80%。 ### 让 AI 互相协作 Mike: 但 **Claude Code** 还不够好，还能怎么加强？答案是让它主动去和其他 AI 聊天。我们现在很多人开着好几个 AI 网页来回复制粘贴，这还是很慢。我做的方式是，让 **Claude Code** 在内部直接通过 API 和 Gemini、GPT-4 对话。比如，我有一个复杂的任务，我会先让 Gemini 或 GPT-4 做规划（Planning），因为它更擅长这个。等规划好了，我再让 **Claude Code** 去执行，因为它有完整的代码库上下文，执行能力更强。 Mike: 我在 **Claude Code** 里写了一些自定义的命令（Slash Command），比如 `/plan`。当我输入这个命令时，它就会把我的需求发给 Gemini 的 API，让它生成一个详细的执行计划。计划返回后，**Claude Code** 再去执行。这样结合起来，代码生成的准确率基本能达到 99%。这本质上就是一个 **多智能体协作系统**（Multi-Agent Collaborative System），让不同的 AI 机器人自己去开会，得出最好的结果后向你汇报，你批准了再执行，效率会高非常多。 ### AI 时代的作弊论 Mike: 当编码本身不再是瓶颈时，更重要的事情就变成了推广、营销和商业模式。前段时间有一个藤校的毕业生用 AI 做面试作弊软件被开除了，但他现在拿到了融资。他说了一句话：“Feel like cheating”。他认为，当所有人都开始“作弊”时，那就没有人是在作弊了（When everyone does, no one is）。这就像计算器一样，AI 就是我们这个时代的计算器，你应该毫无负担地去使用它。 Ray: 这就是现实，我们每个人都应该主动去用 AI 取代自己现在的工作。因为当你在做这件事的时候，你就会发生改变，你就会找到下一个对你真正有意义的目标。 ## 总结与展望 Ray: 今天的分享真的收获非常多。我们每个人在 Vibe Coding 的过程中，都在解决自己的问题，同时也是在探索、学习和玩。这个过程特别容易上瘾。但当你知道 AI 能做什么之后，就应该沉淀下来，思考什么事情对你来说是最重要的，然后把精力聚焦在最有杠杆价值的事情上。 Ray: 创作对我来说很重要，所以我现在让 AI 帮我创作，帮我做动画。创业更重要，所以笔记做得再好，没有作品也是白搭。大家一定要想清楚，你的时间有限，你最重要的那几件事情，一定能用 AI 来赋能，帮你实现巨大的飞跃。早点定义好你的核心项目，然后用 AI 给它插上翅膀。