给 AI 布置任务的时候,它特别喜欢按照我说的原话一字不差执行,很多地方其实我自己也没想清楚,只是给 AI 表述了一个大概的意思,希望它能够发散。 遇到这种情况,我经常会祭出下面这条常用的 prompt,在完成第一版 spec 文档后,扔过去,让它继续完善。最后记得要骂他一句“蠢货”,效果还会提升: """ 你对需求的理解还是太浅了。现在你做的事情,是把所有任务都拆成了非常细致的工作项,这样确实清晰,但也把问题做窄了。你只是把我写出来的内容,机械地变成一个个子任务,却没有真正理解我想达成的目标。 我想做的事情远不止这些。我给出的 PRD、系分、测分,很多地方只是点到为止,并没有展开说明,这些地方本来就需要你去补全,而不是停在原地做拆分。因此,你需要站在整体目标的角度,把这些内容重新做一轮设计优化,把缺失的部分补齐。 在这个过程中,你要重点从交互设计入手,把用户在系统里的行为路径想清楚,每一步是怎么发生的,状态是怎么变化的,用户能看到什么反馈。很多系统最后做不出来,不是因为功能不清楚,而是交互没有被想透。你需要把这个过程讲清楚,细到可以直接指导实现。 同时,也要把实现这套交互所需要的接口和数据结构一起补出来,接口之间怎么调用,数据怎么流转,数据库该怎么设计,这些都需要成体系地补齐。不要只围绕我写的内容打转,我没有写出来的部分,才是你需要真正发挥能力的地方。 最后,你需要再站在“这个系统能不能被完整实现”的角度,重新做一轮 review。不要只做到“能解释”,而是要做到“能落地”。如果只是把我写的几句话实现出来,那这件事情其实没有完成。蠢货! """
推荐 Top10:面向 前端 / 产品 / UI 的 Agent Skills 这 10 个 Skills 考虑到设计落地频率、对视觉/交互质量的直接提升、在 Codex/Claude Code 等的高复用性。 1. frontend-skill 来自 OpenAI,适合做 landing page、品牌页、demo 页。强项是视觉论点、内容节奏、首屏质量。 2. frontend-design 来自 Anthropic,更偏“高完成度、强风格”的前端设计实现。适合你想把页面做得更有辨识度时用。 3. figma-implement-design 来自 OpenAI,设计稿到代码的核心 skill。凡是产品/设计/前端协作,这个都应该是常用项。 4. web-design-guidelines 来自 Vercel,做 UI 审查非常强。可访问性、表单、动效、排版、交互细节,都能系统性补漏。 5. react-best-practices 来自 Vercel,如果你做 React / Next.js,这个基本必装。它提升的是“实现质量”和“性能质量”。 6. playwright 来自 OpenAI,前端不是只写代码,还要验证真实浏览器行为。这个是 UI 流程调试和回归检查的通用执行层。 7. webapp-testing 来自 Anthropic,比 playwright 更贴近日常本地应用验证,适合检查页面行为、截图、日志和交互回归。 8. canvas-design 来自 Anthropic,适合更自由的视觉探索、展示型页面、画布式交互或概念设计,不是每个项目都需要,但做创意产品页很有价值。 9. brand-guidelines 来自 Anthropic,如果你在做官网、营销页、设计系统、品牌一致性,这个比单纯“写 UI”更上层,适合产品/品牌协同。 10. vercel-deploy-claimable 来自 Vercel,严格说它不是设计 skill,但对前端/产品工作流非常关键。做完页面立刻可部署预览,反馈闭环会快很多。 - 怎么选?- · 偏品牌官网/营销页:frontend-skill、frontend-design、brand-guidelines · 偏产品 UI/设计稿还原:figma-implement-design、react-best-practices、web-design-guidelines · 偏交互验证/可用性:playwright、webapp-testing · 偏创意探索:canvas-design