frontend-design-optimizer

This Skill identifies evidence-based frontend UI/UX design patterns optimized for React, Vue, and vanilla JS projects. It provides production examples, code samples, and implementation guidance covering feature design, usability, accessibility compliance, and performance trade-offs to help you select and deploy the right pattern for your workflow.

The Skill delivers mobile-first responsive design strategies and WCAG accessibility considerations with actionable implementation plans. It analyzes design patterns against accessibility standards and performance implications, enabling you to build compliant, responsive interfaces across devices.

Yes. The Skill combines performance analysis with UX pattern research, delivering performance implications for each recommended pattern. You receive code samples, live examples, and implementation guidance to balance optimization with usability across your frontend architecture.

Production-ready patterns must satisfy functional requirements, include accessibility and performance validation, provide code examples, address trade-offs, and fit your tech stack. This Skill evaluates patterns against these criteria, delivering evidence-based recommendations with implementation plans and real-world examples.

Deep research analyzes patterns across real production scenarios, surface trade-offs, performance metrics, and accessibility compliance. This Skill generates multi-agent research outputs that go beyond generic guidelines, providing comparative analysis and context-specific pattern recommendations for your specific feature or workflow.