正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

我靠，写前端终于不必被 AI 味带着跑了。 Taste Skill 是一套 agent skill，给 Claude Code / Codex / Cursor 这类 AI Coding Agent 加一层设计规则约束，解决 AI 写 UI 时视觉质量不稳定的问题。它主要干几件事： 1、反模板化限制 AI 默认生成紫色渐变、居中 Hero、三张 feature card、玻璃拟态这类同质化 UI，用 anti-slop 规则把输出拉回真实设计逻辑。 2、视觉方向可控通过 3 个 dial 控制设计倾向： DESIGN_VARIANCE：布局方差 MOTION_INTENSITY：动效强度 VISUAL_DENSITY：信息密度 AI 会根据需求推断数值，也可以手动调整。 3、写代码前先读需求内置 Brief Inference... 机制。AI 会先输出 Design Read，确认设计方向，再开始生成代码。方向不明确时，只问一个关键问题。 4、多工具共享配置一条命令安装，Claude Code / Codex / Cursor 可以共用同一套设计规则，不用重复维护。它本质上不是让 AI 更会写 CSS，而是把设计判断前置成一套可执行规则。不只是代码生成能力，还有审美、上下文约束和工程化稳定性。show more

Vince 聊开发

2,401 subscribers

21,845 次观看 • 25 天前 •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

AI 写前端的下一步，可能不是“更快”，而是“更有品味”。看到一个可以称之为“一份写给 AI Agent 的前端审美手册”的开源项目：Taste Skill。它不是 UI 组件库，也不是 Tailwind 模板，而是一套写给 AI Agent 的「前端审美规则包」。专门解决一个问题：为什么 AI 生成的页面越来越像？紫蓝渐变、居中 Hero、三张功能卡片、玻璃拟态、假仪表盘、无意义标签……页面能跑，但一眼 AI 味。它会让 AI 在写页面之前先想清楚：这个页面是官网、作品集、SaaS 落地页，还是老项目重设计？用户是谁？品牌应该是克制、可信、活泼、工业感，还是偏高级消费品？这次应该信息密度高一点，还是留白多一点？动效要克制，还是可以更强一点？然后再开始写代码。 Taste Skill 的思路是：把“审美”和“交付标准”拆成规则，让 AI 每次都先读一遍。比如：不要默认紫蓝科技渐变/不要所有页面都居中 hero/不要动不动三张等宽卡片/不要乱堆玻璃拟态和大圆角/不要用假的产品截图糊弄/不要写一堆空洞营销词/交付前检查按钮、排版、动效、移动端、可访问性一个比较适合的使用方式是：用 Taste Skill 帮我重设计这个落地页。先判断页面类型、用户受众和视觉方向，再做设计审计，最后在现有技术栈内完成实现。避免默认 AI 风格，交付前跑 pre-flight check。这类提示比“帮我美化一下页面”更容易得到稳定结果。

AI 写前端的下一步，可能不是“更快”，而是“更有品味”。看到一个可以称之为“一份写给 AI Agent 的前端审美手册”的开源项目：Taste Skill。它不是 UI 组件库，也不是 Tailwind 模板，而是一套写给 AI Agent 的「前端审美规则包」。专门解决一个问题：为什么 AI 生成的页面越来越像？紫蓝渐变、居中 Hero、三张功能卡片、玻璃拟态、假仪表盘、无意义标签……页面能跑，但一眼 AI 味。它会让 AI 在写页面之前先想清楚：这个页面是官网、作品集、SaaS 落地页，还是老项目重设计？用户是谁？品牌应该是克制、可信、活泼、工业感，还是偏高级消费品？这次应该信息密度高一点，还是留白多一点？动效要克制，还是可以更强一点？然后再开始写代码。 Taste Skill 的思路是：把“审美”和“交付标准”拆成规则，让 AI 每次都先读一遍。比如：不要默认紫蓝科技渐变/不要所有页面都居中 hero/不要动不动三张等宽卡片/不要乱堆玻璃拟态和大圆角/不要用假的产品截图糊弄/不要写一堆空洞营销词/交付前检查按钮、排版、动效、移动端、可访问性一个比较适合的使用方式是：用 Taste Skill 帮我重设计这个落地页。先判断页面类型、用户受众和视觉方向，再做设计审计，最后在现有技术栈内完成实现。避免默认 AI 风格，交付前跑 pre-flight check。这类提示比“帮我美化一下页面”更容易得到稳定结果。

sitin

14,903 次观看 • 2 个月前

给 Codex 5.6 装上这 4 个前端设计神器，做出来的网页终于有灵魂了！分享一套我目前实测下来最棒的 Codex 前端审美组合： 1️⃣Figma（内置插件）直接读取设计稿、品牌规范和组件，把视觉参考像素级还原成响应式代码，不再让 Codex 凭空猜设计。 2️⃣Product Design（内置插件）先确定产品结构和设计方向，再生成不同风格的高保真参考图，确认审美后才开始写代码，彻底告别盲写前端。 3️⃣Taste-Skill 专门负责字体、配色、留白、圆角和组件比例，还能审计并重构已有页面，消灭廉价的 AI 塑料感。 🔗地址： 4️⃣GSAP Skills 补齐 Codex 的动效设计能力，Timeline、ScrollTrigger、Flip、SplitText、SVG 动画全部支持 🔗地址：再结合 GPT‑5.6 本身更强的布局、视觉层级和设计判断，基本打通了一套完整的前端工作流～

