New skill: /find-animation-opportunities
Search your UI for places that would genuinely benefit from motion, while also telling you what not to animate.
New skill: /improve-animations
Inspired by @shadcn’s improve skill I made one specifically for animations.
Use your most capable model to audit animations in your project and hand the execution to cheaper models.
Fable is available through July 12, so make good use out of it!
显示更多
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.
显示更多
Some of my favorite UI libraries:
NumberFlow for animating numbers.
input-otp for one-time passwords.
Liveline for real-time charts.
Leva for customizable GUIs.
cmdk for command menus.
Virtuoso for virtualization.
dnd kit for drag and drop.
Sonner for notifications.
显示更多
New skill: /animation-vocabulary
Helps you get better animations from an AI by telling it exactly what you want by using the right words.
"morph", "rubber-banding", "layout animation", and more.
Don’t animate keyboard-initiated actions.
As an example, I use Raycast hundreds of times a day. If it animated every time I opened it, it would make it feel slow, delayed, and disconnected from my actions.
But there’s no animation at all. That’s the optimal experience.
显示更多
When it comes to more visual work, like animations, coding agents don’t quite know what great feels like yet.
Here’s my way of fixing it:
