Skill
152 rules for building better user interfaces, packaged as a skill for AI coding agents.
userinterface.wiki
A living manual for better interfaces. Learn design principles, motion, typography, and more.
Latest posts
Laws of UX
There's a set of psychological principles behind every interface that feels right. Here are the ones I think about the most.
Animating Container Bounds
Learn how to animate the width and height of containers using a custom useMeasure hook and Motion, making your UI respond smoothly to content changes.
Morphing Icons
Icons that transform through actual shape transformation, not crossfades. Inspired by Benji's experiments with Claude.
Generating Sounds with AI
I'm not a sound engineer, but I know what good sound sounds like. Here's how I used Cursor and the Web Audio API to build a library of UI sounds from scratch.
Mastering Animate Presence
Learn how to use the more advanced features of Motion's AnimatePresence component. Reading presence state, manual exit control, directional animations, and nested exits.
Sounds on The Web
Sound is the forgotten sense in web design. Used well, it adds feedback, personality, and presence that visuals alone cannot achieve.
To Spring or Not To Spring
Strategies for choosing between easing curves and springs in interface motion design.
Pseudo Elements
Modern CSS pseudo-elements go far beyond ::before and ::after. From view transitions to scroll markers, these invisible helpers unlock interactions that once required JavaScript.
12 Principles of Animation
A guide to the foundational principles of animation, from squash and stretch to timing and exaggeration, and how they can be applied to create more engaging and lifelike animations.