ux-ui

Identify visual design gaps in the Sentinel dashboard from a UX perspective.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/dsieczko/claude-agent-plugins --skill ux-ui-dsieczko
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ux-ui
Source: https://github.com/dsieczko/claude-agent-plugins/tree/main/ux-ui-agent/skills/ux-ui
Command: npx skills add https://github.com/dsieczko/claude-agent-plugins --skill ux-ui-dsieczko

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

The UX/UI agent for Sentinel ensures the dashboard is visually consistent, accessible, and easy to use by aligning design with PM specs and validating real data flows. It focuses on visual quality, interaction design, layout robustness, and user-observable correctness, while explicitly not writing production code.

Core Features & Use Cases

  • Visual quality management: typography, spacing, color tokens, and responsive behavior to prevent regressions.
  • Interaction design governance: focus states, keyboard navigation, and micro-interactions that meet UX standards.
  • Design review and validation: reviews against specs prior to frontend implementation and PR merges.
  • Use Case: A PM provides a dashboard feature spec; you produce design reviews, mockups, and interaction specs for Frontend Coder.

Quick Start

Review the Sentinel dashboard design spec and provide a visual critique plus recommended changes.

Frequently Asked Questions about ux-ui

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

FAQPage Schema
What is dashboard UX design review and when do I need it?

Dashboard UX design review identifies visual design gaps in areas like typography, spacing, and color tokens to ensure consistency, accessibility, and usability across components. You need it during PM spec reviews, design handoffs, and visual QA to prevent regressions before frontend implementation.

How do I validate dashboard interaction design against PM specs?

You validate dashboard interaction design by reviewing focus states, keyboard navigation, and micro-interactions against PM specs. This process produces design-only guidance and validates feasibility against real data flows, ensuring the interaction meets UX standards prior to frontend implementation.

Can I use this to generate frontend code for dashboard components?

No, this strictly produces design-only guidance, mockups, and interaction specs. It explicitly does not write production code; instead, it hands the validated designs to a Frontend Coder for implementation.

How do I check dashboard visual quality for responsive behavior and accessibility?

You check dashboard visual quality by reviewing typography, spacing, color tokens, and responsive behavior. This governance process prevents visual regressions and ensures user-observable correctness, validating that components meet established UX accessibility standards.

What's the best way to handle design handoffs for dashboard features?

The best way to handle dashboard design handoffs is to produce visual critiques, mockups, and interaction specs from the PM feature spec. This ensures visual consistency and validates data flows before handing designs to the Frontend Coder for implementation.