打开AI工具，界面能跑但不耐看，你说不出问题在哪，代理更说不出该怎么改——这正是设计工程师最常撞见的困境，今天给大家介绍的emilkowalski/skills就是冲着这道坎去的。
这是什么
开发者 Emil Kowalski 在 Vercel 和 Linear 都干过设计工程师，这套工具把他攒下的审美经验拆成 AI 能读懂、能照做的规则集。
核心逻辑不复杂：AI 写代码没问题，判断"好看不好看"却经常翻车。入场动画该用 ease-out 却写成 ease-in，该用半透明阴影却塞了个实线边框——单看是小事，攒多了整个界面就从惊艳滑向平庸。这套技能包相当于把一个懂审美的老同事装进了 AI 里。
天天跟 Cursor、Claude Code 这类 AI 编程工具打交道、又要对界面质感负责的人最需要它。前端工程师、独立开发者、需要自己出 Demo 的产品经理都算在内。如果你的角色是"写页面还要顺手把动效调顺"，这个工具包几乎是量身定做的。 安装教程
终端里敲一行命令就够了：
不同 AI 工具的装法和存放路径不完全一样，你先对号入座：
装完记得跑一下测试调用，确认技能已经被识别，别等到真要用的时候才发现装漏了。
技能包里都有什么
六个技能各管一摊，你可以对照着找自己需要的那个：
| |
|---|
| 主技能，覆盖动画和设计建议的大部分场景，平时调用最多 |
| |
| |
find-animation-opportunities | |
| 提供精确动画术语，解决"知道效果说不出名字"的问题 |
| 把苹果 WWDC 的设计原则提炼成 Web 项目能直接用的标准 |
举个例子，你想问 iOS 那种拖到边界带阻力再弹回的效果叫什么，animation-vocabulary 会告诉你这叫 rubber-banding，术语对上了，后面跟 AI 沟通才不会鸡同鸭讲。
使用方法
调用分两种。显式调用最稳妥，直接在对话里点名，比如"使用 apple-design 构建一个 iOS 风格的底部弹窗"，这样审计力度会更严格。隐式触发靠 AI 自己根据任务描述判断该不该用，方便是方便，但准头不如显式调用。
实际效果举个例子，你审查一个弹窗动画，AI 会输出一张 Before / After / Why 的对照：
原因写得也很直白：all 会误伤不该动的属性，ease-in 会让进入动画开头那一下显得拖沓。这种带理由的修改建议，比"让动画更流畅一些"这种模糊指令有用太多。
使用技巧
分阶段用比一次性把所有技能塞进一个任务效果稳得多。你可以先用 animation-vocabulary 把想要的效果说准，再用 emil-design-eng 生成或者优化组件，最后拿 review-animations 过一遍质量关。
放到具体工作场景里，比如你正在赶一版落地页的弹窗交互，先问清楚术语，让 AI 按术语生成初版，再单独跑一次审查，比闷头改三四轮效率高得多。
判断该不该加动画也有章法：命令面板这类高频操作，动画建议直接砍掉，免得用户觉得慢；引导页这种低频场景，反而可以放开手脚做点表现力。
判断动效对不对，就看是不是用 transform 和 opacity 保证性能，有没有照顾到 prefers-reduced-motion 这类无障碍设置。
技能名称建议显式点出来，别指望 AI 每次都能猜对你要哪个。
这套专为设计工程师打造的Skill用下来最大的感受是，它没有替你做设计决定，而是把"好不好看"这件说不清道不明的事，变成了可以被检查、被复现的规则。界面这东西，细节堆起来才叫质感，这套工具至少让你不用再靠感觉赌运气。
AI 速览
