moai-domain-uiux

Umiejętność do pracy z systemami designu na poziomie enterprise. Obejmuje architekturę komponentów (React 19, Vue 3.5), zgodność WCAG 2.2, integrację ponad 200 tys. ikon oraz zaawansowaną tematyzację. Wspiera design tokeny, dark mode, optymalizację dla czytników ekranu i nawigację klawiaturową. Idealna do budowania bibliotek komponentów, wdrażania dostępnych interfejsów i konfiguracji architektur tokenów dla projektów wieloplatformowych.

1. Zainstaluj umiejętność w swoim środowisku Claude Code, upewniając się, że masz dostęp do narzędzi Read, Grep, Glob i funkcji rozwiązywania bibliotek.

2. Aktywuj umiejętność, gdy pracujesz nad systemem designu, komponentami interfejsu lub zagadnieniami dostępności. Umiejętność automatycznie reaguje na słowa kluczowe takie jak "design system", "WCAG", "ARIA", "dark mode", "design tokens" lub nazwy popularnych bibliotek (shadcn/ui, Radix UI, Storybook).

3. Opisz swoje zadanie: budowanie biblioteki komponentów, wdrażanie zgodności dostępu, konfiguracja tokenów designu lub integracja systemu tematyzacji. Umiejętność wykorzysta wiedzę na temat W3C DTCG 2025.10, Style Dictionary 4.0 i wzorców Atomic Design.

4. Skorzystaj z wytycznych dotyczących architektur komponentów (React 19, Vue 3.5), standardów dostępności (WCAG 2.2 AA/AAA, optymalizacja czytników ekranu) i ekosystemów ikon (Lucide, React Icons, Tabler, Iconify, Hugeicons).

5. Pracuj z systemami tematyzacji opartymi na zmiennych CSS, trybami jasnym/ciemnym i dostawcami motywów do dostosowania brandingu na wielu platformach.

6. Wykorzystaj przepływy pracy Pencil MCP do dokumentacji i zarządzania tokenami designu w całym projekcie.