design

Enforce accessibility, consistency, and responsive design in UI/UX audits.

1|Updated Feb 19, 2026
Ready to run
npx skills add https://github.com/moveonha/pixel-ai-studio --skill design-moveonha
πŸ’¬ Prompt for ChatGPT / Claude Chatβ–Ό
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/moveonha/pixel-ai-studio/tree/main/.claude/skills/design
Command: npx skills add https://github.com/moveonha/pixel-ai-studio --skill design-moveonha

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI/UX ν’ˆμ§ˆμ„ 높이고 μ ‘κ·Όμ„± 및 일관성 μžˆλŠ” λ””μžμΈ μ‹œμŠ€ν…œ μ μš©μ„ 톡해 μ›Ήκ³Ό λͺ¨λ°”일 μ œν’ˆμ˜ μ‚¬μš©μž κ²½ν—˜μ„ κ°œμ„ ν•©λ‹ˆλ‹€. Nielsen νœ΄λ¦¬μŠ€ν‹±κ³Ό WCAG 2.2 AAλ₯Ό 기본으둜 ν•œ κ°€μ΄λ“œλΌμΈκ³Ό νŒ¨ν„΄μ„ μ œκ³΅ν•˜μ—¬ λ””μžμΈ νŒ€ κ°„μ˜ ν˜‘μ—…μ„ μ›ν™œν•˜κ²Œ λ§Œλ“­λ‹ˆλ‹€.

Core Features & Use Cases

  • Nielsen νœ΄λ¦¬μŠ€ν‹± 및 WCAG 2.2 AA μ€€μˆ˜ 기반의 포괄적 UI/UX 섀계 κ°€μ΄λ“œ
  • λ°˜μ‘ν˜• λ ˆμ΄μ•„μ›ƒ, λ””μžμΈ μ‹œμŠ€ν…œ ꡬ좕을 μœ„ν•œ 토큰 및 νŒ¨ν„΄ μ œμ‹œ
  • λžœλ”© νŽ˜μ΄μ§€, λŒ€μ‹œλ³΄λ“œ, 폼 λ“± μ£Όμš” ν™”λ©΄ μœ ν˜•λ³„ λ””μžμΈ νŒ¨ν„΄ 및 κ΅¬ν˜„ μ œμ•ˆ
  • λ””μžμ΄λ„ˆ, PM, 개발자 κ°„μ˜ κ·œλ²” μ •ν•©μ„± 확보λ₯Ό μœ„ν•œ ν˜‘μ—… μ‹œλ‚˜λ¦¬μ˜€ κ°€μ΄λ“œ
  • λ””μžμΈ μ‹œμŠ€ν…œ 토큰링, μ»΄ν¬λ„ŒνŠΈ μž¬μ‚¬μš©μ„± ν–₯상 및 μ ‘κ·Όμ„± 검증 체크리슀트 제곡

Quick Start

λžœλ”© νŽ˜μ΄μ§€ μ΄ˆμ•ˆμ˜ μ ‘κ·Όμ„±, λ°˜μ‘ν˜• 섀계, λ””μžμΈ μ‹œμŠ€ν…œμ˜ 일관성을 μ κ²€ν•˜λ„λ‘ μ§€μ‹œν•œλ‹€.

Frequently Asked Questions about design

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

FAQPage Schema
How do I audit a landing page for WCAG 2.2 AA accessibility compliance?β–Ό

To audit landing page accessibility for WCAG 2.2 AA compliance, evaluate UI components against enforced accessibility checklists and Nielsen heuristics. This process validates color contrast, semantic structure, and interactive elements to ensure usable responsive design across web and mobile products.

What is the best way to build a responsive design system with consistent UI tokens?β–Ό

Building a responsive design system with consistent UI tokens requires defining standardized design patterns and spacing variables for set responsive breakpoints. This ensures cohesive component reusability and visual consistency across different screen sizes during product implementation.

Can I use Nielsen heuristics to evaluate dashboard and form UI patterns?β–Ό

Yes, you can use Nielsen heuristics to evaluate dashboard and form UI patterns. Applying these usability principles during design audits helps identify interface inconsistencies and improves overall user experience quality across key screen types.

How do design system tokens improve collaboration between designers, PMs, and developers?β–Ό

Design system tokens improve collaboration between designers, PMs, and developers by providing a shared vocabulary for visual properties. Token mapping ensures normative alignment and eliminates ambiguity during handoff and component reuse across web and mobile teams.

Does this UI/UX design approach support both web and mobile responsive breakpoints?β–Ό

Yes, this UI/UX design approach supports both web and mobile responsive breakpoints. It enforces responsive layout guidelines and adaptable component patterns to maintain accessibility and visual consistency across varying device dimensions.

When should I not use a unified design system for product UI design?β–Ό

You should not use a unified design system when building highly experimental or short-lived single-page interfaces. Strict WCAG 2.2 AA adherence and token mapping are best suited for scalable, long-term products requiring rigorous consistency rather than rapid, unstructured prototyping.