# task-2074: InsuRo 베타 UX 개선 5건 (Lv.4 — 브레인스토밍 필수)

## ★ 프로젝트: `/home/jay/projects/InsuRo/`
## ★ 레벨: 4 (브레인스토밍 필수)

## 개선 1: AI 키워드 분석 — 네이버 검색량 + 구글 트렌드

### 현재 문제
- "네이버 API 키가 필요합니다" 에러 표시. 검색량 조회 안 됨
- 사용자 개인 네이버 키 UI는 task-2066에서 제거했지만, 서버 키 fallback 미동작

### 수정 방향
- 네이버 키워드 API: **대시보드 네이버블로그 탭에 이미 구현된 코드를 그대로 활용** (새로 만들지 않음)
- 구글 트렌드: pytrends(비공식) 또는 SerpAPI 연동 가능 여부 검토
- **★ 브레인스토밍 필요**: 네이버/구글을 **동시에 나란히 보여줄지**, **탭으로 분리할지**, **섹션을 구분해서 각각의 분석 특성에 맞게 안내할지** UX 관점에서 심층 검토
  - 네이버: 검색량 수치 + 경쟁 강도 (정량적)
  - 구글: 트렌드 추이 그래프 (시계열적)
  - 성격이 다르므로 단순 나란히 배치보다 섹션 분리가 나을 수 있음

## 개선 2: AI 원스탑 포스팅 / AI 포스팅 자동화 — 기능 설명 페이지

### 현재 문제
- 클릭 시 간단한 팝업(한 줄)만 표시 → 기능 차이 이해 불가

### 수정 방향
- 팝업 대신 **전용 설명 페이지**로 교체
- **AI 원스탑 포스팅**: 키워드→AI글작성→블로그발행 한 번에. **맥스플랜 이상**
- **AI 포스팅 자동화**: 예약+자동 반복 포스팅. **서울대보험쌤 가족 전용** (가족 합류 유도)
- **★ 브레인스토밍 필요**: 표/비교 형식을 UX/UI 측면에서 어떻게 정제할지
  - 단순 표 vs 인터랙티브 비교 카드 vs 타임라인/플로우차트
  - 각 기능의 워크플로우 시각화 (원스탑: 3단계 플로우, 자동화: 예약→반복 루프)
  - CTA: 원스탑 → "맥스플랜 업그레이드", 자동화 → "가족 합류 문의"

## 개선 3: 좌측 사이드바 헤더 디자인

### 현재 문제
- "AI 마케팅" 같은 텍스트만 덩그러니 표시 → 전체 상단 메뉴 4개 모두 동일 문제

### 수정 방향
- 헤더 영역에 아이콘 + 설명 한 줄 + 배경/구분선 등 시각적 강화
- 4개 메뉴 모두 통일된 디자인 (고객관리, AI 마케팅, 분석 & 도구, 안내 & 설정)

## 개선 4: AI 콘텐츠 작성 — 콘텐츠 유형 선택 하이라이트

### 현재 문제
- "블로그용/SNS용/제안서용" 카드 선택 시 단순 border만 변경 → 아마추어 느낌

### 수정 방향
- 선택된 카드: 배경색 변경 + 체크마크 아이콘 + 그림자 효과
- Shadcn/ui 선택 카드 패턴 참고

## 개선 5: AI 콘텐츠 작성 — AI 주제 추천 기능 + UX 흐름

### 현재 문제
1. AI 주제 추천 버튼 비활성화
2. "빠른 주제 선택" 안내 + 버튼이 입력란 아래에 있음
3. 안내 문구 부족

### 수정 방향
1. AI 주제 추천 버튼 활성화
2. "빠른 주제 선택" 안내 + 버튼 → 입력란 **위로** 이동
3. 버튼 클릭 시 안내: "고급 옵션에서 선택한 채널/유형 기반으로 AI가 주제를 추천합니다"
4. 추천 결과에서 선택 또는 직접 입력 UX

## ★ 먼저 읽을 파일
- `src/pages/KeywordAnalysis.tsx` — AI 키워드 분석
- `src/pages/Generate.tsx` — AI 콘텐츠 작성
- `src/components/DashboardLayout.tsx` — 사이드바 헤더
- `src/pages/AiOnestop.tsx` 또는 관련 파일 — 원스탑 포스팅
- `src/pages/AiAutomation.tsx` 또는 관련 파일 — 포스팅 자동화
- 대시보드 네이버블로그 탭의 키워드 API 코드: `/home/jay/workspace/dashboard/` 하위

## 완료 시그니처
- 5건 모두 코드 수정 + 빌드 성공
- Playwright 스크린샷으로 개선 전/후 비교

## 레벨
- critical

## 프로젝트
- insuro