skills.rest
DVNghiem
DVNghiemCOMMUNITY
Explore all skills by this author →
GitHub

design-audit

Audits UI implementations fidelity against approved design artifacts and specifications.

20|3|Updated Apr 30, 2026
Search Tags:#design#ui#consistency#accessibility#audit#hierarchy#responsiveness
One-click install
npx skills add https://github.com/DVNghiem/FlowDeck --skill design-audit-dvnghiem
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-audit
Source: https://github.com/DVNghiem/FlowDeck/tree/main/src/skills/design-audit
Command: npx skills add https://github.com/DVNghiem/FlowDeck --skill design-audit-dvnghiem

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designed to address the drift between implemented UI and approved design artifacts, reducing inconsistencies, layout errors, and accessibility gaps.

Core Features & Use Cases

  • Compare UI implementations against design specs for hierarchy, spacing, and token usage.
  • Identify mismatches, responsiveness issues, and accessibility conformance in post-implementation reviews.
  • Use during design validations to ensure new features adhere to the design system and accessibility standards.

Quick Start

Review the implemented UI against the latest approved design artifacts and report any deviations.

Frequently Asked Questions about design-audit

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

FAQPage Schema
How do I check my UI implementation against approved design specs?▼

A UI design audit compares implemented UI screens against approved design artifacts to detect inconsistencies, layout errors, and accessibility gaps, ensuring the final product maintains fidelity to the original design system.

What is the best way to find design drift in post-implementation UI reviews?▼

Finding design drift requires validating implemented components against the approved design rubric, checking visual hierarchy, spacing, and token usage to catch mismatches and responsiveness issues before release.

Can I use a design audit to verify accessibility conformance and responsiveness?▼

Yes, a design audit catches accessibility conformance and responsiveness issues by validating implemented UI against approved design artifacts, ensuring new features adhere to established accessibility standards.

Does a UI design audit check for spacing and visual hierarchy mismatches?▼

Yes, the audit compares implemented UI against design specs to verify token usage, spacing, and visual hierarchy, reporting mismatches where the code deviates from the approved design artifacts.

When do I need to run a design validation for UI-heavy tasks?▼

Run a design validation during post-implementation reviews of UI-heavy tasks to ensure new features adhere to the design system, catching layout errors and accessibility gaps before deployment.

Why does my implemented UI drift from the approved design artifacts?▼

UI drifts from approved design artifacts when developers introduce inconsistencies in spacing, token usage, or visual hierarchy, requiring a post-implementation audit to detect and report the deviations.

Related Skills

Explore More Design & Creative Skills→
KevinKE93KevinKE93
42

frontend-ui-engineering

Implement frontend UI against design contracts with state, responsive, and accessibility coverage.

Community
Advanced
SChannarongSChannarong

frontend-design

Generate frontend code with accessibility, theming, and responsive behavior.

Community
Advanced
Higashi-KotaHigashi-Kota

accessibility-review

Audit design system tokens and components for WCAG compliance.

Community
Intermediate
robit-manrobit-man

regression-visual

Compare screenshots and analyze pixel differences across browsers and viewports.

Community
Advanced