eval-ui-ux

Evaluate UI/UX for design system adherence, visual consistency, and accessibility.

Updated Mar 7, 2026
One-click install
npx skills add https://github.com/Geargrindadmin/gg-agentic-harness --skill eval-ui-ux-geargrindadmin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: eval-ui-ux
Source: https://github.com/Geargrindadmin/gg-agentic-harness/tree/main/.agent/skills/eval-ui-ux
Command: npx skills add https://github.com/Geargrindadmin/gg-agentic-harness --skill eval-ui-ux-geargrindadmin

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the comprehensive evaluation of user interface and user experience elements within software development tracks, ensuring design consistency, usability, and adherence to established standards.

Core Features & Use Cases

  • Design System Adherence: Verifies that components and layouts use defined design tokens for colors, spacing, typography, etc.
  • Visual Consistency: Checks for uniform styling and component appearance across different parts of the application.
  • Responsive Behavior: Assesses how the UI adapts to various screen sizes and devices.
  • Accessibility Baseline: Performs a foundational check for common accessibility issues.
  • Use Case: After a developer implements a new set of screens for a mobile app, this Skill can be dispatched to perform a thorough review, flagging any deviations from the design system, responsiveness issues, or basic accessibility concerns before human review.

Quick Start

Use the eval-ui-ux skill to evaluate the design system adherence for the components in the src/components directory.

Frequently Asked Questions about eval-ui-ux

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

FAQPage Schema
How do I evaluate UI/UX design system adherence for my application components?

To evaluate UI/UX design system adherence, use this Skill to verify that components and layouts use defined design tokens for colors, spacing, and typography, flagging any deviations from your established standards.

Can I check responsive behavior and visual consistency across different screen sizes?

Yes, you can check responsive behavior and visual consistency by assessing how the UI adapts to various screen sizes and devices, ensuring uniform styling and component appearance across different parts of the application.

What do I need to perform an accessibility baseline check on my UI components?

To perform an accessibility baseline check, you need access to track specifications, design system references, component files, and data files so the Skill can identify common accessibility issues comprehensively.

When should I use an automated UI/UX evaluation for my mobile app screens?

Use automated UI/UX evaluation after a developer implements new screens to flag design system deviations, responsiveness issues, component state errors, and basic accessibility concerns before human review.

Does this UI/UX evaluation cover component states and animations?

Yes, this UI/UX evaluation covers component states and animations, performing checks for visual consistency, layout structure, and usability through copy quality assessment alongside the other design checks.

What is the best way to automate visual track evaluation for screen implementations?

The best way to automate visual track evaluation is dispatching this Skill to review screen implementations against design system references, checking layout structure, component states, and accessibility baseline comprehensively.