给 Codex 5.6 装上这 4 个前端设计神器，做出来的网页终于有灵魂了！分享一套我目前实测下来最棒的 Codex 前端审美组合： 1️⃣Figma（内置插件）直接读取设计稿、品牌规范和组件，把视觉参考像素级还原成响应式代码，不再让 Codex 凭空猜设计。 2️⃣Product Design（内置插件）先确定产品结构和设计方向，再生成不同风格的高保真参考图，确认审美后才开始写代码，彻底告别盲写前端。 3️⃣Taste-Skill 专门负责字体、配色、留白、圆角和组件比例，还能审计并重构已有页面，消灭廉价的 AI 塑料感。 🔗地址： 4️⃣GSAP Skills 补齐 Codex 的动效设计能力，Timeline、ScrollTrigger、Flip、SplitText、SVG 动画全部支持 🔗地址：再结合 GPT‑5.6 本身更强的布局、视觉层级和设计判断，基本打通了一套完整的前端工作流～

爱丽丝呀！

117,912 次观看 • 13 天前

分享下我在 Vibe Coding 中，使用率最高，且最高效的几个工具，覆盖到设计稿生成，到代码交付，网页动效等👇 1、Codex 你只要输入一个需求，它就会调动多个AI智能体并行工作，无论是项目重构，还是从零构建MVP，，它都能独立完成，你无需关注代码，而是把更多精力放在架构设计和创造性问题解决上 2、Paper 这个可以让 AI 生成高质量设计稿，并实现设计与代码双向实时同步，你只需专注界面创作，AI 会自动还原为精准代码交付 3、21st 这个提供超多精美的前端组件，同时带有流畅的交互动画，只需点击复制 Prompt ，粘贴到 AI 对话框即可使用 4、Unicorn 这个，不用写代码，也可以做出丝滑流畅的 GPU 级网页特效，一键导出即可让 AI 接入你的项目 5、Agentation 这个，可以直接在网页上标注需要调整的元素，自动转化为 AI 能够直接理解，和执行的结构化代码上下文，实现网站的精细化调整 6、Axion 这个，能让你的 AI 化身 iOS 开发专家，覆盖从设计、开发到调试的全流程，，输出符合 Apple 高标准、安全、高性能，且易于维护的生产级代码 7、Apple docs mcp 配合这个，可以自动检索 Apple 最新开发文档，能解决日常开发软件中 90% 的问题

分享下我在 Vibe Coding 中，使用率最高，且最高效的几个工具，覆盖到设计稿生成，到代码交付，网页动效等👇 1、Codex 你只要输入一个需求，它就会调动多个AI智能体并行工作，无论是项目重构，还是从零构建MVP，，它都能独立完成，你无需关注代码，而是把更多精力放在架构设计和创造性问题解决上 2、Paper 这个可以让 AI 生成高质量设计稿，并实现设计与代码双向实时同步，你只需专注界面创作，AI 会自动还原为精准代码交付 3、21st 这个提供超多精美的前端组件，同时带有流畅的交互动画，只需点击复制 Prompt ，粘贴到 AI 对话框即可使用 4、Unicorn 这个，不用写代码，也可以做出丝滑流畅的 GPU 级网页特效，一键导出即可让 AI 接入你的项目 5、Agentation 这个，可以直接在网页上标注需要调整的元素，自动转化为 AI 能够直接理解，和执行的结构化代码上下文，实现网站的精细化调整 6、Axion 这个，能让你的 AI 化身 iOS 开发专家，覆盖从设计、开发到调试的全流程，，输出符合 Apple 高标准、安全、高性能，且易于维护的生产级代码 7、Apple docs mcp 配合这个，可以自动检索 Apple 最新开发文档，能解决日常开发软件中 90% 的问题

Paidax

173,520 次观看 • 4 个月前

我爽了，我的UI终于脱离AI味了。 AI 写代码已经够快了，但写出来的页面……怎么说呢，总透着一股 AI 味。紫色渐变、Inter 字体、三列等大卡片，看多了你一眼就能认出来，这是 AI 写的。 AI时代，开始比拼UI的品味能力了，非常稀缺。今天推荐taste-skill 这个项目，已经14k stars了，干的事有点意思：它不写代码，它把排版、配色、字体、动效的设计规则全写成 SKILL.md，塞给 AI。相当于给 AI 配了个免费的艺术总监。仓库表面是十几套 SKILL.md 文件，实际在做一件事：把审美变成规则。外面还在卷 AI 写代码多快，它在卷 AI 写的页面能不能不像 AI。 DESIGN_VARIANCE、MOTION_INTENSITY、VISUAL_DENSITY，数值一调整个页面气质就换了，跟调相机参数似的，同一个场景，不同参数出来完全不同。它有三层做法： >读意图，自己推断你要什么风格。极简、奢侈、粗野，十几套自动匹配 >选底座，该 Tailwind 就 Tailwind，该 Material 就 Material，不自己瞎造 >禁 AI 默认审美，紫色渐变、居中 Hero、三列等大卡片，全禁我拿自己的AIGC产品跑了一遍。原来的页面代码不动，就加了一行 SKILL.md 进去，让 AI 按它的规则重新迭代，出来的页面焕然一新。不是重写，是同一个代码底子被审美规则过了一遍。实操很简单，就两步：装 skill：npx skills add --skill design-taste-frontend 然后把你现有的页面丢给 AI，加一句：按 taste-skill 规则迭代 UI。它自动读你的代码，出诊断，改字体、配色、间距、动效，不动你的功能逻辑。搞独立开发的、做 landing page 的，这个skill太重要了！

