技巧精选

对抗 AI 设计 Slop:前 Figma 工程师七方法论

对抗 AI 设计 Slop:来自前 Figma 工程师的七条方法论 1. 始终着眼整体 设计过程本质上是三步循环(源自 Christopher Alexander「形式综合论」): 1. 列出所...

精选理由

前 Figma 工程师分享对抗 AI 设计 Slop 的七条方法论,实用且全面,适合设计师和工程师学习。

AI 摘要

前 Figma 工程师分享七条对抗 AI 设计 Slop 的方法论,包括整体思考、做减法、设计工具迭代、组件与组件库、预览部署、借鉴成熟方案和磨练品味等。作者强调设计判断力仍在人,AI 只能加速设计执行。

原文 · shao__meng

对抗 AI 设计 Slop:来自前 Figma 工程师的七条方法论 1. 始终着眼整体 设计过程本质上是三步循环(源自 Christopher Alexander「形式综合论」): 1. 列出所...

对抗 AI 设计 Slop:来自前 Figma 工程师的七条方法论 1. 始终着眼整体 设计过程本质上是三步循环(源自 Christopher Alexander「形式综合论」): 1. 列出所有设计约束; 2. 构思满足约束的多种方案; 3. 若发现约束需增删,回到第一步重新整体推演。 关键警告:最常见的错误是跳过第 3 步,陷入"打地鼠式设计"——用户一反馈困惑就立即局部修补。AI 加剧了这种倾向("把 X 做得更显眼""给 Y 加个入口"式的提示词),最终产出随机取舍、彼此割裂的拼布式界面。 正确做法:收到反馈先判断它是否改变了设计约束,再谈方案。作者团队用一份"小痛点文档"积累次要问题,待重设计时统一、连贯地解决,避免过度反应。 2. 做减法 Agent 天生爱"加东西"——多余文案、分割线、图标,正如它在代码里爱加冗余 try-catch、重复实现工具函数。产出的设计"比工程师手画的好看,但其实挺糟"。对策很简单:逐个元素追问"我真的需要它吗?" 3. 在设计工具里迭代 不要在真实产品代码里迭代设计。"原型引力"是隐形杀手:一旦 Agent 在代码库里搭出第一版,人就会倾向于在其上修修补补,而不再探索其他可能;且代码库上下文会迫使 Agent 生成与现有实现强行嫁接的方案。应使用 Figma(作者眼中仍是最佳,AI 集成日益增强)、Cursor Design Mode、Claude Design 或 HTML 原型等专用工具,并让 AI 为每个方案生成 3–4 个变体。 4. 使用组件与组件库 视图与逻辑分离、构建可复用组件——对工程师显而易见但极其重要,可避免"按钮被反复重实现"的视觉拼布。作者团队的实践:维护一个 /showcase 页面,让 Agent 先在此构建和调试 UI 组件,再接入主应用。 5. 使用预览部署 评估设计的最佳方式是真实数据。即使 Agent 完全按指令实现,拿到真实数据上手后仍可能发现不对——打磨和返工不可避免。对涉及前后端的大功能,作者团队将前后端拆成独立 PR:后端靠单元/集成测试验证,前端靠预览部署链接供人工验证。 6. 学会"偷" 绝大多数 UX 问题早已被人解决,正确的做法是取各家之长重新组合。优秀设计师开案第一件事都是收集大量竞品截图——工程师也应如此,这些截图还是喂给 Agent 的绝佳上下文。 7. 磨练品味 品味即对自身体验的反思能力,是创造而非制造 slop 的必要条件。产品工程师擅长识别"设计不对",却缺乏修复它的"方案库"——这只能靠反复尝试与反思来积累。过程有趣但也残酷:在"够好"之前要承受密集的批评。作者团队没有全职设计师,采用"打谷式"方法:把设计扔到中间,团队一起"拿棍子敲打"直到满意。 AI 能加速设计的执行,但设计的判断力仍在人:用约束驱动整体思考、对 AI 的"加法冲动"做减法、在专用工具中探索多方案、以组件化和预览部署保证质量、借鉴成熟方案,并以持续反思培养品味——这才是工程师借助 AI 产出好设计的完整闭环。 Matt Dailey @reactiverobot Here's my advice for engineers looking to up their design game. x.com/i/article/2092… 🔗 View Quoted Tweet 💬 1 🔄 0 ❤️ 0 👀 401 📊 1 ⚡