polish

Perform a quality assurance pass on digital product interfaces.

Updated Jun 26, 2022
One-click install
npx skills add https://github.com/xlsama/use --skill polish-xlsama
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: polish
Source: https://github.com/xlsama/use/tree/main/config/agents/skills/polish
Command: npx skills add https://github.com/xlsama/use --skill polish-xlsama

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the critical final stage of development by meticulously refining user interfaces and experiences, ensuring a professional, high-quality output that delights users.

Core Features & Use Cases

  • Visual Consistency: Ensures alignment, spacing, and typography are pixel-perfect across all elements and breakpoints.
  • Interaction Polish: Guarantees all interactive states (hover, focus, active, disabled) are present and functional.
  • Smoothness: Optimizes transitions and micro-interactions for a fluid and jank-free experience.
  • Use Case: After a new feature is functionally complete, use this Skill to perform a final quality assurance pass, catching subtle visual bugs, inconsistent spacing, and ensuring all interactive elements behave as expected before release.

Quick Start

Run the polish skill to perform a final quality pass on the user interface.

Frequently Asked Questions about polish

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

FAQPage Schema
How do I perform a UI quality assurance pass on frontend design after a feature is complete?

A UI quality assurance pass systematically checks visual consistency, interaction states like hover and focus, and responsiveness to catch subtle bugs before release. This process refines alignment, spacing, and typography for a professional output.

What is UI polish in frontend development and when do I need it?

UI polish is the final refinement stage of digital products, addressing visual design and user experience details. You need it when a feature is functionally complete but requires pixel-perfect alignment, smooth transitions, and consistent interaction states.

How do I fix inconsistent spacing and missing interaction states in my design system?

Fix inconsistent spacing and missing interaction states by systematically checking elements against design principles and accessibility standards. Ensure all interactive states like hover, active, and disabled are present, functional, and visually aligned across breakpoints.

Do I need a frontend-design reference to check UI accessibility and responsiveness?

Yes, a frontend-design reference is required to perform systematic checks across responsiveness, performance, and code quality. It provides the baseline needed to verify adherence to design principles and accessibility standards during the polish process.

What's the best way to ensure visual consistency across all breakpoints and interactive elements?

The best way to ensure visual consistency is performing a comprehensive check of alignment, typography, and color across all breakpoints. Verify that transitions are jank-free and that all interactive elements behave as expected.

Why does my user interface feel unpolished even after development is finished?

An interface feels unpolished when subtle visual bugs, inconsistent spacing, or missing micro-interactions remain after functional development. Performing a comprehensive quality assurance pass catches these issues by refining interaction states and optimizing transitions.