我爽了，我的UI终于脱离AI味了。 AI 写代码已经够快了，但写出来的页面……怎么说呢，总透着一股 AI 味。紫色渐变、Inter 字体、三列等大卡片，看多了你一眼就能认出来，这是 AI 写的。 AI时代，开始比拼UI的品味能力了，非常稀缺。今天推荐taste-skill 这个项目，已经14k stars了，干的事有点意思：它不写代码，它把排版、配色、字体、动效的设计规则全写成 SKILL.md，塞给 AI。相当于给 AI 配了个免费的艺术总监。仓库表面是十几套 SKILL.md 文件，实际在做一件事：把审美变成规则。外面还在卷 AI 写代码多快，它在卷 AI 写的页面能不能不像 AI。 DESIGN_VARIANCE、MOTION_INTENSITY、VISUAL_DENSITY，数值一调整个页面气质就换了，跟调相机参数似的，同一个场景，不同参数出来完全不同。它有三层做法： >读意图，自己推断你要什么风格。极简、奢侈、粗野，十几套自动匹配 >选底座，该 Tailwind 就 Tailwind，该 Material 就 Material，不自己瞎造 >禁 AI 默认审美，紫色渐变、居中 Hero、三列等大卡片，全禁我拿自己的AIGC产品跑了一遍。原来的页面代码不动，就加了一行 SKILL.md 进去，让 AI 按它的规则重新迭代，出来的页面焕然一新。不是重写，是同一个代码底子被审美规则过了一遍。实操很简单，就两步：装 skill：npx skills add --skill design-taste-frontend 然后把你现有的页面丢给 AI，加一句：按 taste-skill 规则迭代 UI。它自动读你的代码，出诊断，改字体、配色、间距、动效，不动你的功能逻辑。搞独立开发的、做 landing page 的，这个skill太重要了！

产品经理老王霸

26,647 次观看 • 1 个月前

这下前端有福了！最近 GitHub 上两个前端设计项目爆火，专门用来给 AI 提升审美。 1、 taste-skill 相当于给 AI 装了一套视觉自查系统。交付前会先按空间节奏、字体层级等原则自我审查一遍，能纠正瞎乱配色、教它用留白制造呼吸感，具备设计师质感。 2、impeccable 内置 23 个核心命令 + 一整套 AI 设计避坑指南，解决 AI 最爱犯的布局逻辑问题，复杂动效也能做到克制丝滑，直接拉到大厂响应式设计水准。一个管品位，一个管框架。两个一起喂给你的 AI，设计审美直接起飞。

这下前端有福了！最近 GitHub 上两个前端设计项目爆火，专门用来给 AI 提升审美。 1、 taste-skill 相当于给 AI 装了一套视觉自查系统。交付前会先按空间节奏、字体层级等原则自我审查一遍，能纠正瞎乱配色、教它用留白制造呼吸感，具备设计师质感。 2、impeccable 内置 23 个核心命令 + 一整套 AI 设计避坑指南，解决 AI 最爱犯的布局逻辑问题，复杂动效也能做到克制丝滑，直接拉到大厂响应式设计水准。一个管品位，一个管框架。两个一起喂给你的 AI，设计审美直接起飞。

阿西_出海

72,901 次观看 • 1 个月前

今天在Producthunt发现一个AI模型Kombai，可以理解Figma的界面设计并生成对应的前端代码，下面是他们官网的演示视频。从演示来看生成的代码还是不错的，它的优势在于他不要求设计稿的格式、层级和是否使用组件，无论你怎么嵌套和画出的界面它都能理解。这比之前通过传统工程化思路从设计稿生成代码要强多了。之前的一些工具要不是处理不了复杂样式，要不就是对设计师的设计稿格式有非常严格的要求。同时这个模型也支持通过自然语言生成前端界面的代码。官网链接：

今天在Producthunt发现一个AI模型Kombai，可以理解Figma的界面设计并生成对应的前端代码，下面是他们官网的演示视频。从演示来看生成的代码还是不错的，它的优势在于他不要求设计稿的格式、层级和是否使用组件，无论你怎么嵌套和画出的界面它都能理解。这比之前通过传统工程化思路从设计稿生成代码要强多了。之前的一些工具要不是处理不了复杂样式，要不就是对设计师的设计稿格式有非常严格的要求。同时这个模型也支持通过自然语言生成前端界面的代码。官网链接：

歸藏(guizang.ai)

78,671 次观看 • 2 年前

的人提了一个思路：用 AI 写代码之后，人应该审计划，不应该审代码。他的类比很准。写 C 语言的时候没人去检查编译器输出的汇编对不对，因为你信任编译器。AI 写代码也应该一样——你把精力花在计划对不对上，计划没问题就让它去生成。问题是 Claude Code 的计划是一大坨 Markdown，在终端里看得人眼花。他做了个 /visual-plan 技能，让 AI 用 MDX 组件输出计划：线框图、API 结构图、Schema 变更，都是可视化的，能拖能缩放。代码写完之后还有 /visual-recap，生成一份可视化变更总结。产品经理和设计师不用看代码 diff 也能看懂 AI 改了什么。

的人提了一个思路：用 AI 写代码之后，人应该审计划，不应该审代码。他的类比很准。写 C 语言的时候没人去检查编译器输出的汇编对不对，因为你信任编译器。AI 写代码也应该一样——你把精力花在计划对不对上，计划没问题就让它去生成。问题是 Claude Code 的计划是一大坨 Markdown，在终端里看得人眼花。他做了个 /visual-plan 技能，让 AI 用 MDX 组件输出计划：线框图、API 结构图、Schema 变更，都是可视化的，能拖能缩放。代码写完之后还有 /visual-recap，生成一份可视化变更总结。产品经理和设计师不用看代码 diff 也能看懂 AI 改了什么。

Vincent

12,896 次观看 • 1 个月前

Codex 重磅更新：Product Design 插件上线！以前 Codex 代码强但 UI 审美常被吐槽上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！确认了审美，再开始写代码，这种设计驱动的流程太专业了。丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！

