카테고리 시각 보고서 생성기
Atlas 시각 워크플로 방법론을 기반으로 모든 전자상거래 상품 카테고리에 대한 표준화된 12장 시각 전략 HTML 보고서를 생성합니다.
핵심 기능
- 완전한 방법론: 경쟁사 분석부터 시각적 의사 결정까지 전체 과정을 다루는 9가지 주요 참조 모듈
- 즉시 사용 가능한 템플릿: 내장 HTML 템플릿 + CSS 스타일 + Chart.js 차트 도구, 바로 복사하여 사용 가능
- 12장 표준 구조: 시장 분석 → 키워드 → 메인 이미지 → 서브 이미지 → 사용자 인사이트 → FABE → A+ → 비디오 → 브랜드 스토어 → 데이터 진단 → 실행 계획
- 6가지 차트 유형: 세로 막대형 차트, 가로 막대형 차트, 레이더 차트, 도넛/파이 차트, 데이터 중심 시각화
템플릿 리소스 위치
템플릿 파일은 assets/report-template/에 위치하며, 다음을 포함합니다:
assets/report-template/
├── index.html # 12장 완전 HTML 템플릿 (인라인 차트 JS 포함, 모든 내용은 {{placeholder}}로 표시)
└── assets/
└── report-base.css # 오렌지 테마 기본 스타일 (디자인 토큰 + 전체 컴포넌트)
Chart.js는 CDN을 통해 로드되며, 차트 도구 함수는 HTML에 인라인으로 포함되어 있어 바로 사용할 수 있습니다.
사용 방법: assets/report-template/ 전체 디렉토리를 작업 디렉토리에 복사하고, index.html의 {{placeholder}}와 하단 차트 데이터를 교체하기만 하면 됩니다.
보고서 생성 프로세스
1단계: 정보 수집
보고서 생성을 시작하기 전에 다음 정보를 수집합니다:
- 카테고리 정보: 카테고리 이름 (중국어 및 영어), 대상 플랫폼 (Amazon/독립 매장 등)
- 시장 데이터: 가격대 분포, 상위 브랜드 목록 (최소 5개), 각 브랜드의 판매 포인트 및 시각적 스타일
- 키워드 데이터: 핵심 키워드/롱테일 키워드/시나리오 키워드 및 검색량, 경쟁 강도
- 리뷰 데이터: 긍정/부정 고빈도 단어, 상위 불만 사항 목록
- 제품 정보: 자사 제품의 특성, 장점, 타겟 사용자 포지셔닝
사용자가 완전한 데이터를 제공하지 않은 경우, 카테고리 상식과 일반적인 시장 상황을 기반으로 합리적인 플레이스홀더 분석을 생성하고 "실제 데이터에 따라 검증 필요"라고 표시합니다.
2단계: 보고서 생성
assets/report-template/를 작업 디렉토리에 복사- 장 순서대로
index.html의{{placeholder}}내용 교체 - 하단
<script>에서 차트 데이터 교체 - 12개 장 모두 완전히 채워졌는지 확인
create_html도구를 사용하여 접근 가능한 온라인 페이지로 배포
3단계: 품질 검사
전달 전 확인:
- 12개 장 모두 채워짐,
{{placeholder}}누락 없음 - 6개 차트 데이터가 해당 카테고리 데이터로 교체됨
- 핵심 인사이트와 전략 제안이 구체적이고 실행 가능함
- FABE 매트릭스가 최소 5개의 완전한 판매 포인트 체인을 포함
- 실행 계획에 명확한 우선 순위와 타임라인이 있음
- 보고서 언어가 중국어로, 전문적이고 간결함
방법론 참조
자세한 방법론 문서는 references/에 있으며, 필요에 따라 로드합니다:
| 문서 | 내용 | 로드 시점 |
|---|---|---|
atlas-workflow.md | Atlas 10단계 시각 워크플로 전체 프로세스 | 분석 시작 전, 전체 프레임워크 이해 |
user-insight.md | 사용자 인사이트 6차원, 리뷰 분석 방법, 구매 결정 페르소나 | 사용자 인사이트 및 리뷰 분석 장 수행 시 |
fabe-model.md | FABE 모델, 3가지 구조, 교차 카테고리 사례 | FABE 판매 포인트 변환 장 수행 시 |
main-image-strategy.md | 메인 이미지 3요소, 5가지 함정, 카테고리 적응 | 메인 이미지 전략 장 수행 시 |
image-gallery-strategy.md | 서브 이미지 5단계 배열법, 6대 모듈, 일반적인 실수 | 서브 이미지 전략 장 수행 시 |
a-plus-strategy.md | A+ 6단계 구조, 콘텐츠 발굴, AI 보조 | A+ 페이지 장 수행 시 |
video-strategy.md | 비디오 콘텐츠 매트릭스, 골든 스크립트, 게재 위치 | 비디오 전략 장 수행 시 |
brand-store-strategy.md | 브랜드 스토어 6대 모듈, 브랜드 시각 시스템 | 브랜드 스토어 장 수행 시 |
data-diagnosis.md | 핵심 지표, 진단 방법, 최적화 폐쇄 루프 | 데이터 진단 장 수행 시 |
차트 도구 사용
report-charts.js는 4가지 일반적인 차트 유형을 캡슐화하며, 호출 방법은 다음과 같습니다:
// 세로 막대형 차트
ReportCharts.bar({ canvasId, labels, datasets, title });
// 가로 막대형 차트
ReportCharts.horizontalBar({ canvasId, labels, datasets, title });
// 레이더 차트
ReportCharts.radar({ canvasId, labels, datasets, title });
// 도넛/파이 차트
ReportCharts.doughnut({ canvasId, labels, data, title });
모든 차트는 기본적으로 오렌지 테마를 사용하며, 자동으로 반응형입니다.
실행 원칙
- 먼저 연구한 후 출력 – 무작정 생성하지 않고, 카테고리 상식과 시장 법칙을 최대한 기반으로 함
- 데이터 교체 가능 – 모든 데이터를 변수/플레이스홀더 사고로 구성하여 사용자가 쉽게 교체할 수 있도록 함
- 전략 실행 가능 – 각 전략 제안에 구체적인 실행 방법이 있어야 하며, 추상적이지 않아야 함
- 완전한 폐쇄 루프 – 분석부터 전략, 실행 계획까지 완전한 폐쇄 루프를 형성
- 시각적 전문성 – 템플릿의 카드, 표, 인사이트 박스, 차트 등 컴포넌트를 최대한 활용하여 시각적 품질 보장