skills.rest
efekrbas
efekrbasCOMMUNITY
Explore all skills by this author →
Website𝕏@efekrbsGitHub

emil-design-eng

Review React, Tailwind, CSS, and Framer Motion interfaces for animation and interaction polish.

41|5|Updated Sep 30, 2025
Search Tags:#frontend#animation#ui design#interaction design#motion#component polish
One-click install
npx skills add https://github.com/efekrbas/discord-hypesquad-manager --skill emil-design-eng-efekrbas
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: emil-design-eng
Source: https://github.com/efekrbas/discord-hypesquad-manager/tree/main/.agents/skills/emil-design-eng
Command: npx skills add https://github.com/efekrbas/discord-hypesquad-manager --skill emil-design-eng-efekrbas

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you evaluate, refine, and build polished user interfaces that feel responsive, intentional, and high craft rather than merely functional.

Core Features & Use Cases

  • UI Polish Guidance: Improves spacing, timing, motion, and interaction details so interfaces feel more refined.
  • Animation and Motion Review: Helps choose easing, duration, transform behavior, and motion patterns that match product intent.
  • Component Craft Decisions: Guides buttons, popovers, tooltips, drawers, and other interactive elements toward more tasteful defaults.
  • Use Case: A product team can use it to review a React dashboard and identify where transitions, press states, and hover behavior need adjustment before launch.

Quick Start

Ask this skill to review your interface for motion, interaction, and component polish and tell you exactly what to improve.

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 refine frontend interaction design?▼

To improve UI polish, you should review and adjust frontend interaction design details like spacing, timing, and motion. Refining these elements ensures interfaces feel responsive and high craft rather than merely functional.

How do I choose the right easing and duration for Framer Motion animations?▼

Choosing the right easing and duration for Framer Motion animations requires matching motion patterns to your product intent. You should evaluate transform behavior and press states to ensure transitions feel intentional and performance-aware.

Does this UI animation review approach work with React and Tailwind CSS?▼

Yes, this UI animation review approach works directly with React and Tailwind CSS projects. It provides precise recommendations for component craft decisions, motion tuning, and accessibility within those frontend environments.

What is the best way to tune component transitions for high-craft interfaces?▼

The best way to tune component transitions is to review interactive elements like buttons and tooltips for transform origin and performance-aware behaviors. This ensures high-craft interfaces maintain tasteful defaults and responsive press states.

Why does my frontend animation feel unpolished despite using correct CSS transitions?▼

Your frontend animation might feel unpolished if the easing, duration, or transform origin mismatch the product intent. Reviewing motion patterns and interaction details helps identify where transitions, hover behavior, and press states need adjustment.

Related Skills

Explore More Design & Creative Skills→
deomiarndeomiarn

animation-library

Implement UI animations with Framer Motion, CSS, and scroll-triggered effects.

Community
Intermediate
phintruongphintruong

emil-design-eng

Review frontend UI component code for animation and interaction polish.

Community
Advanced
Dzakiamriz22Dzakiamriz22
1

framer-motion

Implement React animations with Framer Motion for layout transitions and gestures.

Community
Advanced
runkidsrunkids
11

ui-skills

Enforce UI constraints for accessible interfaces using Tailwind defaults and project primitives.

Community
Basic