Claude Code + Nano Banana 动画网页设计工作流 来源：Chase AI - Claude Code + Nano Banana Just Changed Web Design 核心观点 AI 生成的网页普遍存在"AI 味"（generic AI slop），通过添加动画背景可以让你的网页立刻脱颖而出。这个技巧简单且高杠杆——实现难度低，但视觉效果提升巨大。 四步工作流 Step 1：Nano Banana Pro 生成起始图像 * 在 Higgsfield 平台使用 Nano Banana Pro 生成图像 * 提示词模板：按 camera type、light description、atmosphere 等维度结构化描述，把模糊的想法变成专业 prompt * 灵感来源：Pinterest / MidJourney 搜索艺术风格作为参考图 Dribbble / Godly 搜索落地页设计灵感 * 关键：生成图片前就要想好落地页的布局（如左侧留白放文字） * 需要多次迭代，很难一次出理想结果 Step 2：图像转视频 * 使用 Cling 3.0 或 VO 3.1（需要支持 starting frame 的模型） * 提示词原则：保持静态，只加极其缓慢和微妙的动态（slow and subtle motion） * 动画太多会显得 tacky（低俗），less is more * 关闭 enhance，保持对 prompt 的控制 视频时长选择 方案时长优点缺点长视频（推荐）15 秒创作自由度大，实现简单到结尾会有卡顿短视频循环5 秒无缝循环动作受限，需 ffmpeg 反转拼接 * 实际没人在 hero 区停留 15 秒，所以长视频的卡顿问题不大 * Claude Code 可以用 ffmpeg 自动反转拼接做循环 Step 3：Claude Code 构建落地页 最小 prompt 模板： 我要为 [你的业务] 创建一个落地页。- 用文件夹中的 MP4 创建动画 hero section- 用静态图片替代视频（给移动端用户）- 使用 front-end design tool 提升质量的技巧： * 使用 UIUX Pro Max skill（GitHub 安装，两条命令即可）—— 根据行业和细分领域生成更专业的设计 * 喂截图：把喜欢的网站截图丢给 Claude Code，减少迭代次数，避免 generic 输出 * 使用 21st.dev 的预制组件 —— 浏览按钮、卡片等组件样式，一键复制 prompt 给 Claude Code * 让 Claude Code 启动 dev server，在 localhost 预览效果 Step 4：GitHub + Vercel 免费部署 1. 推送到 GitHub：在 Claude Code 中 commit and push our code to [repo URL]首次使用需要 GitHub 认证（60 秒内完成） 2. 部署到 Vercel：用 GitHub 账号注册 Vercel（免费） Dashboard → Add New Project → Import → Deploy 自动获得一个 .vercel.app 域名，后续可绑定自定义域名 工具链总结 环节工具用途图像生成Nano Banana Pro (Higgsfield)生成起始帧图像灵感MidJourney / Pinterest参考风格网页灵感Dribbble / Godly落地页设计参考视频生成Cling 3.0 / VO 3.1图像转动画网页开发Claude Code + front-end design生成落地页代码组件库21st.dev预制 UI 组件 prompt部署GitHub + Vercel免费上线 关键经验 * 动画是对抗 AI 味的利器：99% 的 AI 网站没有动画 * 移动端用静态图：不要在手机上加载视频 * 给 Claude Code 越多上下文越好：截图、参考网站、设计灵感 → 减少迭代 * 视频动画要克制：微妙的烟雾、光影变化 > 夸张的运动 * 迭代是必然的：图像、视频、网页每一步都需要多次调整 相关链接 * Chase AI 社区（免费）：www.skool.com * Chase AI Plus（付费课程）：www.skool.com * Higgsfield：goto.higgsfield.ai * 21st.dev：21st.dev

