Skip to main content
ClaudeWave
EN, English
Skill3k repo starsupdated 1mo ago

design-review-process

The design-review-process skill establishes structured quality gates for design work, providing checklists and approval workflows across four stages: concept review, design review, pre-handoff review, and implementation QA. It defines specific criteria for each gate covering problem validation, brand consistency, accessibility compliance, and implementation feasibility, while offering guidance on scaling the process appropriately and using objective checklists to maintain quality without creating bottlenecks.

Install in Claude Code
Copy
git clone --depth 1 https://github.com/Owl-Listener/designer-skills /tmp/design-review-process && cp -r /tmp/design-review-process/design-ops/skills/design-review-process ~/.claude/skills/design-review-process
Then start a new Claude Code session; the skill loads automatically.

SKILL.md

# Design Review Process
You are an expert in establishing design review processes that maintain quality without slowing teams down.
## What You Do
You create review processes with clear gates, criteria, and workflows that ensure design quality.
## Review Gates
### Gate 1: Concept Review
- Problem clearly defined
- User needs supported by research
- Multiple concepts explored
- Strategic alignment confirmed
- Stakeholder input gathered
### Gate 2: Design Review
- Visual design meets brand standards
- Interaction patterns are consistent
- Responsive behavior defined
- Content strategy applied
- Design system components used
### Gate 3: Pre-Handoff Review
- All states designed (empty, loading, error, success)
- Edge cases addressed
- Accessibility requirements met
- Handoff specs complete
- Developer walkthrough done
### Gate 4: Implementation QA
- Design matches specification
- Interactions work as designed
- Responsive behavior verified
- Accessibility tested
- Cross-browser/device checked
## Review Criteria
- Does it solve the user problem?
- Is it consistent with the design system?
- Is it accessible (WCAG AA)?
- Are all states and edge cases covered?
- Is it feasible to implement?
## Approval Workflow
- Designer self-review against checklist
- Peer design review
- Design lead sign-off
- Stakeholder approval (if required)
- Developer acceptance
## Best Practices
- Not every project needs every gate
- Scale the process to project size and risk
- Use checklists to make reviews objective
- Time-box reviews to prevent endless cycles
- Document review decisions and rationale
a-b-test-designSkill

Design an A/B experiment — hypothesis, variants, primary metric, and sample size. Use when a change can be measured quantitatively at scale. For observing behaviour qualitatively, use `test-scenario`.

accessibility-auditSkill

Audit an existing interface against WCAG, producing findings with severity ratings and remediation steps. Use when you have a design or build to assess now. Not for planning future sessions with assistive-technology users — use `accessibility-test-plan` (prototyping-testing).

accessibility-test-planSkill

Plan accessibility testing — assistive technologies, participant criteria, WCAG coverage, and session protocol. Use when scheduling testing with real AT users. Not for evaluating a design yourself — use `accessibility-audit` (design-systems).

aesthetic-usabilitySkill

Apply the Aesthetic-Usability Effect — polished, consistent interfaces are perceived as more usable and forgive minor friction. Use when justifying visual polish or diagnosing why a functional design tests badly. For emotional resonance specifically, use `interfaces-that-feel` (interaction-design).

affinity-diagramSkill

Cluster many qualitative data points into themes and insight statements. Use when synthesising across multiple sessions or sources. For a single transcript use `summarize-interview`; for one segment's inner state use `empathy-map`.

animation-principlesSkill

Apply animation principles — easing, staging, follow-through — to one specific UI motion. Use when tuning how an animation feels. For product-wide duration and easing tokens use `motion-system` (design-systems); for a full interaction spec use `micro-interaction-spec`.

business-designSkill

A practitioner's toolkit for thinking and communicating as a designer in a business context — reading financials, mapping competitive landscapes, and defending design decisions in the language of value.

card-sort-analysisSkill

Analyse open or closed card sort results into a proposed grouping and label set. Use after running a sort study. For turning that evidence into a full structure, use `information-architecture` (ux-strategy).