@pengchujin: Lately, while working on APP development, I've been using a Skill called Apple Design, which compiles the interface and…

X AI KOLs Timeline Tools

Summary

The post introduces a GitHub project by Emil Kowalski featuring a collection of AI Agent Skills that help designers and engineers improve UI design, animations, and development practices based on Apple's principles.

Lately, while working on APP development, I've been using a Skill called Apple Design, which compiles the interface and motion principles from Apple's WWDC design talks into a guide to help improve interface hierarchy, feedback, and overall coherence. The practical results have been excellent—simple, restrained, and with a real native Apple App vibe. Author Emil Kowalski was previously a designer at Vercel and is now at Linear. Apple Design is one of the AI Agent Skills he curated, aimed at giving AI more "design taste" when creating interfaces, especially in animation choices, interaction details, and visual polish. Besides Apple Design, there are several others that are very practical too, with the project's GitHub Star count nearing 40k: http://github.com/emilkowalski/skills… "emil-design-eng: Design Engineering Principles" Focuses on the overall quality of UI, component design, animation choices, and interaction details. Ideal as a general design guide when developing new interfaces. "animate: Create Animations" Designs and implements animations from scratch. It first assesses whether an animation is necessary, then decides on its purpose, implementation method, properties, curves, and duration. Great for pop-ups, drawers, button feedback, and other motion effects. "review-animations: Review Animations" Checks if existing animations are reasonable, such as whether they're superfluous, if the speed feels sluggish, if the easing is appropriate, and whether reducing motion effects was considered. Suited for specialized reviews after animations are complete. "improve-animations: Improve Project Animations" Examines the animations across an entire project and compiles actionable improvement suggestions. Perfect for taking over existing projects or when you want to systematically elevate motion quality. "find-animation-opportunities: Find Animation Opportunities" Identifies where in the interface it's worth adding animations and where it shouldn't move. The emphasis isn't on "adding more animations," but on making motion truly help users understand operation feedback or interface states. "apple-design: Apple Style Design Principles" Compiles the interface and motion principles from Apple's WWDC design talks into a guide to help improve interface hierarchy, feedback, and overall coherence. "prototype: Create Multiple Prototype Options" Generates several different schemes for a UI requirement, making it easy to compare layouts and component forms. Useful when the design direction is still uncertain. "mobile-native: Optimize Mobile Web Experience" Helps web pages feel more like native apps on phones, focusing on details like safe areas, touch feedback, input field scaling, and mobile viewports. "write-swift: Write Modern Swift" Covers Swift engineering practices like value types, concurrency, generics, performance, and testing. Ideal for writing and organizing Swift code. "pick-ui-library: Select UI Component Libraries" Picks suitable component libraries based on needs, avoiding the unnecessary hand-coding of complex components or introducing poorly maintained dependencies.
Original Article
View Cached Full Text

Cached at: 09/22/26, 03:44 AM

Lately, while working on APP development, I’ve been using a Skill called Apple Design, which compiles the interface and motion principles from Apple’s WWDC design talks into a guide to help improve interface hierarchy, feedback, and overall coherence. The practical results have been excellent—simple, restrained, and with a real native Apple App vibe.

Author Emil Kowalski was previously a designer at Vercel and is now at Linear. Apple Design is one of the AI Agent Skills he curated, aimed at giving AI more “design taste” when creating interfaces, especially in animation choices, interaction details, and visual polish. Besides Apple Design, there are several others that are very practical too, with the project’s GitHub Star count nearing 40k: http://github.com/emilkowalski/skills…

“emil-design-eng: Design Engineering Principles” Focuses on the overall quality of UI, component design, animation choices, and interaction details. Ideal as a general design guide when developing new interfaces.

“animate: Create Animations” Designs and implements animations from scratch. It first assesses whether an animation is necessary, then decides on its purpose, implementation method, properties, curves, and duration. Great for pop-ups, drawers, button feedback, and other motion effects.

“review-animations: Review Animations” Checks if existing animations are reasonable, such as whether they’re superfluous, if the speed feels sluggish, if the easing is appropriate, and whether reducing motion effects was considered. Suited for specialized reviews after animations are complete.

“improve-animations: Improve Project Animations” Examines the animations across an entire project and compiles actionable improvement suggestions. Perfect for taking over existing projects or when you want to systematically elevate motion quality.

“find-animation-opportunities: Find Animation Opportunities” Identifies where in the interface it’s worth adding animations and where it shouldn’t move. The emphasis isn’t on “adding more animations,” but on making motion truly help users understand operation feedback or interface states.

“apple-design: Apple Style Design Principles” Compiles the interface and motion principles from Apple’s WWDC design talks into a guide to help improve interface hierarchy, feedback, and overall coherence.

“prototype: Create Multiple Prototype Options” Generates several different schemes for a UI requirement, making it easy to compare layouts and component forms. Useful when the design direction is still uncertain.

“mobile-native: Optimize Mobile Web Experience” Helps web pages feel more like native apps on phones, focusing on details like safe areas, touch feedback, input field scaling, and mobile viewports.

“write-swift: Write Modern Swift” Covers Swift engineering practices like value types, concurrency, generics, performance, and testing. Ideal for writing and organizing Swift code.

“pick-ui-library: Select UI Component Libraries” Picks suitable component libraries based on needs, avoiding the unnecessary hand-coding of complex components or introducing poorly maintained dependencies.


emilkowalski/skills

Source: https://github.com/emilkowalski/skills

opengraph-image-pwu6ef

Skills For Designers and Engineers

skills.sh

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.
  • 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.
  • write-swift — Write modern Swift. Includes: value types, Swift 6 concurrency, generics, performance, and Swift Testing.
  • pick-ui-library — Have your agent pick the right library for the task based on libraries I use and trust, instead of letting AI hand-roll a toast component or install an abandoned package.
  • prototype — Build multiple different versions of a UI piece you describe and go through them using a switcher.
  • mobile-native — Make your web app feel native on a phone: sticky hover states, tap highlight flashes, the 100vh bug, inputs that zoom the page, laggy taps, safe areas, and the rest of the small fixes that separate a website from an app.
  • ask-sonner — Your guide to working with Sonner, my toast library. Contains setup, styling, recipes, and fixes for the most common issues.

Similar Articles