Codex 重磅更新：Product Design 插件上线！以前 Codex 代码强但 UI 审美常被吐槽上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！确认了审美，再开始写代码，这种设计驱动的流程太专业了。丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！

爱丽丝呀！

138,496 次观看 • 1 个月前

Damn，这个必须卧槽一下了，Karpathy 的 CLAUDE.md 只有 65 行，居然能把 AI 编程准确率从 65% 拉到 94%，以22 万星标登顶 GitHub 趋势榜，而且绝大多数开发者还没读过，里面没有一行奇技淫巧，4 条规则全是同一个方向： → 先想清楚再写代码陈述假设，不确定就问，杜绝猜测 → 从最简方案入手只写能解决问题的最少代码，不加任何多余抽象 → 像手术一样精准修改不碰与需求无关的代码，每行改动都对应明确要求 → 以目标驱动执行写第一行代码前，把模糊指令转化为可验证的成功标准 65 行，4 条规则，每一条都在对抗开发者“先写再说”的本能，本质上是把慢下来这件事变成硬规则，趁别人还没保存，赶紧先存好 👇

Damn，这个必须卧槽一下了，Karpathy 的 CLAUDE.md 只有 65 行，居然能把 AI 编程准确率从 65% 拉到 94%，以22 万星标登顶 GitHub 趋势榜，而且绝大多数开发者还没读过，里面没有一行奇技淫巧，4 条规则全是同一个方向： → 先想清楚再写代码陈述假设，不确定就问，杜绝猜测 → 从最简方案入手只写能解决问题的最少代码，不加任何多余抽象 → 像手术一样精准修改不碰与需求无关的代码，每行改动都对应明确要求 → 以目标驱动执行写第一行代码前，把模糊指令转化为可验证的成功标准 65 行，4 条规则，每一条都在对抗开发者“先写再说”的本能，本质上是把慢下来这件事变成硬规则，趁别人还没保存，赶紧先存好 👇

AYi

1,078,682 次观看 • 2 个月前

我用Gemini3写了一个基于网格系统规则的LOGO生成器，片尾是完整动画效果。其主要功能有：生成器可以按特定网格规则生成家族套系logo，指定颜色，可根据颜色生成渐变阶梯式色彩或单色logo。可以生成首尾帧动画，做家族系LOGO之间的转换，也可以平铺LOGO成为辅助图形图案，非常方便的生成好看的mg动画。可一键保存jpg、png、eps矢量图片，动画可一键保存mp4。目前已经投入设计流程中使用。相信不久将来，设计师们都可以利用AI制作自己的设计工具，优化设计流程。

我用Gemini3写了一个基于网格系统规则的LOGO生成器，片尾是完整动画效果。其主要功能有：生成器可以按特定网格规则生成家族套系logo，指定颜色，可根据颜色生成渐变阶梯式色彩或单色logo。可以生成首尾帧动画，做家族系LOGO之间的转换，也可以平铺LOGO成为辅助图形图案，非常方便的生成好看的mg动画。可一键保存jpg、png、eps矢量图片，动画可一键保存mp4。目前已经投入设计流程中使用。相信不久将来，设计师们都可以利用AI制作自己的设计工具，优化设计流程。

DynamicWang

20,221 次观看 • 7 个月前

我现在尝试的方案是： 1. 先用出一个大概的风格，可以扩展不同的设计风格和布局，它可以把当前设计打包成一整套提示词，导出给其他 agents 使用。 2. 在其他 agents 比如我用 Replit ⠕ 还原，基本粘贴它的提示词都能完美还原，然后让 Replit 再基于这个设计完成其他页面和功能。(Replit agent 4.0 支持 canvas 也可以生成不同风格和布局的设计) 3. Replit 绑定 Github 后代码是实时同步到你的 repo 的，基本满意后 fork 到本地，让 Claude Code 重构。

我现在尝试的方案是： 1. 先用出一个大概的风格，可以扩展不同的设计风格和布局，它可以把当前设计打包成一整套提示词，导出给其他 agents 使用。 2. 在其他 agents 比如我用 Replit ⠕ 还原，基本粘贴它的提示词都能完美还原，然后让 Replit 再基于这个设计完成其他页面和功能。(Replit agent 4.0 支持 canvas 也可以生成不同风格和布局的设计) 3. Replit 绑定 Github 后代码是实时同步到你的 repo 的，基本满意后 fork 到本地，让 Claude Code 重构。

Ding

56,474 次观看 • 4 个月前

Karpathy 在一次采访里说了个很扎心的点：很多人每月花 20 美元订 Claude，但其实还停留在“问答使用”阶段。真正拉开差距的，是会不会用 AI 构建东西。他提到，自己发现过 4 类会把 Claude 写代码搞崩的行为，并整理成一个文件。后来有开发者把它扩展成 21 条规则发布，拿到 8.2 万星，还登上 GitHub 第一。更夸张的是，按这套规则调整后，代码准确率从 65% 提升到 94%。这说明 AI 编程的门槛已经变了。会不会写代码只是一层。会不会给 AI 建规则、拆任务、设边界、做反馈，才是下一层能力。

Karpathy 在一次采访里说了个很扎心的点：很多人每月花 20 美元订 Claude，但其实还停留在“问答使用”阶段。真正拉开差距的，是会不会用 AI 构建东西。他提到，自己发现过 4 类会把 Claude 写代码搞崩的行为，并整理成一个文件。后来有开发者把它扩展成 21 条规则发布，拿到 8.2 万星，还登上 GitHub 第一。更夸张的是，按这套规则调整后，代码准确率从 65% 提升到 94%。这说明 AI 编程的门槛已经变了。会不会写代码只是一层。会不会给 AI 建规则、拆任务、设边界、做反馈，才是下一层能力。

