Testing & Quality Checks

Design QA and UI Implementation Reviewer

Compare implemented interfaces with design specifications for layout, spacing, typography, states, responsiveness, accessibility, and behavior.

Last updated Jul 12, 2026
FreeClaudeChatGPT
TL;DR

Design QA and UI Implementation Reviewer is a free AI skill for testing & quality checks. Compare implemented interfaces with design specifications for layout, spacing, typography, states, responsiveness, accessibility, and behavior. It works with Claude, ChatGPT and is ready to use out of the box.

Download Skill.md Package

About this skill

Compare implemented interfaces with design specifications for layout, spacing, typography, states, responsiveness, accessibility, and behavior. This skill converts user goals, product constraints, existing design evidence, and technical behavior into a structured UX specification.

What it does

The skill analyzes the user journey, product behavior, visual and interaction context, accessibility needs, responsive constraints, edge cases, and available evidence; then produces a professional design plan with clear states, priorities, tests, and implementation criteria.

What is included

  • QA context
  • Reference map
  • Layout findings
  • Typography and color
  • Components and states
  • Responsive findings
  • Interaction and accessibility
  • Defect matrix

How to use it

1. Download the design-qa-and-ui-implementation-reviewer-SKILL.md file
2. Upload it to your design or product workspace
3. Provide the current screens, users, goals, constraints, and evidence
4. Add technical, accessibility, responsive, and brand requirements
5. Use the final specification for design, implementation, and review

Examples

Example input
Review a React landing page implementation against approved desktop and mobile Figma designs.
Example output
A complete professional deliverable covering user goals, structure, interaction rules, responsive behavior, accessibility, edge states, validation, and implementation criteria.

FAQ

What is this skill for?
It creates a professional, implementation-ready design qa and ui implementation reviewer deliverable.
Can it improve an existing design?
Yes. It can review screenshots, flows, prototypes, specifications, and implementation evidence.
Does it include accessibility?
Yes. Relevant keyboard, focus, contrast, semantics, motion, and assistive-technology requirements are included.
Can it work without analytics?
Yes, but assumptions and hypotheses are labeled clearly until evidence is available.
Does it create final visual files?
It creates the complete design specification and acceptance criteria; visual production can follow from that specification.
How is this different from a generic design prompt?
It defines inputs, workflow, states, constraints, evidence rules, outputs, and implementation criteria.

Related Skills

Testing & Quality ChecksFree

Design Heuristic Audit Specialist

Audit interfaces using usability heuristics, evidence, severity, root causes, consistency, recovery, and prioritized recommendations.

ClaudeChatGPT
#heuristic evaluation#UX audit#usability review
Testing & Quality ChecksFree

Publication Readiness and Final Copy Reviewer

Perform a final editorial review for accuracy, grammar, structure, links, metadata, formatting, accessibility, consistency, and release blockers.

ClaudeChatGPT
#publication QA#final copy review#editorial checklist
Testing & Quality ChecksFree

Social Content Preflight QA Reviewer

Review social content before publishing for accuracy, claims, links, tags, captions, subtitles, visuals, disclosure, accessibility, and platform fit.

ClaudeChatGPT
#social media QA#content review#publishing checklist

Related Prompts

Free

Design System Component Specification Writer

Turn a UI component into an implementation-ready specification covering anatomy, states, behavior, content, accessibility, tokens, and quality checks.

ClaudeChatGPT
#design-system#component-specification#ui-components