mirror of
https://github.com/emilkowalski/skills.git
synced 2026-07-24 12:44:08 +08:00
Emil Kowalski
44 lines
2.3 KiB
Markdown
44 lines
2.3 KiB
Markdown
# Skills For Design Engineers
|
||
|
||
[](https://skills.sh/emilkowalski/skills)
|
||
|
||
For designers and engineers to help them build better user interfaces.
|
||
|
||
Knowing whether you made a right choice when it comes to animations, or design in general, is hard. These skills aim to help you get to those right decisions faster.
|
||
|
||
They are based on my years of experience working at companies like Vercel and Linear.
|
||
|
||
All the skills here are a side-effect of domain-expertise. AI doesn’t replace such expertise, it amplifies what you can get out of it and makes you way better relative to others.
|
||
|
||
So learn to code, design, or develop expertise in any other field. It’s extremely valuable.
|
||
|
||
I add and improve these skills often. Sign up to the newsletter below and I'll let you know about any updates or new skills.
|
||
[Sign Up To The Newsletter](http://animations.dev/skills)
|
||
|
||
## Install
|
||
|
||
```bash
|
||
npx skills@latest add emilkowalski/skills
|
||
```
|
||
|
||
## Why use it?
|
||
|
||
Agents don’t have great taste
|
||
|
||
I have seen plenty of times that agents don’t pick the right ingredients for an animation. An `ease-in` easing for an enter animation when it’s supposed to be `ease-out` ([here’s why](https://emilkowal.ski/ui/7-practical-animation-tips#4.-choose-the-right-easing)). Or they choose a solid border instead of a semi-transparent shadow.
|
||
|
||
All these little things compound and make your interface either amazing, or just... not that great.
|
||
|
||
As explained in [Agents with Taste](https://emilkowal.ski/ui/agents-with-taste), these skills list all the little mistakes agents can potentially make and explain how to fix them.
|
||
|
||
This is your shortcut to great interfaces. A shortcut to stand out in a sea of slop.
|
||
|
||
|
||
## Reference
|
||
|
||
- **[emil-design-eng](./skills/emil-design-eng/SKILL.md)** — The main skill that consinsts of mostly animation, but also some design advice.
|
||
- **[review-animations](./skills/review-animations/SKILL.md)** — Review your animations in a strict way, based on my rules.
|
||
- **[animation-vocabulary](./skills/animation-vocabulary/SKILL.md)** — Get better animations from an AI by telling it exactly what you want by using the right words.
|
||
- **[apple-design](./skills/apple-design/SKILL.md)** — Apple's principles for interface design and fluid motion, distilled from their WWDC design talks and translated for the web.
|
||
|