KK.aWSB

475,995 次观看 • 2 个月前

Google Stitch 大更新：号称是 Vibe Design 对着画布说话就能做设计 Figma 股价大跌8.8% 带来 5 大升级： 🎨 无限画布：以前是输入一句话等出图，现在有了一个真正的工作台。你可以把参考图、文字说明、代码片段全扔上去，AI 结合这些上下文帮你设计，更像在跟一个设计师协作。 🧠 更智能的设计 Agent：它现在能记住你整个项目的修改历史，不是每次从零开始理解你的需求。还能同时帮你推进多个方案，比如你想试三种不同风格的首页，它并行帮你搞，互不干扰。 🎙️ 语音交互：“这个按钮大一点""配色换暖色调""导航栏改成深色"，对着它说就行。不用停下来打字，边看边改，效率高很多。 ⚡ 即时原型：以前出的是静态图，现在点一下播放键，设计稿直接变成可以点击交互的原型。系统自动帮你算好"点这个按钮跳到哪个页面"。不用手动一根根连线了。 📐 新增了 DESIGN.md：把你的设计规范（配色、字体、风格）写成一个文件，不管是给 Stitch 用还是给 Claude Code、Cursor 这些 AI 编程工具用，都能读懂。设计规范不再锁死在一个工具里。

Google Stitch 大更新：号称是 Vibe Design 对着画布说话就能做设计 Figma 股价大跌8.8% 带来 5 大升级： 🎨 无限画布：以前是输入一句话等出图，现在有了一个真正的工作台。你可以把参考图、文字说明、代码片段全扔上去，AI 结合这些上下文帮你设计，更像在跟一个设计师协作。 🧠 更智能的设计 Agent：它现在能记住你整个项目的修改历史，不是每次从零开始理解你的需求。还能同时帮你推进多个方案，比如你想试三种不同风格的首页，它并行帮你搞，互不干扰。 🎙️ 语音交互：“这个按钮大一点""配色换暖色调""导航栏改成深色"，对着它说就行。不用停下来打字，边看边改，效率高很多。 ⚡ 即时原型：以前出的是静态图，现在点一下播放键，设计稿直接变成可以点击交互的原型。系统自动帮你算好"点这个按钮跳到哪个页面"。不用手动一根根连线了。 📐 新增了 DESIGN.md：把你的设计规范（配色、字体、风格）写成一个文件，不管是给 Stitch 用还是给 Claude Code、Cursor 这些 AI 编程工具用，都能读懂。设计规范不再锁死在一个工具里。

小互

112,850 次观看 • 4 个月前

让AI连续工作10小时不崩溃？揭秘Anthropic官方推崇的“Harness工程”！很多人用Claude Code跑长任务，跑着跑着AI就变傻、甚至罢工。原因很简单：上下文窗口爆了。今天分享一套让AI“无限续航”的系统级方案（Harness Engineering），不仅能让AI干活，还能让它自我进化。 1⃣ 核心原理：重置上下文 AI的记性有限。官方Anthropic的思路是：把大任务拆碎，每次只让AI在一个全新的、干净的上下文里干一件小事。 ❌ 错误做法：把所有需求一次性塞给AI。 ✅ 正确做法：拆解任务 -> 独立会话执行 -> 记录进度 -> 下一个循环。 2⃣ 方案对比：Ralph vs 多智能体方案A（Ralph循环）：用Bash脚本写个while循环，强制重启新会话。简单粗暴，适合极客。方案B（多智能体协同 - 推荐）：我在用的方案。更灵活，更像真实团队。主Agent（Coordinator）：只负责调度，绝不写代码（保持上下文极其干净）。子Agent（Workers）：计划、开发、测试（布局/美观/动画）。各司其职，独立上下文。 3⃣ 工作流设计（关键！）我的实战工作流：主Agent 接收需求 -> 丢给计划Agent 出排期。主Agent 拿到计划 -> 派给开发Agent 写代码（只传文件路径，不传大段代码！）。开发完 -> 派给测试Agent 找Bug。 Bug修复闭环：测试挂了？用 resume 参数唤醒同一个开发Agent修Bug（保留现场上下文），而不是开新号！ 4⃣ 让AI自我进化的Secret Sauce Lessons Learned：建一个经验库文件。每次踩坑，强制AI把错误写进去。下一次开发，先读这个文件，避免重复犯错。文件通信： Agent之间只传文件路径（Path），不传具体内容。主Agent的上下文永远只有几行字，永不爆窗。这套系统我跑了一个通宵，生成了20多页PPT，质量极高。真正的Harness不是让AI更聪明，而是设计一套不依赖AI记性的流程。