Claude Code, Paperclip 与 "AI Agent 公司"的崛起 来源：Chase AI - Claude Code, Paperclip, & The Rise of "AI Agent Companies" 核心观点 AI 领域正在兴起一类新工具——Agent 编排平台（Agent Orchestration Platforms），如 Paperclip、Claw Empire、Clawith、OpenClaw Mission Control 等。它们的卖点是"用 AI Agent 运行整个公司"，但 Chase 的结论是：这些工具本质上是"委派工具"（delegation tools），而非"创造工具"（creation tools）。 什么是 Agent 编排平台？ * 定义：允许你创建和管理多个 AI Agent 团队的开源编排层 * 运作方式：模拟真实公司的组织架构（CEO → C-suite → 工程师/分析师） 你作为"董事会"设定愿景和目标 Agent 们自主执行计划，可自行创建子 Agent 通常基于"心跳系统"（heartbeat）运行——每隔 5/30/60 分钟唤醒检查新指令 * 代表产品：Paperclip：发布不到 2 周即获 24,000 GitHub stars，拥有精美 Dashboard Claw Empire：Agent 以动漫角色形式呈现 Clawith、OpenClaw Mission Control 等 * 思想源头：GasTown、CrewAI 等早期多 Agent 框架 Chase 的核心判断：委派 vs 创造 为什么组织架构式 Agent 看起来合理？ * 真实公司用层级架构是有原因的 * 这本质上就是 Claude Code 已有的工作方式——你告诉 Claude Code 做某事（=董事会→CEO），Claude Code 生成子 Agent（=CEO→CTO→工程师） * 区别在于 规模：从 1 个 Claude Code 实例扩展到 5、8、10 个自主运行 问题在哪里？ 1. 反馈循环缺失：使用 Claude Code 构建产品时，最关键的是紧密的人机反馈循环——迭代、观察、调整。这个过程是曲折的（winding path） 2. 方向质量下降：很多调整方向是（a）主观的，（b）你事先根本不知道该怎么 prompt 的。自主运行时这些会丢失 3. 电话游戏效应：CEO→COO→分析师→工程师，经过 5-15 次迭代后会发生"回归均值"（regression to the mean），产品质量下降 4. 生产力幻觉：感觉很高效（fancy dashboard、动画角色开会）≠ 实际高效。"Feeling productive" ≠ "Being productive" 适用场景 场景是否适合从零创建新产品不适合 — 需要紧密人机反馈循环运营已有业务适合 — 已有明确流程的重复性任务添加小功能/迭代适合 — 任务已被拆解为离散工作流人不在时自动运行有价值 — 异步委派场景从头构建复杂应用不适合 — 仍需 Claude Code + 人类紧密协作 一句话总结 先用 Claude Code 亲手把东西造出来，然后再用 Paperclip 这类工具去委派和维护。创造阶段要 hands-on，委派阶段才能 hands-off。 对 Paperclip 的具体评价 优点： * 架构设计精良（"very well put together"） * Dashboard 精美，操作直观 * 可查看每个 Agent 状态（CEO、Founding Engineer 等是否在线） * 可调节心跳频率 * 需要人类批准才能"招聘"新 Agent（不会自行膨胀组织架构） 局限： * 对大多数想用它"从零开始创业"的人来说，期望与现实不符 * 本质上是 delegation tool，不是 creation tool 关键概念 * Agent Orchestration Platform：多 Agent 编排平台，模拟公司组织架构 * Heartbeat System：Agent 定时唤醒检查指令的机制 * Regression to the Mean：经过多层 Agent 传递后，输出质量趋向平庸 * Delegation vs Creation：委派已知任务 vs 从零创造新事物的本质区别 * Productivity Theater：看起来很忙但实际没产出的生产力幻觉 个人思考 这个视频的核心洞察与 AI 工具使用的通用原则一致：一切工具都有其最佳使用场景，没有万能方案。Agent 编排平台的价值不在于替代人类创造力，而在于扩展已验证流程的执行规模。这也暗示了 AI 创业的一个范式：先人工验证 → 再自动化扩展。

