skills.rest
mariopak8-gif
mariopak8-gifCOMMUNITY
Explore all skills by this author →
GitHub

emil-design-eng

Provides UI/UX optimization and animation design engineering principles and best practices for software development workflows.

Updated Jun 2, 2026
Search Tags:#UI/UX#user experience#animation#UI design#design engineering#animation design
One-click install
npx skills add https://github.com/mariopak8-gif/lssc-one --skill emil-design-eng-mariopak8-gif
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: emil-design-eng
Source: https://github.com/mariopak8-gif/lssc-one/tree/main/.agents/skills/emil-design-eng
Command: npx skills add https://github.com/mariopak8-gif/lssc-one --skill emil-design-eng-mariopak8-gif

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides expert guidance on design engineering principles, optimizing UI/UX for exceptional user experiences.

Core Features & Use Cases

  • Philosophy Encapsulation: Offers a comprehensive overview of Emil Kowalski's design philosophy on UI polish, component design, and animation.
  • Review Format: Provides a structured format for reviewing UI code with a focus on subtle details that make software feel great.
  • Animation Framework: Includes a decision framework for animations, ensuring they serve a clear purpose and enhance the user experience.
  • Component Building Principles: Offers best practices for building responsive and visually appealing components.
  • CSS Transform Mastery: Delivers insights on using CSS transforms for animation and interaction design.
  • Gesture and Drag Interactions: Covers best practices for creating intuitive and responsive gestures and drag interactions.
  • Performance Rules: Provides guidelines for optimizing performance in UI animations and interactions.
  • Accessibility: Offers considerations for making design engineering more accessible to users with reduced motion preferences.
  • Sonner Principles: Applies principles from the Sonner UI library to create cohesive and effective UI components.

Quick Start

Invoke the emil-design-eng skill to get started on your design engineering project.

Frequently Asked Questions about emil-design-eng

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I apply design engineering principles to improve UI polish and component design?▼

You can optimize UI polish by applying component building best practices, CSS transform mastery, and a structured review format for UI code. This design engineering approach ensures responsive, visually appealing components and purposeful animations that enhance user experience.

What is the best way to implement purposeful animations in UI design?▼

The best way to implement UI animations is using a dedicated decision framework ensuring they serve a clear purpose. Apply CSS transforms for interaction design and follow performance rules to maintain smooth, accessible user experiences with reduced motion preferences.

How do I build intuitive gesture and drag interactions for web components?▼

Build intuitive gesture and drag interactions by following established best practices for responsiveness and visual feedback. Leverage CSS transforms and component design principles to create cohesive, performant UI interactions that enhance the user experience.

Do I need prior UI/UX design knowledge to use design engineering frameworks?▼

Yes, applying design engineering frameworks requires existing knowledge of UI/UX design principles and implementation techniques. This foundation is necessary to effectively review UI code, apply animation decision frameworks, and optimize component performance.

How do I make UI animations accessible for users with reduced motion preferences?▼

Make UI animations accessible by implementing specific considerations for reduced motion preferences within your design engineering workflow. Adapt CSS transforms and interaction patterns to respect user settings while maintaining functional and performant UI components.

Related Skills

Explore More Design & Creative Skills→
Nuu-maanNuu-maan
2

make-interfaces-feel-better

Apply design engineering principles to refine UI typography, surfaces, animations, and performance.

Community
Advanced
toddmoytoddmoy
1

animate

Design performant UI animations with CSS and Framer Motion.

Community
Advanced
mohamedgshoaibmohamedgshoaib
5

emil-design-eng

Encode design engineering principles for CSS transitions and spring animations.

Community
Advanced
Manish-Let-It-BeManish-Let-It-Be
1

emil-design-eng

Review UI code using Emil Kowalski's design engineering principles.

Community
Advanced