@emilkowalski: New skill: /apple-design Apple’s WWDC videos are a goldmine of knowledge. I’ve combed through my favorite ones and came…
Summary
A curated set of 17 design and motion principles distilled from Apple's WWDC videos, packaged as a reusable skill for design engineers to review and improve UI animations and interfaces.
View Cached Full Text
Cached at: 07/09/26, 11:52 PM
New skill: /apple-design
Apple’s WWDC videos are a goldmine of knowledge. I’ve combed through my favorite ones and came up with 17 design and motion principles.
Use them to review existing work or when working on something new to get it right.
https://t.co/jCwhthpi20
emilkowalski/skills
Source: https://github.com/emilkowalski/skills
Skills For Design 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’ll build animation expertise here:
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.
All these little 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 consinsts of mostly animation, but also some design advice.
- review-animations — Review your animations in a strict way, based on my rules.
- animation-vocabulary — Get better animations from an AI by telling it exactly what you want by using the right words.
- apple-design — Apple’s principles for interface design and fluid motion, distilled from their WWDC design talks and translated for the web.
Similar Articles
@yanliudreamer: Once again recommending the great @emilkowalski! He was my guide in learning Design Engineer. I've recommended his design skills before, very Apple-style https://github.com/emilkowalski/skills… (The name is cool…
Recommending Emil Kowalski's design skills and courses, which have an Apple style, aimed at helping designers and engineers build better user interfaces, with a special emphasis on animations and AI agent applications.
@dhruvtwt_: After spending the last few weeks trying out different skills from UI Skills These are the 10 that stood out to me the …
A tweet recommending 10 standout skills from the UI Skills platform, including design engineering, animation, accessibility, and various front-end tools, with a detailed deep-dive into the 'emil-design-eng' skill.
@tranmautritam: This is the best design engineering skill set I've seen. Each skill turns AI output into clean UI, not generic slop. Sa…
The tweet shares a skill set called 'UI Skills for Design Engineers' that helps turn AI-generated output into polished user interfaces, including specific skills for codebase auditing and UI design principles.
@aronhouyu: A new repository that can help AI make fewer mistakes when doing UI, give it a more premium feel, and create awesome animations. Lately, aside from daily work, I've been catching up on frontend and design knowledge https://github.com/emilkowalski/skills…
Introducing the emilkowalski/skills repository: a collection of skills for designers and engineers to help AI agents build user interfaces with fewer errors, higher design quality, and smooth animations.
@vista8: Found a frontend development Skill: for example, often not knowing technical terms makes it hard to write professional animations and interactions. You can use this Skill as a dictionary, e.g., ask animation-vocabulary "What is the name of the animation where list items pop up one by one?" Use emil-design-eng to polish the modal/button/page animation. Use review-animations to review animation issues.
Recommend several frontend animation-related Skill tools to help developers look up professional animation terms, refine interaction animations, and review animation issues.