ES

emilkowalski/skills

研究分析

本页由 AI 翻译,技术细节请以原文为准。 查看原文

5.1万 stars 质量 75 趋势 100MIT

设计师和工程师的技能。

概览

为设计师和工程师提供帮助构建更好的用户界面。 判断自己在动画或设计方面是否做出了正确的选择,这很难。这些技能旨在帮助你更快做出正确的决定。 这些经验基于我在Vercel和Linear等公司的多年工作经验。 这里的所有技能都是领域专长的副产品。AI并不能取代这些专长,它放大你能获得的,让你相对于别人更强。 所以学习编程、设计,或者在其他领域积累专业知识。这非常有价值。 我见过很多次,特工们没有为动画选对元素。比如在回车动画里选择了缓入的缓和,而这本该是缓缓的(原因如下)。或者他们选择了实心边框而不是半透明阴影。 这些小细节叠加起来,让你的界面要么非常出色,要么......并不怎么样。

概述(AI 翻译)

为设计师和工程师提供帮助构建更好的用户界面。

判断自己在动画或设计方面是否做出了正确的选择,这很难。这些技能旨在帮助你更快做出正确的决定。

这些经验基于我在Vercel和Linear等公司的多年工作经验。

这里的所有技能都是领域专长的副产品。AI并不能取代这些专长,它放大你能获得的,让你相对于别人更强。

所以学习编程、设计,或者在其他领域积累专业知识。这非常有价值。

你可以在这里随时了解我的技能动态:

订阅新闻通讯

安装

为什么要用它?

经纪人品味不好

我见过很多次,代理们没有为动画选对元素。比如用ease-in缓缓调整回车动作,而本应是ease-out(原因如下)。或者他们为你的UI选择了实心边框而不是半透明阴影。

这些小细节叠加起来,让你的界面要么很棒,要么…不太好。

本页由 AI 翻译,技术细节请以原文为准。

README

以下为原文 README 节选,完整内容请查看原文。

Skills For Designers and Engineers

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.

You can stay up to date with my skills here:

Sign Up To The Newsletter

Install

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). Or they choose a solid border instead of a semi-transparent shadow for your UIs.

All these small things compound and make your interface either amazing, or just… not that great.

As explained in 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 — The main skill that consists of mostly animation, but also some design advice.
  • animate — Builds an animation from scratch while choosing the correct curve, duration, properties, and so on.
  • animate-expo — The same bar, for React Native and Expo: gestures, sheets, haptics, screen transitions, and keeping motion off the JS thread.
  • review-animations — Review your animations in a strict way, based on my rules.
  • improve-animations — Audit all the animations in your codebase and get prioritized, self-contained plans that any agent can execute.
  • find-animation-opportunities — Search your UI for places that would genuinely benefit from motion, while also telling you what not to animate.
在 GitHub 查看完整 README

推荐工具

换一个关键词,或者移除筛选条件。

安装

npx skillfish add emilkowalski/skills
新手?先看 mcpskill.org 教程 →