design-engineering

# Design Engineering Skill Based on Emil Kowalski's design engineering philosophy — UI polish, component craftsmanship, and the compound value of invisible details. ## Core Principles - **Taste is trainable.** Develops through studying exceptional work, reverse-engineering animations, and intentional practice. - **Invisible details create love.** Most UI refinements users never consciously register — but combined they produce something stunning. - **Beauty differentiates.** When functionality is table stakes, aesthetic excellence becomes genuine leverage. ## Animation Decision Framework ### Frequency determines approach | Usage Pattern | Strategy | |---|---| | 100+ daily | No animation | | Tens daily | Drastically reduce | | Occasional | Standard animation | | Rare/first-time | Add delight | **Never animate keyboard-initiated actions** — they repeat hundreds of times daily, making animation feel sluggish. ### Purpose validation Every animation requires justification: spatial consistency, state indication, explanation, user feedback, or preventing jarring transitions. "It looks cool" alone disqualifies frequent interactions. ### Easing rules | Direction | Easing | Why | |---|---|---| | Entering elements | `ease-out` | Immediate feedback | | On-screen movement | `ease-in-out` | Natural acceleration | | Hover/color changes | `ease` | Smooth transition | | Constant motion | `linear` | No acceleration | **Critical:** Abandon default CSS easings. Use custom curves: ```...