Skills For Design Engineers

面向设计师和工程师，帮助他们构建更好的用户界面。

判断自己在动画或整体设计上是否做出了正确的选择是很困难的。这些技能旨在帮助你更快地做出正确决策。

为什么使用它？

代理没有好的品味

我多次看到代理没有为动画选择合适的要素。例如，在入场动画中使用 ease-in 缓动，而实际上应该使用 ease-out（原因在此）。或者它们为你的界面选择实线边框，而不是半透明阴影。

所有这些小问题累积起来，会让你的界面要么令人惊叹，要么……不那么出色。

正如 Agents with Taste 中所解释的，这些技能列出了代理可能犯的所有小错误，并解释了如何修复它们。

这是通往优秀界面的捷径，是在一片平庸中脱颖而出的捷径。

技能

• emil-design-eng —— 主要技能，包含大部分动画建议以及一些设计建议。
• review-animations —— 基于我的规则，严格审查你的动画。
• improve-animations —— 审计代码库中的所有动画，获得优先级排序的、自包含的计划，任何代理均可执行。
• find-animation-opportunities —— 搜索你的 UI，找出真正能从动效中获益的位置，同时告诉你哪些地方不应该添加动画。
• animation-vocabulary —— 通过使用正确的词汇准确表达你的需求，让 AI 生成更好的动画。
• apple-design —— 苹果的界面设计和流畅动效原则，提炼自其 WWDC 设计讲座，并转化为适用于 Web 的实践。
• pick-ui-library —— 让代理根据我使用并信任的库来为任务选择合适的库，而不是让 AI 手工编写一个 toast 组件或安装一个被遗弃的包。
• prototype —— 构建你描述的 UI 组件的多个不同版本，并通过切换器浏览它们。