userinterface-wiki

The `userinterface-wiki` skill is a comprehensive guide for UI/UX best practices specifically tailored for web interfaces. It addresses common challenges in designing interactive and visually appealing web applications, helping developers, designers, and code reviewers ensure consistent, user-friendly experiences. By consolidating 152 rules across 12 categories, the skill provides clear guidance on implementing animations, typography, audio feedback, iconography, and other critical interface elements, highlighting the impact of each rule to prioritize development and review efforts.

This skill covers a wide range of capabilities including animation principles, timing functions, exit animations, CSS pseudo-elements, audio feedback, sound synthesis, morphing icons, container animation, laws of UX, predictive prefetching, typography, and visual design. Each category includes specific rules with prefixes that facilitate automated code review and generation. Key features include recommendations for gesture-based interactions, natural motion easing, modal and z-index handling, predictive prefetching for improved perceived performance, and adherence to cognitive psychology principles such as Fitts's, Hick's, and Miller's laws.

`userinterface-wiki` is intended for web developers, UI/UX designers, and teams performing automated or manual code reviews. It is particularly useful when reviewing CSS transitions, animations with frameworks like Framer Motion, interactive feedback mechanisms, typography setups, and visual design consistency. The skill ensures best practices are applied, helping teams create interfaces that are both performant and aligned with modern usability standards. It also serves as a reference for implementing accessibility-friendly interactions and precise timing for user-driven motions.