让AI连续工作10小时不崩溃？揭秘Anthropic官方推崇的“Harness工程”！很多人用Claude Code跑长任务，跑着跑着AI就变傻、甚至罢工。原因很简单：上下文窗口爆了。今天分享一套让AI“无限续航”的系统级方案（Harness Engineering），不仅能让AI干活，还能让它自我进化。 1⃣ 核心原理：重置上下文 AI的记性有限。官方Anthropic的思路是：把大任务拆碎，每次只让AI在一个全新的、干净的上下文里干一件小事。 ❌ 错误做法：把所有需求一次性塞给AI。 ✅ 正确做法：拆解任务 -> 独立会话执行 -> 记录进度 -> 下一个循环。 2⃣ 方案对比：Ralph vs 多智能体方案A（Ralph循环）：用Bash脚本写个while循环，强制重启新会话。简单粗暴，适合极客。方案B（多智能体协同 - 推荐）：我在用的方案。更灵活，更像真实团队。主Agent（Coordinator）：只负责调度，绝不写代码（保持上下文极其干净）。子Agent（Workers）：计划、开发、测试（布局/美观/动画）。各司其职，独立上下文。 3⃣ 工作流设计（关键！）我的实战工作流：主Agent 接收需求 -> 丢给计划Agent 出排期。主Agent 拿到计划 -> 派给开发Agent 写代码（只传文件路径，不传大段代码！）。开发完 -> 派给测试Agent 找Bug。 Bug修复闭环：测试挂了？用 resume 参数唤醒同一个开发Agent修Bug（保留现场上下文），而不是开新号！ 4⃣ 让AI自我进化的Secret Sauce Lessons Learned：建一个经验库文件。每次踩坑，强制AI把错误写进去。下一次开发，先读这个文件，避免重复犯错。文件通信： Agent之间只传文件路径（Path），不传具体内容。主Agent的上下文永远只有几行字，永不爆窗。这套系统我跑了一个通宵，生成了20多页PPT，质量极高。真正的Harness不是让AI更聪明，而是设计一套不依赖AI记性的流程。

Vincent

28,508 次观看 • 3 个月前

别再纠结选 Codex 还是 Claude Code 了！测了数十个 Agent 后发现，真正决定生产力上限的，不是工具本身，而是你配置的 Skills（技能）。今天分享 4 组顶级 Skills，让你的 AI 瞬间进化成一支专业团队！👇 1️⃣ 元能力扩展 (Meta Skills) Skill Creator: 不需要懂代码，用大白话描述需求，AI 自动帮你写 Skill、测试、迭代。 Find Skills: 不知道用什么工具？直接让 AI 去全网搜索、评估安装量，一键安装最靠谱的现成技能。 2️⃣ 工程化开发 (Engineering) Superpowers: 强制 AI 遵守 TDD（测试驱动开发）。先写测试，再写代码，红绿重构循环。告别“能跑就行”的垃圾代码。 GStack (by Garry Tan): YC 总裁亲自打造的“全能专家团队”。 /office-hours: 像严厉导师一样拷问你的需求，掐灭不靠谱假设。 /review: 资深工程师代码审查，找出上线即爆炸的隐患。 /ship: 自动同步、测试、推代码、开 PR，一气呵成。 3️⃣ 前端设计 (Frontend Design) frontend-design: 告别“AI 味”十足的紫色渐变和圆角卡片。它内置 50+ 顶级设计规范，让 AI 学会杂志排版、留白艺术，产出“耐看”的设计。 UI/UX Pro Max: 你的私人设计总监。内置 160+ 行业深度规则，告诉你金融类界面用什么配色显专业，医疗类用什么字体显安全。 4️⃣ 内容创作 (Content Creation - Baoyu Skills) Cover Image: 5 维控制系统（构图、色调、渲染等），一键生成专业级封面。 Infographic: 内置 21 种专业布局（鱼骨图、漏斗图等），自动分析文案逻辑并推荐布局。 Markdown-to-HTML: 专为微信公众号设计，自动处理代码高亮、数学公式，甚至把外链转为底部引用。 Translation: “正式出版”级翻译模式（分析->翻译->校正->润色），还能指定读者群体（如资深开发者），自动调整语气。 2026 年，一个人的代码产出可以是 2013 年的 240 倍。这不是因为 AI 写代码快，而是你一个人现在能顶一支小团队在干活。配置好你的 Skills，让 AI 真正为你打工！

别再纠结选 Codex 还是 Claude Code 了！测了数十个 Agent 后发现，真正决定生产力上限的，不是工具本身，而是你配置的 Skills（技能）。今天分享 4 组顶级 Skills，让你的 AI 瞬间进化成一支专业团队！👇 1️⃣ 元能力扩展 (Meta Skills) Skill Creator: 不需要懂代码，用大白话描述需求，AI 自动帮你写 Skill、测试、迭代。 Find Skills: 不知道用什么工具？直接让 AI 去全网搜索、评估安装量，一键安装最靠谱的现成技能。 2️⃣ 工程化开发 (Engineering) Superpowers: 强制 AI 遵守 TDD（测试驱动开发）。先写测试，再写代码，红绿重构循环。告别“能跑就行”的垃圾代码。 GStack (by Garry Tan): YC 总裁亲自打造的“全能专家团队”。 /office-hours: 像严厉导师一样拷问你的需求，掐灭不靠谱假设。 /review: 资深工程师代码审查，找出上线即爆炸的隐患。 /ship: 自动同步、测试、推代码、开 PR，一气呵成。 3️⃣ 前端设计 (Frontend Design) frontend-design: 告别“AI 味”十足的紫色渐变和圆角卡片。它内置 50+ 顶级设计规范，让 AI 学会杂志排版、留白艺术，产出“耐看”的设计。 UI/UX Pro Max: 你的私人设计总监。内置 160+ 行业深度规则，告诉你金融类界面用什么配色显专业，医疗类用什么字体显安全。 4️⃣ 内容创作 (Content Creation - Baoyu Skills) Cover Image: 5 维控制系统（构图、色调、渲染等），一键生成专业级封面。 Infographic: 内置 21 种专业布局（鱼骨图、漏斗图等），自动分析文案逻辑并推荐布局。 Markdown-to-HTML: 专为微信公众号设计，自动处理代码高亮、数学公式，甚至把外链转为底部引用。 Translation: “正式出版”级翻译模式（分析->翻译->校正->润色），还能指定读者群体（如资深开发者），自动调整语气。 2026 年，一个人的代码产出可以是 2013 年的 240 倍。这不是因为 AI 写代码快，而是你一个人现在能顶一支小团队在干活。配置好你的 Skills，让 AI 真正为你打工！

