ui-audit

Validate routed pages against design guidelines using Playwright checks.

Updated Mar 19, 2026
One-click install
npx skills add https://github.com/reckerswartz/resume_builder --skill ui-audit-reckerswartz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-audit
Source: https://github.com/reckerswartz/resume_builder/tree/main/.devin/skills/ui-audit
Command: npx skills add https://github.com/reckerswartz/resume_builder --skill ui-audit-reckerswartz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Auditors and UI engineers spend excessive time validating pages against design guidelines; this skill provides a repeatable, Playwright-driven workflow to detect deviations, ensure consistency, and track improvements over time.

Core Features & Use Cases

  • Continuous UI guideline audits across route surfaces and page families
  • Token compliance and component reuse verification using a shared UI surface
  • Accessibility checks and readability scoring with regression-aware logging
  • Use Case: run a guided audit on the current app surface to surface violations and guide refactors.

Quick Start

Run a UI audit cycle on the current app surface using the latest guidelines.

Frequently Asked Questions about ui-audit

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

FAQPage Schema
How do I automate UI guideline compliance checks across multiple Rails pages?

Automate UI guideline compliance checks across Rails pages using a Playwright-driven workflow that validates routed surfaces against design guidelines, ensuring consistency and tracking token compliance through data-driven scoring.

Can I run accessibility audits with Playwright on a Rails 8.1 Hotwire application?

Yes, you can run accessibility audits on a Rails 8.1 application using Hotwire, Tailwind, and ViewComponent by applying Playwright-based checks that evaluate readability, verify component reuse, and log regression-aware violations across public and admin surfaces.

What is the best way to prevent UI regression when reusing ViewComponent elements?

Prevent UI regression when reusing ViewComponent elements by running a continuous audit cycle that applies regression-aware logging and token compliance verification against a shared UI surface registry to detect deviations early.

Does this UI audit workflow support testing across workspace and admin route surfaces?

Yes, the UI audit workflow supports testing across public, workspace, builder, templates, and admin route surfaces by applying a rigorous registry-guided workflow to validate UI consistency and accessibility throughout the entire application.

How do I track UI design deviations and guide refactoring over time?

Track UI design deviations and guide refactoring over time by executing a guided audit cycle on your current app surface, which uses data-driven scoring and regression-aware logging to surface violations and monitor improvements across page families.

Why does my UI consistency break across different page families despite shared Tailwind tokens?

UI consistency breaks across page families when shared Tailwind tokens are not validated against the design guidelines registry; a Playwright-driven audit detects these token compliance deviations and surfaces component reuse violations for correction.