10 个 Claude Code 插件，让你的项目效率提升 10 倍 来源：YouTube 博主 Chase AI 的视频 10 Claude Code Plugins to 10X Your Projects Claude Code 的插件生态正在爆发——MCP 服务器、CLI 工具、Skills、框架，每天都有新东西冒出来。本期播客基于 Chase AI 的实测推荐，从他日常真正在用的工具中筛选出 10 个最值得加入你工具栈的插件，涵盖数据库、部署、浏览器自动化、研究工作流、知识管理等场景。每个工具都讲了：为什么值得用、怎么装、怎么用、实际使用场景。 适合谁听：正在用或准备用 Claude Code 的开发者、AI 工具爱好者、想提升 AI 编程效率的人。 10 个插件详解 1. Supabase CLI（数据库 + 认证） * 解决什么：项目需要数据库和用户认证时的首选方案 * 亮点：基于开源工具（PostgreSQL）、免费额度慷慨、支持本地开发和自托管 * 安装：根据操作系统在 Supabase 文档 找到对应命令，或直接让 Claude Code 帮你安装 * 注意：安装 CLI 后要配套安装 Supabase 的 Claude Code Skill（在 Skill 市场搜索 Claude Code plugin） 2. Skill Creator Skill（技能创建器） * 解决什么：创建、修改、评估自定义 Skill 的官方工具 * 亮点：Anthropic 官方出品，支持 A/B 测试——可以量化对比有 Skill 和没 Skill、新旧版本 Skill 的效果差异，告别"凭感觉" * 安装：/plugin → 搜索 skill creator → 安装 * 使用：/skill-creator 或自然语言指令 3. GSD 框架（Get Shit Done） * 解决什么：从零开始创建项目时的规范化流程 * 亮点：规格驱动开发（spec-driven development），逐阶段、逐功能推进 自动管理上下文窗口，每执行新阶段都用全新上下文 + 子代理，避免上下文腐化 * 安装：GitHub 搜索 GSD 或 get shit done，一条命令安装 * 使用：/gsd new project 启动 4. NotebookLM CLI（研究工作流） * 解决什么：在 Claude Code 中直接操作 Google NotebookLM，无需官方 API * 亮点：研究、分析、生成播客/视频/信息图/幻灯片/闪卡等交付物，全部免费 * 安装：到 notebooklm-api GitHub 复制安装命令 + notebooklm skill install * 使用：自然语言即可，如"帮我基于这几篇文章生成一个播客" 5. Obsidian（知识管理） * 解决什么：个人助理场景下的知识积累与组织 * 亮点：Markdown 笔记之间通过 [[链接]] 形成知识网络 适合持续积累的个人知识库，不适合普通编程项目 * 安装：下载 Obsidian → 创建 Vault 文件夹 → 在该文件夹打开 Claude Code * 使用：告诉 Claude Code "创建笔记时遵循 Obsidian 规范"即可 6. Vercel CLI（部署管理） * 解决什么：项目部署到生产环境 * 亮点：简单易用、免费额度足够、配合 Agent Loop 可自动监控部署状态 * 安装：一条命令安装 CLI + 在 Vercel 官网安装对应 Skill * 使用：可与 Agent Loop 配合，自动检查部署状态 7. Playwright CLI（浏览器自动化） * 解决什么：浏览器操作自动化、UI 测试 * 亮点：微软开源，成熟稳定 可以做任何浏览器里能做的事：填表、下单、测试 UI playwright-cli show 命令可以看到所有浏览器代理的可视化面板 * 安装：GitHub 复制安装命令 + playwright-cli install-skills * 使用：自然语言描述任务 8. GitHub CLI（代码管理） * 解决什么：在终端完成所有 GitHub 操作 * 亮点：从写代码 → push → 创建 PR → 部署，全程不离开终端 Claude Code 对 Git/GitHub 非常熟悉，甚至不需要额外 Skill * 安装：按操作系统在 GitHub CLI 页面 安装 * 使用：直接自然语言 9. Firecrawl CLI（网页抓取） * 解决什么：专为 AI 优化的网页数据抓取 * 亮点：4 个核心命令：scrape（单页）、crawl（全站）、map（站点地图）、search（搜索） 返回的数据格式专门为 AI 代理优化，比 Claude Code 自带的 web search 更强 * 安装：一条命令安装（含 Skill） * 使用场景：竞品调研、文档监控、深度研究 10. Excalidraw Diagram Skill（图表生成） * 解决什么：用自然语言生成架构图、流程图、示意图 * 亮点：由 YouTube 博主 Cole Medin 创建 做演示/写文档时极其省时间，手动画图 → 一句话生成 * 安装：GitHub 克隆仓库 → 复制到项目 Skill 目录 * 使用：指向一份文档/知识库，让 Claude Code 自动生成配套图表 10 个插件速查表 #插件类型一句话总结1Supabase CLICLI数据库 + 用户认证一站搞定2Skill CreatorSkill创建和量化评估自定义 Skill3GSD 框架框架从零建项目的规范化流程4NotebookLM CLICLI免费生成播客/视频/信息图等5Obsidian应用个人知识库 + AI 助理6Vercel CLICLI一键部署 + 自动监控7Playwright CLICLI浏览器自动化和 UI 测试8GitHub CLICLI终端内完成所有 Git 操作9Firecrawl CLICLIAI 优化的网页抓取10Excalidraw SkillSkill自然语言生成图表 关键 takeaway 工具多不等于效率高。 能力增加 ≠ 性能提升，找到适合自己工作流的"甜蜜点"才是关键。不要贪多，选几个真正解决你痛点的工具，用好它们。

Cluade Code+Notebooklm+Obsidian，治好AI失忆症的上帝模式