Vincent

67,649 次观看 • 2 个月前

终于有一套 Skill 能让 AI 的前端审美有灵魂了！爆款开源项目 Taste-Skill （ GitHub 33.3k🌟），直接给 Cursor、Claude、Codex 等 AI 工具装上了【审美大脑】！下面视频我做了很多页面，这些极简、轻奢风的页面，全靠这套skill做的～质感拉满了以前 AI 生成的页面总带着一股塑料感：布局僵硬、字体廉价、留白像 PPT、颜色土到炸…… 现在，AI 终于能写出大厂高级感了：审美基因注入：内置极简、高端轻奢、粗野主义、Minimalist 等多种高级调性，直接拉高 AI 的设计天花板 UI 视觉整容：自带审计+重构能力，老旧丑页面一键诊断升级参数化控场：创意度、动效强度、信息密度随便调，再也不用死板一套模板最佳搭配：先用 Taste-Skill 注入灵魂定调，再丢给 Claude/Cursor/codex 落地代码，质感直接起飞！感兴趣的朋友们，可以去看看哦～地址：

终于有一套 Skill 能让 AI 的前端审美有灵魂了！爆款开源项目 Taste-Skill （ GitHub 33.3k🌟），直接给 Cursor、Claude、Codex 等 AI 工具装上了【审美大脑】！下面视频我做了很多页面，这些极简、轻奢风的页面，全靠这套skill做的～质感拉满了以前 AI 生成的页面总带着一股塑料感：布局僵硬、字体廉价、留白像 PPT、颜色土到炸…… 现在，AI 终于能写出大厂高级感了：审美基因注入：内置极简、高端轻奢、粗野主义、Minimalist 等多种高级调性，直接拉高 AI 的设计天花板 UI 视觉整容：自带审计+重构能力，老旧丑页面一键诊断升级参数化控场：创意度、动效强度、信息密度随便调，再也不用死板一套模板最佳搭配：先用 Taste-Skill 注入灵魂定调，再丢给 Claude/Cursor/codex 落地代码，质感直接起飞！感兴趣的朋友们，可以去看看哦～地址：

爱丽丝呀！

201,621 次观看 • 1 个月前

05后女大学生嫌装修公司设计太土。自己写代码搞定了。 Codex CLI + Gemini，写规则文件，调API，把几百张线框图批量跑成效果图。灵感是贝聿铭的三角结构 + 瑰丽酒店的镜面设计。胡桃木 + 黄铜 + 无柱转角玻璃。装修预算从1000万冲到2000万，嫌设计师给的方案太土，干脆自己来。看完我只想说一句话：以后学AI编程，不只是为了找工作，是为了不被装修公司糊弄。你会用AI自己做室内设计吗？

05后女大学生嫌装修公司设计太土。自己写代码搞定了。 Codex CLI + Gemini，写规则文件，调API，把几百张线框图批量跑成效果图。灵感是贝聿铭的三角结构 + 瑰丽酒店的镜面设计。胡桃木 + 黄铜 + 无柱转角玻璃。装修预算从1000万冲到2000万，嫌设计师给的方案太土，干脆自己来。看完我只想说一句话：以后学AI编程，不只是为了找工作，是为了不被装修公司糊弄。你会用AI自己做室内设计吗？

Vincent

103,032 次观看 • 2 个月前

HeyGen这次开源，把AI做视频的最后一道门槛拆没了🤯 他们用Claude Code写代码，做了自己的50秒产品发布视频，然后把整个工具链完整开源给了所有人，致敬开源🫡 以后做视频真的能简单到离谱，给一句话，做一个30秒的产品介绍，给一个PDF，自动生成总结视频，迭代就是改一句话的事，比如把标题放大两倍，第三秒加一个淡入转场等，这个工具叫HyperFrames，本质上就是一个纯HTML转MP4的视频渲染框架。所以其实我们不用学任何剪辑软件，也不用写复杂的React代码，只要写普通HTML，加几个简单的data属性，就能定义视频的每一帧、时间线、动画和音轨。 HyperFrames从第一天起就是为AI代理原生设计的。 AI天生就会写HTML，现在Claude、Cursor、Gemini所有编码Agent，只要装一个skill，立刻就会做视频。这妥妥的降维打击啊，以前Remotion把视频变成了代码，但它需要你会React，需要构建流程，属于开发者专属的玩具。 HyperFrames是把视频变成了纯HTML，零构建，无DSL，不需要任何前置知识。说白了，Remotion是给人写的，HyperFrames是给AI写的。以前AI能写文字，能生成图片，但视频一直是最后一块硬骨头，现在这块骨头也被啃下来了。代理现在能端到端完成一整条内容流水线，调研，写脚本，做设计，加动画，最后直接渲染出成品视频，全程不需要人类碰一下。它还自带50+官方现成组件，社交遮罩、图表、转场，一行命令一键安装。支持GSAP、Lottie、Three.js所有主流动画库，随便混用。也就是说，同一份HTML永远出一样的结果，完美适合自动化流水线。官方甚至把视频语言都标准化了，缓动用snappy，bouncy，转场用能量等级，字幕分Hype/Corporate/Tutorial三种风格。 AI只要学会这套词汇，就能稳定输出专业级视频，这不就是在教AI做导演嘛🤣 这对HeyGen来说也是一步妙棋，他们不再只是一个卖AI头像的SaaS公司，现在能做整个AI视频时代的基础设施了，未来所有AI代理生成的视频都能跑在HyperFrames上。然后再无缝接入HeyGen的头像、语音、翻译能力，形成一个完美的闭环。当然目前也不是完美的，初期输出还有AI味，超过一分钟的复杂长视频，渲染还需要较强算力。但我觉得这都不重要，关键是它第一次把完整的视频生产力交给了AI Agent，相当于AI内容创作时代的又一个里程碑。想试的直接去GitHub搜heygen-com/hyperframes。跑一行npx hyperframes init，然后让Claude帮你做第一个视频。 #HyperFrames #HeyGen #AI视频 #AI代理 #开发者 #内容创作

