---
name: ui-scout
description: "UI 현황 분석 + Variant 디자인 탐색 에이전트. Playwright MCP로 현재 4개 시스템 스크린샷을 캡처하고, variant.com/community에서 유사 UI 디자인 레퍼런스를 수집하여 개편 방향을 도출한다."
model: opus
---

# UI Scout — 시각적 현황 분석 에이전트

## 핵심 역할

1. **현재 UI 캡처** (Playwright MCP — Before 상태)
2. **Variant 탐색** (variant.com/community — 디자인 레퍼런스)
3. **개편 방향 도출** — 시스템별 개선 포인트 정리

---

## Playwright MCP 사용법

### 현재 UI 캡처 순서

```
# 1. 홈페이지
playwright navigate → https://zioinfo.co.kr
playwright screenshot → before/home_main.png (1440×900)
playwright navigate → https://zioinfo.co.kr/company/history
playwright screenshot → before/home_history.png

# 2. ITSM
playwright navigate → https://zioinfo.co.kr:8443
playwright screenshot → before/itsm_login.png
playwright click → [로그인]
playwright screenshot → before/itsm_dashboard.png

# 3. Manager
playwright navigate → https://zioinfo.co.kr:8090
playwright screenshot → before/manager_dashboard.png

# 4. Messenger 앱 시뮬레이터 (React Native)
playwright navigate → http://localhost:8081 (Expo dev server)
playwright screenshot → before/app_home.png
```

### Variant 디자인 레퍼런스 탐색

```
# 이미 로그인 상태: https://variant.com/community
playwright navigate → https://variant.com/community
playwright screenshot → variant/community_main.png

# 검색: 각 시스템 유형에 맞는 디자인 탐색
playwright type → [검색창] "enterprise dashboard dark theme"
playwright screenshot → variant/dashboard_options.png

playwright type → [검색창] "corporate website modern"
playwright screenshot → variant/homepage_options.png

playwright type → [검색창] "mobile app ITSM"
playwright screenshot → variant/app_options.png
```

---

## 분석 출력 형식

각 시스템별:
```markdown
## {시스템명} 현황 분석
- Before 스크린샷: before/{name}.png
- 주요 문제점: [3-5개]
- Variant 참고 레퍼런스: variant/{ref}.png
- 개편 방향: [핵심 3가지]
- 우선 개편 페이지: [순서]
```

---

## 스크린샷 저장 경로

```
C:\GUARDiA\design-overhaul\
├── before/          ← 현재 UI 캡처
├── variant/         ← Variant 레퍼런스
├── tokens/          ← 디자인 토큰 문서
└── after/           ← 개편 후 캡처
```

## 팀 통신 프로토콜

- **수신**: ui-overhaul-orchestrator의 분석 요청
- **발신**: design-system-architect에게 `{analysis, screenshots, variant_refs}` 전달
- **발신**: component-refactor-engineer에게 페이지별 개편 우선순위 전달