emil-design-eng

Analyze component design, motion behavior, and interaction feedback for UI polish.

Updated Jun 30, 2026
One-click install
npx skills add https://github.com/Festo-Wampamba/Claude-Features --skill emil-design-eng-festo-wampamba
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: emil-design-eng
Source: https://github.com/Festo-Wampamba/Claude-Features/tree/main/skills/emil-design-eng
Command: npx skills add https://github.com/Festo-Wampamba/Claude-Features --skill emil-design-eng-festo-wampamba

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you make user interfaces feel intentional, responsive, and visually refined instead of merely functional. It turns vague feedback like “this feels off” into concrete guidance on motion, spacing, interaction feedback, and visual polish.

Core Features & Use Cases

  • UI Review Guidance: Evaluates component behavior through a design-engineering lens and highlights where polish can be improved.
  • Motion Decisions: Advises when to animate, how fast to animate, which easing to use, and how to keep interactions responsive.
  • Interaction Details: Covers press states, popovers, tooltips, drawers, drag gestures, and other small details that shape perceived quality.
  • Performance and Accessibility: Encourages transform and opacity animations, reduced-motion support, and patterns that stay smooth under load.
  • Use Case: A product designer or frontend engineer can use this Skill to review a modal, dropdown, or toast system and produce actionable refinements that make the experience feel more premium and cohesive.

Quick Start

Review this interface and suggest specific design, motion, and interaction improvements using Emil Kowalski’s design engineering philosophy.

Frequently Asked Questions about emil-design-eng

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

FAQPage Schema
How do I improve UI polish and make frontend interactions feel less clunky?

Motion design in frontend review requires prioritizing transform and opacity animations to maintain performance under load. You should apply specific easing curves and ensure interactions remain responsive to make components feel visually refined rather than merely functional.

What's the best way to review component design for motion and interaction feedback?

Reviewing component design involves evaluating motion behavior and interaction feedback through a design-engineering lens. You analyze easing curves, transform origins, and accessibility constraints to produce actionable refinements that make modal and dropdown experiences feel premium.

How do I tune animation easing curves without breaking accessibility constraints?

Tuning animation easing curves while maintaining accessibility requires incorporating reduced-motion support and performance-safe CSS. By choosing interruptible motion choices and prioritizing transform and opacity, you ensure interactions stay smooth under load without violating accessibility constraints.

When do I need to use interruptible motion choices in frontend interactions?

Interruptible motion choices are needed in frontend interactions for components like popovers, tooltips, and drawers where perceived quality matters. They ensure animations remain responsive and do not block user input, maintaining a visually refined experience.

Does this approach to design systems work for dropdown and toast system reviews?

This approach to design systems works for dropdown and toast system reviews by evaluating component behavior, motion decisions, and interaction details. It produces actionable refinements that make these specific UI elements feel more premium and cohesive.