ux-auditlisted

# Nova UX Audit 5인 적대적 평가자(Adversarial Jury)로 UI/UX를 다관점 심층 평가한다. 각 평가자는 서로 다른 페르소나로 독립 분석하며, 결과를 종합하여 우선순위 개선 목록을 도출한다. > "사용자는 코드를 보지 않는다. 사용자가 보는 것만이 진실이다." ## 핵심 원칙 - **독립 평가**: 5인 전원 독립 서브에이전트로 실행 (상호 영향 금지) - **코드 기반**: 실제 컴포넌트/i18n/스타일 코드를 읽고 분석 (추측 금지) - **분석 전용**: 평가자는 코드를 수정하지 않는다 - **최신 기준**: WCAG 2.2, Core Web Vitals (INP), EU DSA 2024 기준 적용 ## 옵션 | 플래그 | 동작 | |--------|------| | (없음) | 5인 평가 + 종합 보고 | | `--target <경로>` | 평가 범위 지정 (기본: 프론트엔드 전체 자동 탐색) | | `--screenshot` | Puppeteer로 실제 화면 캡처 후 평가 (dev 서버 실행 필요) | | `--live <URL>` | Computer Use로 실제 브라우저에서 앱을 조작하며 평가 (예: `--live http://localhost:3000`) | | `--sprint` | 결과를 스프린트로 자동 분할 | | `--fix` | Critical/High 자동 수정 제안 (사용자 승인 필요) | | `--a11y` | 접근성 평가자를 Full 모드로 강제 (WCAG 전 항목 검사) | ## 실행 플로우 ### Phase 1: 환경 분석 1. 프론트엔드 기술 스택 감지 (React/Vue/Svelte/Angular/etc.) 2. `--target` 지정 시 해당 경로, 미지정 시 프론트엔드 루트 자동 탐색 3. i18n 파일, 테마/디자인 토큰, 라우트 구조, 컴포넌트 디렉토리 파악 4. `--screenshot` 시: dev 서버 기동 확인 → Puppeteer MCP로 주요 화면 캡처 (미설치 시 경고 후 코드 분석만 수행) 5. `--live <URL>` 시: Computer Use로 실제 브라우저에서 앱을 열고 인터랙션하며 평가 (아래 상세 참조) 6. **디자인 시스템 자동 감지** (평가자 3 Cognitive Load 디자인 항목 평가용): - 스캔 우선순위 5단계: 1) tailwind.config.{ts,js,mjs,cjs} (Tailwind preset 추출) 2) theme.{ts,tsx,js} 파일 (root, src/, app/) — export 객체 파싱 3) *.css 파일의 :root { --token-name: ... } CSS 변수 4) design-tokens/*.{json,ts,js} 직접 토큰 정의 5) packages/*/tokens/, packages/design-system/ (monorepo 케이스) - 결과 구조 (tokenCatalog): ```jsonc