---

name: designing-ui-ux description: Comprehensive framework for designing, auditing, and improving Web Design and UI/UX. Use this skill when the user asks to "design", "audit", "improve", or "review" the visual or experiential aspects of an application.

Modern Design & UX Excellence Framework

This skill provides a rigorous standard for creating world-class web experiences. It covers everything from visual polish to technical performance.

When to use this skill

• When designing a new feature or page.
• When conducting a UI/UX audit.
• When the user asks to make the site "look modern" or "feel premium".
• When fixing responsiveness or accessibility issues.

Workflow & Resources

This framework is divided into 5 specialist areas. Consult the relevant resource for your current task.

1. Visual Design & Aesthetics

For color harmony, typography, gradients, shadows, and component consistency: 👉 resources/visual-design.md

2. Responsiveness & Layout

For mobile-first strategies, fluid grids, breakpoints, and touch optimization: 👉 resources/responsive-arch.md

3. Interaction & Motion

For micro-interactions, animations, navigation patterns, and feedback states: 👉 resources/interaction-design.md

4. Technical Implementation

For CSS architecture, asset optimization, advanced accessibility (WCAG), and Core Web Vitals: 👉 resources/implementation.md

5. Quality Assurance & Audit

For heuristic evaluation, visual audits, and design debt management: 👉 resources/qa-audit.md

Core Principles

1. Aesthetics are Functional: A beautiful interface builds trust.
2. Performance is UX: A slow premium site is not premium.
3. Accessibility is Default: Inclusive design is better design for everyone.