HeyGen这次开源，把AI做视频的最后一道门槛拆没了🤯 他们用Claude Code写代码，做了自己的50秒产品发布视频，然后把整个工具链完整开源给了所有人，致敬开源🫡 以后做视频真的能简单到离谱，给一句话，做一个30秒的产品介绍，给一个PDF，自动生成总结视频，迭代就是改一句话的事，比如把标题放大两倍，第三秒加一个淡入转场等，这个工具叫HyperFrames，本质上就是一个纯HTML转MP4的视频渲染框架。所以其实我们不用学任何剪辑软件，也不用写复杂的React代码，只要写普通HTML，加几个简单的data属性，就能定义视频的每一帧、时间线、动画和音轨。 HyperFrames从第一天起就是为AI代理原生设计的。 AI天生就会写HTML，现在Claude、Cursor、Gemini所有编码Agent，只要装一个skill，立刻就会做视频。这妥妥的降维打击啊，以前Remotion把视频变成了代码，但它需要你会React，需要构建流程，属于开发者专属的玩具。 HyperFrames是把视频变成了纯HTML，零构建，无DSL，不需要任何前置知识。说白了，Remotion是给人写的，HyperFrames是给AI写的。以前AI能写文字，能生成图片，但视频一直是最后一块硬骨头，现在这块骨头也被啃下来了。代理现在能端到端完成一整条内容流水线，调研，写脚本，做设计，加动画，最后直接渲染出成品视频，全程不需要人类碰一下。它还自带50+官方现成组件，社交遮罩、图表、转场，一行命令一键安装。支持GSAP、Lottie、Three.js所有主流动画库，随便混用。也就是说，同一份HTML永远出一样的结果，完美适合自动化流水线。官方甚至把视频语言都标准化了，缓动用snappy，bouncy，转场用能量等级，字幕分Hype/Corporate/Tutorial三种风格。 AI只要学会这套词汇，就能稳定输出专业级视频，这不就是在教AI做导演嘛🤣 这对HeyGen来说也是一步妙棋，他们不再只是一个卖AI头像的SaaS公司，现在能做整个AI视频时代的基础设施了，未来所有AI代理生成的视频都能跑在HyperFrames上。然后再无缝接入HeyGen的头像、语音、翻译能力，形成一个完美的闭环。当然目前也不是完美的，初期输出还有AI味，超过一分钟的复杂长视频，渲染还需要较强算力。但我觉得这都不重要，关键是它第一次把完整的视频生产力交给了AI Agent，相当于AI内容创作时代的又一个里程碑。想试的直接去GitHub搜heygen-com/hyperframes。跑一行npx hyperframes init，然后让Claude帮你做第一个视频。 #HyperFrames #HeyGen #AI视频 #AI代理 #开发者 #内容创作

AYi

36,653 次观看 • 3 个月前

发现一个能赚钱的开源工具： pixel2motion — 上传静态Logo → AI自动生成矢量动画这意味着什么？在闲鱼/淘宝搜「Logo动画制作」，单价200-800元不等。以前接这种单需要：会AE + 会矢量设计 + 花2天做一个现在：上传图片 → AI生成 → 微调导出半小时搞定，收费不变。开源免费，成本为零。这就是2026年最典型的AI副业逻辑：用免费工具做别人不知道能自动化的事，赚的是信息差的钱。关键是：这个工具效果真不错。它不是普通描边，是AI做矢量路径建模 + 迪士尼动画法则优化。质量能打。

发现一个能赚钱的开源工具： pixel2motion — 上传静态Logo → AI自动生成矢量动画这意味着什么？在闲鱼/淘宝搜「Logo动画制作」，单价200-800元不等。以前接这种单需要：会AE + 会矢量设计 + 花2天做一个现在：上传图片 → AI生成 → 微调导出半小时搞定，收费不变。开源免费，成本为零。这就是2026年最典型的AI副业逻辑：用免费工具做别人不知道能自动化的事，赚的是信息差的钱。关键是：这个工具效果真不错。它不是普通描边，是AI做矢量路径建模 + 迪士尼动画法则优化。质量能打。

Vincent

36,318 次观看 • 23 天前

Figma 正式推出了官方的远程 MCP 服务器，现在不需要安装 Figma 客户端只需要在支持的软件比如 Cursor、Cluade code 里面添加，并在打开的网页里面完成账户授权就行而且现在设计组件和前端组件的映射信息也可以通过 MCP 获取到，如果你的团队有设计系统的话，然后你的设计稿组件采用程度高前端可以一键用 AI 生成全部的前端代码，而且保证高还原度，设计师和前端协作会到一个新的时代

Figma 正式推出了官方的远程 MCP 服务器，现在不需要安装 Figma 客户端只需要在支持的软件比如 Cursor、Cluade code 里面添加，并在打开的网页里面完成账户授权就行而且现在设计组件和前端组件的映射信息也可以通过 MCP 获取到，如果你的团队有设计系统的话，然后你的设计稿组件采用程度高前端可以一键用 AI 生成全部的前端代码，而且保证高还原度，设计师和前端协作会到一个新的时代

歸藏(guizang.ai)

157,557 次观看 • 10 个月前