From dea202a3fd6e21a09039902e95c44e05c86974c8 Mon Sep 17 00:00:00 2001 From: sunmingLee <25thbam@gmail.com> Date: Thu, 23 Oct 2025 17:19:48 +0900 Subject: [PATCH] =?UTF-8?q?=EB=B6=88=ED=95=84=EC=9A=94=ED=95=9C=20?= =?UTF-8?q?=ED=8F=B4=EB=8D=94=20=EC=A0=95=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../architecture-pattern-backup-20251021.md | 1008 ----- TEMP_BACKUP/pattern/architecture-pattern.md | 685 ---- TEMP_BACKUP/prototype/00-로그인.html | 414 --- TEMP_BACKUP/prototype/01-회원가입.html | 347 -- TEMP_BACKUP/prototype/02-매장정보등록.html | 770 ---- TEMP_BACKUP/prototype/03-홈화면.html | 470 --- TEMP_BACKUP/prototype/04-이벤트목적선택.html | 516 --- .../prototype/05-AI트렌드분석결과.html | 680 ---- .../prototype/06-AI이벤트상품추천.html | 602 --- TEMP_BACKUP/prototype/07-AI참여방법설계.html | 859 ----- TEMP_BACKUP/prototype/08-AI홍보문구생성.html | 931 ----- TEMP_BACKUP/prototype/09-AI이미지생성.html | 743 ---- .../prototype/10-이벤트기획안승인.html | 719 ---- TEMP_BACKUP/prototype/11-AI영상제작.html | 506 --- TEMP_BACKUP/prototype/12-SNS콘텐츠생성.html | 758 ---- TEMP_BACKUP/prototype/13-QR포스터생성.html | 805 ---- .../prototype/14-QR포스터생성선택.html | 561 --- .../prototype/15-QR포스터상세설정.html | 628 ---- TEMP_BACKUP/prototype/16-콘텐츠편집.html | 699 ---- TEMP_BACKUP/prototype/17-콘텐츠최종승인.html | 733 ---- TEMP_BACKUP/prototype/18-배포채널선택.html | 1279 ------- TEMP_BACKUP/prototype/19-배포진행상태.html | 1144 ------ .../prototype/20-오프라인자료다운로드.html | 1026 ----- TEMP_BACKUP/prototype/21-이벤트참여.html | 993 ----- TEMP_BACKUP/prototype/22-참여완료.html | 905 ----- TEMP_BACKUP/prototype/23-당첨자명단관리.html | 1098 ------ TEMP_BACKUP/prototype/24-실시간대시보드.html | 939 ----- TEMP_BACKUP/prototype/25-채널별성과분석.html | 837 ----- TEMP_BACKUP/prototype/26-ROI분석.html | 883 ----- TEMP_BACKUP/prototype/27-분석리포트.html | 910 ----- TEMP_BACKUP/prototype/28-이벤트목록.html | 846 ----- TEMP_BACKUP/prototype/29-마이페이지.html | 727 ---- TEMP_BACKUP/prototype/CHECKLIST.md | 413 -- TEMP_BACKUP/prototype/TEST-REPORT.md | 314 -- TEMP_BACKUP/prototype/backup/01-로그인.html | 246 -- TEMP_BACKUP/prototype/backup/02-홈화면.html | 262 -- TEMP_BACKUP/prototype/backup/03-회원가입.html | 324 -- .../backup/04-1-AI이벤트유형추천.html | 550 --- .../prototype/backup/04-2-이벤트상세정보.html | 624 ---- .../prototype/backup/04-매장정보등록.html | 843 ----- .../prototype/backup/05-이벤트목적선택.html | 540 --- .../backup/06-1-AI트렌드분석결과.html | 538 --- .../prototype/backup/06-2-이벤트상세정보.html | 624 ---- .../prototype/backup/06-AI이벤트유형추천.html | 696 ---- .../prototype/backup/06-AI트렌드분석결과.html | 644 ---- .../prototype/backup/07-AI이벤트상품추천.html | 686 ---- .../prototype/backup/08-AI참여방법설계.html | 510 --- .../prototype/backup/09-AI홍보문구생성.html | 504 --- .../prototype/backup/10-AI영상제작.html | 648 ---- .../prototype/backup/10-이벤트기획안승인.html | 619 --- .../prototype/backup/11-AI이미지생성.html | 390 -- .../prototype/backup/12-SNS콘텐츠생성.html | 483 --- .../prototype/backup/13-QR포스터생성선택.html | 240 -- .../prototype/backup/15-콘텐츠편집.html | 325 -- .../prototype/backup/16-콘텐츠최종승인.html | 279 -- .../prototype/backup/17-배포채널선택.html | 386 -- .../prototype/backup/18-배포진행상태.html | 364 -- .../backup/19-오프라인자료다운로드.html | 166 - .../prototype/backup/22-당첨자명단관리.html | 432 --- .../prototype/backup/23-실시간대시보드.html | 330 -- .../prototype/backup/24-채널별성과분석.html | 522 --- .../prototype/backup/25-광고수익률분석.html | 393 -- .../prototype/backup/25-마이페이지.html | 480 --- .../prototype/backup/26-분석리포트.html | 385 -- .../prototype/backup/26-이벤트목록.html | 365 -- TEMP_BACKUP/prototype/backup/css/common.css | 888 ----- TEMP_BACKUP/prototype/backup/js/common.js | 555 --- .../backup/temp05-이벤트목적선택.html | 498 --- TEMP_BACKUP/prototype/css/common.css | 478 --- .../prototype/css/components/buttons.css | 247 -- .../prototype/css/components/cards.css | 292 -- .../prototype/css/components/inputs.css | 339 -- .../prototype/css/components/loaders.css | 321 -- .../prototype/css/components/modals.css | 390 -- .../prototype/css/components/navigation.css | 308 -- TEMP_BACKUP/prototype/css/layout.css | 304 -- TEMP_BACKUP/prototype/css/navigation.css | 45 - TEMP_BACKUP/prototype/css/reset.css | 210 -- TEMP_BACKUP/prototype/css/variables.css | 273 -- TEMP_BACKUP/prototype/js/common.js | 375 -- TEMP_BACKUP/prototype/js/form.js | 315 -- TEMP_BACKUP/prototype/js/modal.js | 418 --- TEMP_BACKUP/prototype/js/navigation.js | 296 -- TEMP_BACKUP/prototype/사용자여정맵.md | 303 -- TEMP_BACKUP/prototype/파일명변경계획.md | 64 - TEMP_BACKUP/uiux.md | 3312 ----------------- TEMP_BACKUP/userstory-table.md | 358 -- TEMP_BACKUP/userstory.md | 1437 ------- claudedocs/prototype-analysis.md | 339 -- debug/final-validation.log | 104 - .../ai-트렌드분석및추천.puml.error.txt | 32 - .../ai-트렌드분석및추천.puml.png | Bin 228178 -> 0 bytes .../analytics-대시보드조회-캐시미스.puml.png | Bin 156619 -> 0 bytes .../analytics-대시보드조회-캐시히트.puml.png | Bin 46346 -> 0 bytes .../analytics-배포완료구독.puml.error.txt | Bin 20032 -> 0 bytes .../analytics-배포완료구독.puml.png | Bin 112997 -> 0 bytes .../analytics-이벤트생성구독.puml.error.txt | Bin 19056 -> 0 bytes .../analytics-이벤트생성구독.puml.png | Bin 77359 -> 0 bytes .../analytics-참여자등록구독.puml.error.txt | Bin 19472 -> 0 bytes .../analytics-참여자등록구독.puml.png | Bin 81836 -> 0 bytes .../content-이미지생성.puml.error.txt | 32 - .../content-이미지생성.puml.png | Bin 188944 -> 0 bytes .../distribution-다중채널배포.puml.error.txt | 32 - .../distribution-다중채널배포.puml.png | Bin 206666 -> 0 bytes .../distribution-배포상태조회.puml.error.txt | Bin 21309 -> 0 bytes .../distribution-배포상태조회.puml.png | Bin 169659 -> 0 bytes .../event-AI추천요청.puml.error.txt | Bin 26257 -> 0 bytes .../puml-validation/event-AI추천요청.puml.png | Bin 44757 -> 0 bytes .../event-대시보드조회.puml.error.txt | 32 - .../event-대시보드조회.puml.png | Bin 69824 -> 0 bytes .../event-목록조회.puml.error.txt | Bin 27321 -> 0 bytes debug/puml-validation/event-목록조회.puml.png | Bin 68793 -> 0 bytes debug/puml-validation/event-목적선택.puml.png | Bin 38853 -> 0 bytes debug/puml-validation/event-상세조회.puml.png | Bin 42876 -> 0 bytes .../event-이미지결과조회.puml.error.txt | Bin 26009 -> 0 bytes .../event-이미지결과조회.puml.png | Bin 39587 -> 0 bytes .../event-이미지생성요청.puml.error.txt | Bin 28472 -> 0 bytes .../event-이미지생성요청.puml.png | Bin 48092 -> 0 bytes .../event-최종승인및배포.puml.error.txt | Bin 18053 -> 0 bytes .../event-최종승인및배포.puml.png | Bin 68112 -> 0 bytes .../event-추천결과조회.puml.png | Bin 36570 -> 0 bytes .../event-콘텐츠선택.puml.error.txt | Bin 15608 -> 0 bytes .../puml-validation/event-콘텐츠선택.puml.png | Bin 45380 -> 0 bytes .../participation-당첨자추첨.puml.error.txt | Bin 28621 -> 0 bytes .../participation-당첨자추첨.puml.png | Bin 149196 -> 0 bytes .../participation-이벤트참여.puml.error.txt | Bin 26861 -> 0 bytes .../participation-이벤트참여.puml.png | Bin 106653 -> 0 bytes ...articipation-참여자목록조회.puml.error.txt | Bin 24195 -> 0 bytes .../participation-참여자목록조회.puml.png | Bin 99765 -> 0 bytes .../user-로그아웃.puml.error.txt | 32 - debug/puml-validation/user-로그아웃.puml.png | Bin 80496 -> 0 bytes .../user-로그인.puml.error.txt | 32 - debug/puml-validation/user-로그인.puml.png | Bin 107595 -> 0 bytes .../user-프로필수정.puml.error.txt | 32 - .../puml-validation/user-프로필수정.puml.png | Bin 150468 -> 0 bytes .../user-회원가입.puml.error.txt | 32 - debug/puml-validation/user-회원가입.puml.png | Bin 171832 -> 0 bytes debug/puml-validation/validation-errors.txt | 0 debug/puml-validation/validation-result.txt | 30 - .../고객참여플로우.puml.error.txt | Bin 24689 -> 0 bytes debug/puml-validation/고객참여플로우.puml.png | Bin 122148 -> 0 bytes .../사용자인증플로우.puml.error.txt | Bin 23239 -> 0 bytes .../puml-validation/사용자인증플로우.puml.png | Bin 164802 -> 0 bytes .../성과분석플로우.puml.error.txt | Bin 26289 -> 0 bytes debug/puml-validation/성과분석플로우.puml.png | Bin 182250 -> 0 bytes .../이벤트생성플로우.puml.error.txt | 32 - .../puml-validation/이벤트생성플로우.puml.png | Bin 192044 -> 0 bytes debug/test-complex.png | Bin 14565 -> 0 bytes debug/test-complex.puml | 23 - debug/test-no-newline.png | Bin 14523 -> 0 bytes debug/test-no-newline.puml | 23 - debug/test-short-stereotype.png | Bin 14560 -> 0 bytes debug/test-short-stereotype.puml | 24 - debug/test-simple.png | Bin 14372 -> 0 bytes debug/test-simple.puml | 24 - debug/test-stereotype.png | Bin 4034 -> 0 bytes debug/test-stereotype.puml | 11 - debug/test-user-회원가입.png | Bin 171832 -> 0 bytes debug/test-utf8.png | Bin 14077 -> 0 bytes 159 files changed, 53038 deletions(-) delete mode 100644 TEMP_BACKUP/pattern/architecture-pattern-backup-20251021.md delete mode 100644 TEMP_BACKUP/pattern/architecture-pattern.md delete mode 100644 TEMP_BACKUP/prototype/00-로그인.html delete mode 100644 TEMP_BACKUP/prototype/01-회원가입.html delete mode 100644 TEMP_BACKUP/prototype/02-매장정보등록.html delete mode 100644 TEMP_BACKUP/prototype/03-홈화면.html delete mode 100644 TEMP_BACKUP/prototype/04-이벤트목적선택.html delete mode 100644 TEMP_BACKUP/prototype/05-AI트렌드분석결과.html delete mode 100644 TEMP_BACKUP/prototype/06-AI이벤트상품추천.html delete mode 100644 TEMP_BACKUP/prototype/07-AI참여방법설계.html delete mode 100644 TEMP_BACKUP/prototype/08-AI홍보문구생성.html delete mode 100644 TEMP_BACKUP/prototype/09-AI이미지생성.html delete mode 100644 TEMP_BACKUP/prototype/10-이벤트기획안승인.html delete mode 100644 TEMP_BACKUP/prototype/11-AI영상제작.html delete mode 100644 TEMP_BACKUP/prototype/12-SNS콘텐츠생성.html delete mode 100644 TEMP_BACKUP/prototype/13-QR포스터생성.html delete mode 100644 TEMP_BACKUP/prototype/14-QR포스터생성선택.html delete mode 100644 TEMP_BACKUP/prototype/15-QR포스터상세설정.html delete mode 100644 TEMP_BACKUP/prototype/16-콘텐츠편집.html delete mode 100644 TEMP_BACKUP/prototype/17-콘텐츠최종승인.html delete mode 100644 TEMP_BACKUP/prototype/18-배포채널선택.html delete mode 100644 TEMP_BACKUP/prototype/19-배포진행상태.html delete mode 100644 TEMP_BACKUP/prototype/20-오프라인자료다운로드.html delete mode 100644 TEMP_BACKUP/prototype/21-이벤트참여.html delete mode 100644 TEMP_BACKUP/prototype/22-참여완료.html delete mode 100644 TEMP_BACKUP/prototype/23-당첨자명단관리.html delete mode 100644 TEMP_BACKUP/prototype/24-실시간대시보드.html delete mode 100644 TEMP_BACKUP/prototype/25-채널별성과분석.html delete mode 100644 TEMP_BACKUP/prototype/26-ROI분석.html delete mode 100644 TEMP_BACKUP/prototype/27-분석리포트.html delete mode 100644 TEMP_BACKUP/prototype/28-이벤트목록.html delete mode 100644 TEMP_BACKUP/prototype/29-마이페이지.html delete mode 100644 TEMP_BACKUP/prototype/CHECKLIST.md delete mode 100644 TEMP_BACKUP/prototype/TEST-REPORT.md delete mode 100644 TEMP_BACKUP/prototype/backup/01-로그인.html delete mode 100644 TEMP_BACKUP/prototype/backup/02-홈화면.html delete mode 100644 TEMP_BACKUP/prototype/backup/03-회원가입.html delete mode 100644 TEMP_BACKUP/prototype/backup/04-1-AI이벤트유형추천.html delete mode 100644 TEMP_BACKUP/prototype/backup/04-2-이벤트상세정보.html delete mode 100644 TEMP_BACKUP/prototype/backup/04-매장정보등록.html delete mode 100644 TEMP_BACKUP/prototype/backup/05-이벤트목적선택.html delete mode 100644 TEMP_BACKUP/prototype/backup/06-1-AI트렌드분석결과.html delete mode 100644 TEMP_BACKUP/prototype/backup/06-2-이벤트상세정보.html delete mode 100644 TEMP_BACKUP/prototype/backup/06-AI이벤트유형추천.html delete mode 100644 TEMP_BACKUP/prototype/backup/06-AI트렌드분석결과.html delete mode 100644 TEMP_BACKUP/prototype/backup/07-AI이벤트상품추천.html delete mode 100644 TEMP_BACKUP/prototype/backup/08-AI참여방법설계.html delete mode 100644 TEMP_BACKUP/prototype/backup/09-AI홍보문구생성.html delete mode 100644 TEMP_BACKUP/prototype/backup/10-AI영상제작.html delete mode 100644 TEMP_BACKUP/prototype/backup/10-이벤트기획안승인.html delete mode 100644 TEMP_BACKUP/prototype/backup/11-AI이미지생성.html delete mode 100644 TEMP_BACKUP/prototype/backup/12-SNS콘텐츠생성.html delete mode 100644 TEMP_BACKUP/prototype/backup/13-QR포스터생성선택.html delete mode 100644 TEMP_BACKUP/prototype/backup/15-콘텐츠편집.html delete mode 100644 TEMP_BACKUP/prototype/backup/16-콘텐츠최종승인.html delete mode 100644 TEMP_BACKUP/prototype/backup/17-배포채널선택.html delete mode 100644 TEMP_BACKUP/prototype/backup/18-배포진행상태.html delete mode 100644 TEMP_BACKUP/prototype/backup/19-오프라인자료다운로드.html delete mode 100644 TEMP_BACKUP/prototype/backup/22-당첨자명단관리.html delete mode 100644 TEMP_BACKUP/prototype/backup/23-실시간대시보드.html delete mode 100644 TEMP_BACKUP/prototype/backup/24-채널별성과분석.html delete mode 100644 TEMP_BACKUP/prototype/backup/25-광고수익률분석.html delete mode 100644 TEMP_BACKUP/prototype/backup/25-마이페이지.html delete mode 100644 TEMP_BACKUP/prototype/backup/26-분석리포트.html delete mode 100644 TEMP_BACKUP/prototype/backup/26-이벤트목록.html delete mode 100644 TEMP_BACKUP/prototype/backup/css/common.css delete mode 100644 TEMP_BACKUP/prototype/backup/js/common.js delete mode 100644 TEMP_BACKUP/prototype/backup/temp05-이벤트목적선택.html delete mode 100644 TEMP_BACKUP/prototype/css/common.css delete mode 100644 TEMP_BACKUP/prototype/css/components/buttons.css delete mode 100644 TEMP_BACKUP/prototype/css/components/cards.css delete mode 100644 TEMP_BACKUP/prototype/css/components/inputs.css delete mode 100644 TEMP_BACKUP/prototype/css/components/loaders.css delete mode 100644 TEMP_BACKUP/prototype/css/components/modals.css delete mode 100644 TEMP_BACKUP/prototype/css/components/navigation.css delete mode 100644 TEMP_BACKUP/prototype/css/layout.css delete mode 100644 TEMP_BACKUP/prototype/css/navigation.css delete mode 100644 TEMP_BACKUP/prototype/css/reset.css delete mode 100644 TEMP_BACKUP/prototype/css/variables.css delete mode 100644 TEMP_BACKUP/prototype/js/common.js delete mode 100644 TEMP_BACKUP/prototype/js/form.js delete mode 100644 TEMP_BACKUP/prototype/js/modal.js delete mode 100644 TEMP_BACKUP/prototype/js/navigation.js delete mode 100644 TEMP_BACKUP/prototype/사용자여정맵.md delete mode 100644 TEMP_BACKUP/prototype/파일명변경계획.md delete mode 100644 TEMP_BACKUP/uiux.md delete mode 100644 TEMP_BACKUP/userstory-table.md delete mode 100644 TEMP_BACKUP/userstory.md delete mode 100644 claudedocs/prototype-analysis.md delete mode 100644 debug/final-validation.log delete mode 100644 debug/puml-validation/ai-트렌드분석및추천.puml.error.txt delete mode 100644 debug/puml-validation/ai-트렌드분석및추천.puml.png delete mode 100644 debug/puml-validation/analytics-대시보드조회-캐시미스.puml.png delete mode 100644 debug/puml-validation/analytics-대시보드조회-캐시히트.puml.png delete mode 100644 debug/puml-validation/analytics-배포완료구독.puml.error.txt delete mode 100644 debug/puml-validation/analytics-배포완료구독.puml.png delete mode 100644 debug/puml-validation/analytics-이벤트생성구독.puml.error.txt delete mode 100644 debug/puml-validation/analytics-이벤트생성구독.puml.png delete mode 100644 debug/puml-validation/analytics-참여자등록구독.puml.error.txt delete mode 100644 debug/puml-validation/analytics-참여자등록구독.puml.png delete mode 100644 debug/puml-validation/content-이미지생성.puml.error.txt delete mode 100644 debug/puml-validation/content-이미지생성.puml.png delete mode 100644 debug/puml-validation/distribution-다중채널배포.puml.error.txt delete mode 100644 debug/puml-validation/distribution-다중채널배포.puml.png delete mode 100644 debug/puml-validation/distribution-배포상태조회.puml.error.txt delete mode 100644 debug/puml-validation/distribution-배포상태조회.puml.png delete mode 100644 debug/puml-validation/event-AI추천요청.puml.error.txt delete mode 100644 debug/puml-validation/event-AI추천요청.puml.png delete mode 100644 debug/puml-validation/event-대시보드조회.puml.error.txt delete mode 100644 debug/puml-validation/event-대시보드조회.puml.png delete mode 100644 debug/puml-validation/event-목록조회.puml.error.txt delete mode 100644 debug/puml-validation/event-목록조회.puml.png delete mode 100644 debug/puml-validation/event-목적선택.puml.png delete mode 100644 debug/puml-validation/event-상세조회.puml.png delete mode 100644 debug/puml-validation/event-이미지결과조회.puml.error.txt delete mode 100644 debug/puml-validation/event-이미지결과조회.puml.png delete mode 100644 debug/puml-validation/event-이미지생성요청.puml.error.txt delete mode 100644 debug/puml-validation/event-이미지생성요청.puml.png delete mode 100644 debug/puml-validation/event-최종승인및배포.puml.error.txt delete mode 100644 debug/puml-validation/event-최종승인및배포.puml.png delete mode 100644 debug/puml-validation/event-추천결과조회.puml.png delete mode 100644 debug/puml-validation/event-콘텐츠선택.puml.error.txt delete mode 100644 debug/puml-validation/event-콘텐츠선택.puml.png delete mode 100644 debug/puml-validation/participation-당첨자추첨.puml.error.txt delete mode 100644 debug/puml-validation/participation-당첨자추첨.puml.png delete mode 100644 debug/puml-validation/participation-이벤트참여.puml.error.txt delete mode 100644 debug/puml-validation/participation-이벤트참여.puml.png delete mode 100644 debug/puml-validation/participation-참여자목록조회.puml.error.txt delete mode 100644 debug/puml-validation/participation-참여자목록조회.puml.png delete mode 100644 debug/puml-validation/user-로그아웃.puml.error.txt delete mode 100644 debug/puml-validation/user-로그아웃.puml.png delete mode 100644 debug/puml-validation/user-로그인.puml.error.txt delete mode 100644 debug/puml-validation/user-로그인.puml.png delete mode 100644 debug/puml-validation/user-프로필수정.puml.error.txt delete mode 100644 debug/puml-validation/user-프로필수정.puml.png delete mode 100644 debug/puml-validation/user-회원가입.puml.error.txt delete mode 100644 debug/puml-validation/user-회원가입.puml.png delete mode 100644 debug/puml-validation/validation-errors.txt delete mode 100644 debug/puml-validation/validation-result.txt delete mode 100644 debug/puml-validation/고객참여플로우.puml.error.txt delete mode 100644 debug/puml-validation/고객참여플로우.puml.png delete mode 100644 debug/puml-validation/사용자인증플로우.puml.error.txt delete mode 100644 debug/puml-validation/사용자인증플로우.puml.png delete mode 100644 debug/puml-validation/성과분석플로우.puml.error.txt delete mode 100644 debug/puml-validation/성과분석플로우.puml.png delete mode 100644 debug/puml-validation/이벤트생성플로우.puml.error.txt delete mode 100644 debug/puml-validation/이벤트생성플로우.puml.png delete mode 100644 debug/test-complex.png delete mode 100644 debug/test-complex.puml delete mode 100644 debug/test-no-newline.png delete mode 100644 debug/test-no-newline.puml delete mode 100644 debug/test-short-stereotype.png delete mode 100644 debug/test-short-stereotype.puml delete mode 100644 debug/test-simple.png delete mode 100644 debug/test-simple.puml delete mode 100644 debug/test-stereotype.png delete mode 100644 debug/test-stereotype.puml delete mode 100644 debug/test-user-회원가입.png delete mode 100644 debug/test-utf8.png diff --git a/TEMP_BACKUP/pattern/architecture-pattern-backup-20251021.md b/TEMP_BACKUP/pattern/architecture-pattern-backup-20251021.md deleted file mode 100644 index 36e0593..0000000 --- a/TEMP_BACKUP/pattern/architecture-pattern-backup-20251021.md +++ /dev/null @@ -1,1008 +0,0 @@ -# KT AI 기반 소상공인 이벤트 자동 생성 서비스 - 클라우드 아키텍처 패턴 선정서 - -**작성일**: 2025-10-21 -**작성자**: System Architect (박영자) -**버전**: 1.0 - ---- - -## 1. 요구사항 분석 - -### 1.1 마이크로서비스별 기능 및 비기능 요구사항 - -#### 1.1.1 User 서비스 -**기능 요구사항**: -- 회원가입/로그인 (JWT 인증) -- 매장 정보 관리 및 사업자번호 검증 -- KT 인증 시스템 연동 - -**비기능 요구사항**: -- 응답시간: 1초 이내 -- 가용성: 99.9% -- 보안: 개인정보 암호화 (AES-256), HTTPS/TLS -- 확장성: 1,000 동시 사용자 - -**기술적 도전과제**: -- 외부 사업자번호 검증 API 의존성 -- 인증 토큰 관리 및 세션 유지 -- 개인정보 보호 규정 준수 - ---- - -#### 1.1.2 Event Planning 서비스 -**기능 요구사항**: -- AI 기반 업종/지역 트렌드 분석 -- AI 이벤트상품 추천 (Claude API) -- AI 참여 방법 설계 -- AI 홍보 문구 생성 (GPT-4 API) - -**비기능 요구사항**: -- **응답시간: 10초 이내 (전체 기획 과정)** ⚡ -- AI API 병렬 호출 필수 -- 추첨형/선착순형 이벤트 자동 프로세스 분기 -- 확장성: 100개 동시 이벤트 기획 - -**기술적 도전과제**: -- **Claude + GPT-4 API 병렬 호출 및 응답 시간 관리** -- AI 프롬프트 최적화로 10초 목표 달성 -- 트렌드 데이터베이스 실시간 조회 성능 -- 응답 캐싱 전략 - ---- - -#### 1.1.3 Content Generation 서비스 -**기능 요구사항**: -- AI 이미지 생성 (Stable Diffusion, 3종) -- AI 영상 제작 (15초) -- SNS 콘텐츠 자동 생성 (플랫폼별 최적화) -- QR 포스터 생성 - -**비기능 요구사항**: -- **응답시간: 5-8분 이내 (병렬 처리 시)** ⚡ -- 이미지 생성: 2-3분 (Stable Diffusion 특성) -- 영상 제작: 3-5분 (AI 영상 엔진 특성) -- GPU 가속 활용 -- 확장성: 50개 동시 콘텐츠 생성 - -**기술적 도전과제**: -- **이미지 3종 + 영상 1개 병렬 생성** -- 진행 상황 실시간 피드백 -- 백그라운드 비동기 처리 필수 -- 품질과 속도 균형 유지 - ---- - -#### 1.1.4 Distribution 서비스 -**기능 요구사항**: -- 다중 채널 배포 (우리동네TV, 링고비즈, 지니TV, Instagram, Naver Blog, Kakao Channel) -- 네이버 클로바 TTS 연동 (연결음 생성) -- 배포 실패 시 자동 재시도 (3회) - -**비기능 요구사항**: -- **응답시간: 1분 이내 (전체 배포 과정)** ⚡ -- 채널별 병렬 배포 필수 -- 배포 상태 실시간 업데이트 -- 확장성: 100개 동시 배포 - -**기술적 도전과제**: -- **6개 외부 API 병렬 호출 및 통합** -- API 장애 대응 (Circuit Breaker, Retry) -- 네이버 클로바 TTS 품질 보장 -- 배포 실패 복구 전략 - ---- - -#### 1.1.5 Participation 서비스 -**기능 요구사항**: -- 이벤트 참여 신청 및 중복 방지 -- 추첨형 자동 추첨 (매장 방문 고객 가산점) -- 선착순형 쿠폰 소진 시 자동 종료 -- 당첨 알림 발송 (SMS/카카오 알림톡) - -**비기능 요구사항**: -- 응답시간: 1초 이내 -- 1인 1회 참여 보장 (멱등성) -- 공정한 추첨 알고리즘 -- 확장성: 10,000 동시 참여 - -**기술적 도전과제**: -- 중복 참여 방지 (전화번호 기준) -- 추첨형/선착순형 프로세스 분기 -- 대량 SMS/알림톡 발송 -- 매장 방문 고객 가산점 처리 - ---- - -#### 1.1.6 Analytics 서비스 -**기능 요구사항**: -- 실시간 대시보드 (참여자 수, 노출 수, 매출 증가율) -- 5분 간격 데이터 수집 및 업데이트 -- 채널별 성과 분석 (Instagram, Naver Blog, Kakao Channel API) -- ROI 자동 계산 -- 분석 리포트 PDF 생성 - -**비기능 요구사항**: -- **데이터 수집 주기: 5분 간격** ⏱ -- 실시간 데이터 시각화 -- 확장성: 100개 이벤트 동시 분석 - -**기술적 도전과제**: -- **다중 데이터 소스 통합 (KT API, POS, SNS API)** -- CQRS 패턴으로 읽기/쓰기 분리 -- 5분 간격 스케줄러 기반 수집 -- 대시보드 실시간 업데이트 - ---- - -#### 1.1.7 AI Learning 서비스 -**기능 요구사항**: -- 이벤트 결과 분석 및 개선안 생성 -- 성공 패턴 학습 및 재활용 -- 다음 이벤트 아이디어 제안 (시즌별) - -**비기능 요구사항**: -- 빅데이터 분석 시스템 연동 -- AI 머신러닝 엔진 API 호출 -- 학습 데이터 누적 및 모델 개선 -- 확장성: 누적 데이터 기반 지속적 학습 - -**기술적 도전과제**: -- 성공/실패 패턴 자동 학습 -- 업종별/지역별 데이터 축적 -- 추천 정확도 향상 알고리즘 -- Event Sourcing으로 학습 데이터 추적 - ---- - -### 1.2 통합 분석 및 핵심 도전과제 - -#### 성능 목표 요약 -| 서비스 | 목표 응답시간 | 핵심 최적화 전략 | -|--------|--------------|------------------| -| Event Planning | **10초 이내** | AI API 병렬 호출, 응답 캐싱 | -| Content Generation | **5-8분 이내** | 이미지+영상 병렬 생성, 비동기 처리 | -| Distribution | **1분 이내** | 6개 채널 병렬 배포 | -| Analytics | **5분 주기** | CQRS 읽기/쓰기 분리, 스케줄러 수집 | - -#### 확장성 요구사항 -- **동시 이벤트 처리**: 최소 100개 -- **AI API 동시 호출**: 최소 50개 -- **배포 API 동시 호출**: 최소 100개 - -#### 외부 시스템 의존성 -- **KT 채널**: 우리동네TV, 링고비즈, 지니TV -- **AI API**: Claude, GPT-4, Stable Diffusion -- **SNS**: Instagram, Naver Blog, Kakao Channel -- **기타**: 네이버 클로바 TTS, 사업자번호 검증, POS 시스템 - ---- - -## 2. 클라우드 아키텍처 패턴 선정 - -### 2.1 패턴 평가 매트릭스 - -#### 핵심 패턴 Top 10 정량 평가 - -| 패턴 | 기능 적합성
(35%) | 성능 효과
(25%) | 운영 복잡도
(20%) | 확장성
(15%) | 비용 효율성
(5%) | **총점** | **우선순위** | -|------|:---:|:---:|:---:|:---:|:---:|:---:|:---:| -| **API Gateway** | 10 × 0.35 = 3.5 | 9 × 0.25 = 2.25 | 9 × 0.20 = 1.8 | 9 × 0.15 = 1.35 | 8 × 0.05 = 0.4 | **9.30** | 🥇 1위 | -| **Async Request-Reply** | 10 × 0.35 = 3.5 | 9 × 0.25 = 2.25 | 7 × 0.20 = 1.4 | 8 × 0.15 = 1.2 | 7 × 0.05 = 0.35 | **8.70** | 🥈 2위 | -| **Circuit Breaker** | 9 × 0.35 = 3.15 | 7 × 0.25 = 1.75 | 8 × 0.20 = 1.6 | 8 × 0.15 = 1.2 | 8 × 0.05 = 0.4 | **8.10** | 🥉 3위 | -| **CQRS** | 9 × 0.35 = 3.15 | 9 × 0.25 = 2.25 | 5 × 0.20 = 1.0 | 8 × 0.15 = 1.2 | 6 × 0.05 = 0.3 | **7.90** | 4위 | -| **Cache-Aside** | 8 × 0.35 = 2.8 | 9 × 0.25 = 2.25 | 9 × 0.20 = 1.8 | 7 × 0.15 = 1.05 | 9 × 0.05 = 0.45 | **8.35** | 5위 | -| **Event Sourcing** | 9 × 0.35 = 3.15 | 7 × 0.25 = 1.75 | 4 × 0.20 = 0.8 | 9 × 0.15 = 1.35 | 5 × 0.05 = 0.25 | **7.30** | 6위 | -| **Queue-Based Load Leveling** | 8 × 0.35 = 2.8 | 8 × 0.25 = 2.0 | 7 × 0.20 = 1.4 | 9 × 0.15 = 1.35 | 7 × 0.05 = 0.35 | **7.90** | 7위 | -| **Retry** | 7 × 0.35 = 2.45 | 6 × 0.25 = 1.5 | 9 × 0.20 = 1.8 | 6 × 0.15 = 0.9 | 9 × 0.05 = 0.45 | **7.10** | 8위 | -| **Publisher-Subscriber** | 8 × 0.35 = 2.8 | 7 × 0.25 = 1.75 | 6 × 0.20 = 1.2 | 8 × 0.15 = 1.2 | 7 × 0.05 = 0.35 | **7.30** | 9위 | -| **Choreography** | 7 × 0.35 = 2.45 | 6 × 0.25 = 1.5 | 5 × 0.20 = 1.0 | 8 × 0.15 = 1.2 | 6 × 0.05 = 0.3 | **6.45** | 10위 | - ---- - -### 2.2 선정 패턴 및 적용 전략 - -#### 🥇 **1. API Gateway** (총점: 9.30) - Phase 1 MVP - -**선정 이유**: -- 단일 진입점으로 7개 마이크로서비스 라우팅 -- 인증/인가 중앙 처리 (JWT 토큰 검증) -- Rate Limiting으로 100개 동시 이벤트 관리 -- 횡단 관심사 분리 (로깅, 모니터링) - -**적용 서비스**: 전체 서비스 - -**예상 효과**: -- 클라이언트 요청 단순화 (1개 엔드포인트) -- 인증 처리 시간 50% 단축 -- 서비스 간 결합도 감소 - ---- - -#### 🥈 **2. Async Request-Reply** (총점: 8.70) - Phase 1 MVP - -**선정 이유**: -- **Content Generation 서비스의 5-8분 처리 시간 대응** -- 이미지/영상 생성 백그라운드 처리 -- 진행 상황 실시간 피드백 (WebSocket/폴링) -- 클라이언트 블로킹 방지 - -**적용 서비스**: Content Generation, AI Learning - -**예상 효과**: -- 사용자 대기 시간 체감 80% 감소 -- 시스템 응답성 향상 -- 동시 콘텐츠 생성 50개 처리 가능 - -**구현 예시**: -```javascript -// 클라이언트: 콘텐츠 생성 요청 -const response = await axios.post('/api/content/generate', { - eventId: 'evt-001', - imageCount: 3 -}); -const jobId = response.data.jobId; // Job ID 발급 - -// 상태 폴링 (5초 간격) -const checkStatus = setInterval(async () => { - const status = await axios.get(`/api/content/status/${jobId}`); - if (status.data.completed) { - clearInterval(checkStatus); - // 콘텐츠 다운로드 - } -}, 5000); -``` - ---- - -#### 🥉 **3. Circuit Breaker** (총점: 8.10) - Phase 1 MVP - -**선정 이유**: -- **6개 외부 API 장애 대응 (KT 채널, AI API, SNS)** -- Distribution 서비스의 배포 실패 방지 -- API 장애 시 빠른 실패 및 폴백 -- 연쇄 장애 전파 차단 - -**적용 서비스**: Distribution, Event Planning, Content Generation - -**예상 효과**: -- API 장애 시 응답 시간 95% 단축 -- 시스템 가용성 99.9% 보장 -- 배포 성공률 98% 이상 유지 - -**구현 예시** (Node.js with opossum): -```javascript -const CircuitBreaker = require('opossum'); - -// 우리동네TV API 호출 -const callWooridongneTV = async (data) => { - return axios.post('https://api.wooridongne.kt.com/deploy', data); -}; - -const breaker = new CircuitBreaker(callWooridongneTV, { - timeout: 15000, // 15초 타임아웃 - errorThresholdPercentage: 50, // 50% 실패 시 OPEN - resetTimeout: 30000 // 30초 후 재시도 -}); - -breaker.fallback(() => ({ success: false, message: '우리동네TV 배포 실패' })); - -// 배포 요청 -const result = await breaker.fire(deployData); -``` - ---- - -#### **4. Cache-Aside** (총점: 8.35) - Phase 1 MVP - -**선정 이유**: -- Event Planning 서비스의 10초 응답 목표 달성 -- 트렌드 데이터베이스 조회 성능 향상 -- AI API 응답 캐싱 (동일 조건 재사용) -- Redis 활용 고속 캐싱 - -**적용 서비스**: Event Planning, Analytics - -**예상 효과**: -- 트렌드 분석 응답 시간 70% 단축 (3초 → 0.9초) -- AI API 호출 횟수 40% 감소 -- 비용 절감 (AI API 사용량 감소) - -**구현 예시**: -```javascript -// 트렌드 데이터 조회 (캐시 우선) -const getTrendData = async (industry, region) => { - const cacheKey = `trend:${industry}:${region}`; - - // 1. 캐시 조회 - let data = await redis.get(cacheKey); - - if (data) { - return JSON.parse(data); // 캐시 히트 - } - - // 2. DB 조회 - data = await db.query('SELECT * FROM trends WHERE industry = ? AND region = ?', [industry, region]); - - // 3. 캐시 저장 (TTL: 1시간) - await redis.setex(cacheKey, 3600, JSON.stringify(data)); - - return data; -}; -``` - ---- - -#### **5. CQRS** (총점: 7.90) - Phase 2 확장 - -**선정 이유**: -- **Analytics 서비스의 읽기/쓰기 분리** -- 실시간 대시보드 조회 성능 최적화 -- 5분 간격 데이터 수집과 실시간 조회 분리 -- 읽기 전용 DB로 복잡한 집계 쿼리 처리 - -**적용 서비스**: Analytics - -**예상 효과**: -- 대시보드 조회 속도 80% 향상 -- 쓰기 작업 영향 없이 읽기 확장 가능 -- 복잡한 ROI 계산 성능 개선 - -**아키텍처**: -```mermaid -graph LR - Client[클라이언트] --> ReadAPI[읽기 API] - Client --> WriteAPI[쓰기 API] - - WriteAPI --> CommandDB[(Command DB
쓰기 전용)] - CommandDB --> EventBus[이벤트 버스] - EventBus --> ReadDB[(Query DB
읽기 전용)] - ReadAPI --> ReadDB -``` - ---- - -#### **6. Event Sourcing** (총점: 7.30) - Phase 3 고도화 - -**선정 이유**: -- AI Learning 서비스의 학습 데이터 추적 -- 이벤트 전체 이력 저장 및 재생 -- 감사 추적 (Audit Trail) 요구사항 충족 -- 성공/실패 패턴 분석 정확도 향상 - -**적용 서비스**: AI Learning, Participation - -**예상 효과**: -- AI 학습 정확도 30% 향상 -- 데이터 멱등성 100% 보장 -- 과거 데이터 재분석 가능 - ---- - -#### **7. Queue-Based Load Leveling** (총점: 7.90) - Phase 2 확장 - -**선정 이유**: -- Distribution 서비스의 배포 요청 급증 대응 -- 100개 동시 배포 요청 큐잉 처리 -- 백엔드 서비스 부하 평준화 -- 배포 실패 재시도 관리 - -**적용 서비스**: Distribution, Content Generation - -**예상 효과**: -- 피크 타임 안정성 99.9% 유지 -- 배포 성공률 98% 이상 -- 시스템 과부하 방지 - ---- - -#### **8. Retry** (총점: 7.10) - Phase 1 MVP - -**선정 이유**: -- Distribution 서비스의 배포 실패 자동 재시도 (3회) -- 외부 API 일시적 오류 복구 -- Circuit Breaker와 조합 사용 - -**적용 서비스**: Distribution, Event Planning - -**예상 효과**: -- 배포 성공률 15% 향상 -- 일시적 네트워크 오류 자동 복구 - ---- - -#### **9. Publisher-Subscriber** (총점: 7.30) - Phase 2 확장 - -**선정 이유**: -- 이벤트 완료 시 다중 서비스 알림 (Analytics, AI Learning) -- 서비스 간 결합도 감소 -- 비동기 이벤트 처리 - -**적용 서비스**: 전체 서비스 (이벤트 기반 통신) - -**예상 효과**: -- 서비스 간 결합도 70% 감소 -- 새로운 서비스 추가 용이성 - ---- - -#### **10. Choreography** (총점: 6.45) - Phase 3 고도화 - -**선정 이유**: -- Saga 패턴 대안으로 중앙 조정자 없는 워크플로 -- Event Planning → Content Generation → Distribution 자율 조정 -- 확장성 및 유연성 향상 - -**적용 서비스**: 이벤트 생성 워크플로 - -**예상 효과**: -- 워크플로 확장성 향상 -- 중앙 병목 현상 제거 - ---- - -## 3. 서비스별 패턴 적용 설계 - -### 3.1 전체 아키텍처 구조 - -```mermaid -graph TB - subgraph "클라이언트" - Web[웹 애플리케이션] - Mobile[모바일 앱] - end - - subgraph "API Gateway Layer" - Gateway[API Gateway
인증/인가/라우팅/Rate Limiting] - end - - subgraph "마이크로서비스" - User[User 서비스
회원/매장 관리] - Planning[Event Planning 서비스
AI 이벤트 기획
Cache-Aside] - Content[Content Generation 서비스
AI 콘텐츠 생성
Async Request-Reply] - Dist[Distribution 서비스
다중 채널 배포
Circuit Breaker + Retry] - Participation[Participation 서비스
참여/추첨 관리] - Analytics[Analytics 서비스
효과 측정
CQRS] - AILearn[AI Learning 서비스
학습/개선
Event Sourcing] - end - - subgraph "데이터 계층" - UserDB[(User DB
PostgreSQL)] - PlanningDB[(Planning DB
MongoDB)] - ContentDB[(Content DB
MongoDB)] - DistDB[(Distribution DB
PostgreSQL)] - PartDB[(Participation DB
PostgreSQL)] - - subgraph "CQRS - Analytics" - WriteDB[(Command DB
쓰기)] - ReadDB[(Query DB
읽기)] - end - - EventStore[(Event Store
AI Learning)] - - Cache[(Redis Cache
Cache-Aside)] - end - - subgraph "메시지 큐" - Queue[RabbitMQ/Kafka
Queue-Based Load Leveling
Pub-Sub] - end - - subgraph "외부 시스템" - KTAPI[KT 채널 API
우리동네TV/링고비즈/지니TV] - AIAPI[AI API
Claude/GPT-4/Stable Diffusion] - SNS[SNS API
Instagram/Naver/Kakao] - Clova[네이버 클로바 TTS] - POS[POS 시스템] - end - - Web --> Gateway - Mobile --> Gateway - - Gateway --> User - Gateway --> Planning - Gateway --> Content - Gateway --> Dist - Gateway --> Participation - Gateway --> Analytics - Gateway --> AILearn - - User --> UserDB - Planning --> PlanningDB - Planning --> Cache - Content --> ContentDB - Content --> Queue - Dist --> DistDB - Dist --> Queue - Participation --> PartDB - Analytics --> WriteDB - Analytics --> ReadDB - WriteDB --> Queue - Queue --> ReadDB - AILearn --> EventStore - - Planning -->|Circuit Breaker| AIAPI - Content -->|Circuit Breaker| AIAPI - Dist -->|Circuit Breaker + Retry| KTAPI - Dist -->|Circuit Breaker + Retry| SNS - Dist -->|Circuit Breaker| Clova - Analytics --> KTAPI - Analytics --> SNS - Analytics --> POS - - Queue -->|Pub-Sub| Analytics - Queue -->|Pub-Sub| AILearn -``` - ---- - -### 3.2 Event Planning 서비스 - 10초 응답 최적화 - -**패턴 적용**: -- **Cache-Aside**: 트렌드 데이터 캐싱 -- **Circuit Breaker**: Claude + GPT-4 API 장애 대응 -- **병렬 처리**: AI API 동시 호출 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Planning as Event Planning - participant Cache as Redis Cache - participant DB as Planning DB - participant Claude as Claude API - participant GPT4 as GPT-4 API - - Client->>Gateway: 이벤트 기획 시작 - Gateway->>Planning: 기획 요청 - - Note over Planning,Cache: Phase 1: 트렌드 분석 (3초 목표) - Planning->>Cache: 트렌드 데이터 조회 - alt 캐시 히트 - Cache-->>Planning: 캐시 데이터 반환 - else 캐시 미스 - Planning->>DB: DB 조회 - DB-->>Planning: 트렌드 데이터 - Planning->>Cache: 캐시 저장 (TTL: 1시간) - end - - Note over Planning,GPT4: Phase 2: AI 병렬 호출 (7초 목표) - par Claude: 이벤트상품 + 참여방법 - Planning->>Claude: 이벤트상품 추천 요청
+ 참여방법 설계 요청 - Claude-->>Planning: 추천 결과 (5초) - and GPT-4: 홍보문구 - Planning->>GPT4: 홍보문구 생성 요청 - GPT4-->>Planning: 홍보문구 (4초) - end - - Planning->>DB: 기획안 저장 - Planning-->>Gateway: 완성된 기획안 (총 10초 이내) - Gateway-->>Client: 기획안 제공 -``` - -**예상 성과**: -- **총 응답시간: 10초 이내** (목표 달성) -- 트렌드 분석: 3초 → 0.9초 (캐시 히트 시) -- AI API 병렬 호출: 9초 → 5초 - ---- - -### 3.3 Content Generation 서비스 - 비동기 처리 - -**패턴 적용**: -- **Async Request-Reply**: 5-8분 장시간 처리 -- **Queue-Based Load Leveling**: 동시 50개 콘텐츠 생성 -- **Circuit Breaker**: Stable Diffusion API 장애 대응 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Content as Content Generation - participant Queue as RabbitMQ - participant Worker as Background Worker - participant SD as Stable Diffusion - participant VideoAI as AI Video Engine - participant DB as Content DB - - Client->>Gateway: 콘텐츠 생성 요청 - Gateway->>Content: 생성 요청 - Content->>DB: Job 생성 (상태: PENDING) - Content->>Queue: 작업 큐잉 - Content-->>Gateway: Job ID 발급 - Gateway-->>Client: Job ID 반환 - - Note over Client: 클라이언트는 다른 작업 가능 - - Queue->>Worker: 작업 할당 - - par 이미지 3종 생성 (2-3분) - Worker->>SD: 이미지 생성 요청 (3건 병렬) - SD-->>Worker: 이미지 3종 - and 영상 1개 생성 (3-5분) - Worker->>VideoAI: 영상 제작 요청 - VideoAI-->>Worker: 15초 영상 - end - - Worker->>DB: 콘텐츠 저장 + 상태 업데이트 (COMPLETED) - - loop 상태 확인 (5초 간격) - Client->>Gateway: Job 상태 조회 - Gateway->>Content: 상태 조회 - Content->>DB: 상태 확인 - DB-->>Content: 상태 + 진행률 - Content-->>Gateway: 진행 상황 (예: 60% 완료) - Gateway-->>Client: 진행률 표시 - end - - Client->>Gateway: 최종 상태 조회 - Gateway->>Content: 상태 조회 - Content-->>Gateway: COMPLETED + 콘텐츠 URL - Gateway-->>Client: 콘텐츠 다운로드 -``` - -**예상 성과**: -- **총 처리시간: 5-8분** (목표 달성) -- 사용자 대기 체감 시간: 8분 → 0초 (비동기) -- 동시 처리 능력: 50개 콘텐츠 - ---- - -### 3.4 Distribution 서비스 - 안정적 배포 - -**패턴 적용**: -- **Circuit Breaker**: 6개 외부 API 장애 대응 -- **Retry**: 배포 실패 자동 재시도 (3회) -- **Queue-Based Load Leveling**: 100개 동시 배포 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Dist as Distribution - participant Queue as RabbitMQ - participant CB1 as Circuit Breaker
(우리동네TV) - participant CB2 as Circuit Breaker
(지니TV) - participant CB3 as Circuit Breaker
(Instagram) - participant KTAPI as KT API - participant SNS as SNS API - - Client->>Gateway: 배포 요청 (6개 채널) - Gateway->>Dist: 배포 시작 - Dist->>Queue: 배포 작업 큐잉 - - par 병렬 배포 (1분 목표) - Queue->>CB1: 우리동네TV 배포 - CB1->>KTAPI: API 호출 - alt API 성공 - KTAPI-->>CB1: 배포 완료 - else API 실패 - KTAPI--xCB1: 오류 - CB1->>CB1: Retry (최대 3회) - alt Retry 성공 - CB1->>KTAPI: 재시도 - KTAPI-->>CB1: 배포 완료 - else Retry 실패 - CB1-->>Queue: 배포 실패 (OPEN 상태) - end - end - CB1-->>Dist: 결과 반환 - and - Queue->>CB2: 지니TV 배포 - CB2->>KTAPI: API 호출 - KTAPI-->>CB2: 배포 완료 - CB2-->>Dist: 결과 반환 - and - Queue->>CB3: Instagram 배포 - CB3->>SNS: API 호출 - SNS-->>CB3: 포스팅 완료 - CB3-->>Dist: 결과 반환 - end - - Dist-->>Gateway: 배포 결과 (성공 5/6) - Gateway-->>Client: 배포 완료 + 실패 채널 안내 -``` - -**예상 성과**: -- **총 배포시간: 1분 이내** (목표 달성) -- 배포 성공률: 95% → 98% (Retry) -- API 장애 시 응답: 30초 → 3초 (Circuit Breaker) - ---- - -### 3.5 Analytics 서비스 - CQRS 읽기/쓰기 분리 - -**패턴 적용**: -- **CQRS**: 읽기/쓰기 분리 -- **Publisher-Subscriber**: 5분 간격 데이터 수집 - -**아키텍처**: -```mermaid -graph TB - subgraph "쓰기 모델" - Collector[데이터 수집기
5분 스케줄러] - WriteAPI[쓰기 API] - CommandDB[(Command DB
원본 데이터)] - end - - subgraph "이벤트 버스" - EventBus[RabbitMQ
Pub-Sub] - end - - subgraph "읽기 모델" - ReadAPI[읽기 API
대시보드] - QueryDB[(Query DB
집계 데이터)] - Aggregator[집계 프로세서] - end - - subgraph "외부 데이터 소스" - KTAPI[KT API] - SNS[SNS API] - POS[POS] - end - - Collector -->|5분마다| KTAPI - Collector -->|5분마다| SNS - Collector -->|5분마다| POS - Collector --> WriteAPI - WriteAPI --> CommandDB - CommandDB --> EventBus - EventBus --> Aggregator - Aggregator -->|ROI 계산
채널별 집계| QueryDB - ReadAPI --> QueryDB - - Client[클라이언트
대시보드] -->|실시간 조회| ReadAPI -``` - -**예상 성과**: -- 대시보드 조회 속도: 5초 → 1초 (80% 향상) -- ROI 계산 응답: 10초 → 2초 -- 동시 조회 처리: 100개 대시보드 - ---- - -## 4. Phase별 구현 로드맵 - -### Phase 1: MVP (Minimum Viable Product) - 3개월 - -**목표**: 핵심 비즈니스 기능 제공 및 빠른 출시 - -**적용 패턴**: -1. **API Gateway** - 단일 진입점 및 인증/인가 -2. **Async Request-Reply** - 콘텐츠 생성 비동기 처리 -3. **Circuit Breaker** - 외부 API 장애 대응 -4. **Cache-Aside** - 트렌드 데이터 캐싱 -5. **Retry** - 배포 실패 자동 재시도 - -**구현 우선순위**: -1. **Week 1-4**: User 서비스 + API Gateway - - 회원가입/로그인 (JWT 인증) - - 매장 정보 관리 - - 사업자번호 검증 연동 - -2. **Week 5-8**: Event Planning 서비스 - - AI API 연동 (Claude, GPT-4) - - Cache-Aside 패턴 적용 (Redis) - - Circuit Breaker 적용 - -3. **Week 9-10**: Content Generation 서비스 - - Async Request-Reply 패턴 구현 - - Stable Diffusion 연동 - - 진행 상황 폴링 API - -4. **Week 11-12**: Distribution + Participation 서비스 - - 6개 채널 병렬 배포 (Circuit Breaker + Retry) - - 추첨/선착순 분기 로직 - -**성공 지표**: -- Event Planning: 10초 이내 응답 ✅ -- Content Generation: 8분 이내 완료 ✅ -- Distribution: 1분 이내 배포 ✅ -- 동시 이벤트 처리: 50개 - ---- - -### Phase 2: 확장 (Scale-up) - 3개월 - -**목표**: 성능 최적화 및 사용자 증가 대응 - -**추가 패턴**: -6. **CQRS** - Analytics 읽기/쓰기 분리 -7. **Queue-Based Load Leveling** - 피크 타임 부하 평준화 -8. **Publisher-Subscriber** - 서비스 간 이벤트 기반 통신 - -**구현 계획**: -1. **Week 1-4**: Analytics 서비스 CQRS 적용 - - Command DB / Query DB 분리 - - 5분 간격 데이터 수집 스케줄러 - - 실시간 대시보드 최적화 - -2. **Week 5-8**: 메시지 큐 도입 (RabbitMQ/Kafka) - - Queue-Based Load Leveling 적용 - - Publisher-Subscriber 패턴 구현 - - 서비스 간 결합도 감소 - -3. **Week 9-12**: 성능 모니터링 및 최적화 - - Auto Scaling 설정 - - 로드 밸런싱 최적화 - - 캐시 전략 개선 - -**성공 지표**: -- 동시 이벤트 처리: 100개 ✅ -- 대시보드 조회 속도: 1초 이내 ✅ -- 시스템 가용성: 99.9% ✅ - ---- - -### Phase 3: 고도화 (Advanced) - 6개월 - -**목표**: AI 학습 고도화 및 글로벌 확장 - -**추가 패턴**: -9. **Event Sourcing** - AI Learning 학습 데이터 추적 -10. **Choreography** - 워크플로 자율 조정 - -**구현 계획**: -1. **Week 1-8**: AI Learning 서비스 고도화 - - Event Sourcing 패턴 적용 - - 성공/실패 패턴 학습 고도화 - - 추천 정확도 30% 향상 - -2. **Week 9-16**: Choreography 패턴 적용 - - Event Planning → Content → Distribution 자율 조정 - - 중앙 조정자 제거 - - 워크플로 확장성 향상 - -3. **Week 17-24**: 글로벌 확장 대비 - - Geodes 패턴 (다중 지역 배포) - - Federated Identity (글로벌 인증) - -**성공 지표**: -- AI 추천 정확도: 30% 향상 ✅ -- 워크플로 확장성: 무제한 ✅ -- 글로벌 지연 시간: 100ms 이내 ✅ - ---- - -## 5. 예상 성과 지표 - -### 5.1 성능 개선 - -| 지표 | 현재 (패턴 미적용) | Phase 1 MVP | Phase 2 확장 | Phase 3 고도화 | -|------|-------------------|-------------|-------------|---------------| -| **Event Planning 응답시간** | 25초 | **10초** ✅ | 8초 | 6초 | -| **Content Generation 완료시간** | 12분 | **8분** ✅ | 6분 | 5분 | -| **Distribution 배포시간** | 3분 | **1분** ✅ | 40초 | 30초 | -| **Analytics 대시보드 조회** | 5초 | 3초 | **1초** ✅ | 0.5초 | -| **동시 이벤트 처리** | 20개 | 50개 | **100개** ✅ | 300개 | -| **시스템 가용성** | 95% | 99% | **99.9%** ✅ | 99.99% | - ---- - -### 5.2 비용 절감 효과 - -| 항목 | 절감율 | 연간 절감액 (추정) | -|------|--------|-------------------| -| **AI API 호출 비용** (Cache-Aside) | 40% | ₩24,000,000 | -| **외부 API 재시도 비용** (Circuit Breaker) | 30% | ₩9,000,000 | -| **서버 리소스 비용** (CQRS, 캐싱) | 25% | ₩15,000,000 | -| **운영 인력 비용** (자동화) | 20% | ₩12,000,000 | -| **총 절감액** | - | **₩60,000,000** | - ---- - -### 5.3 개발 생산성 향상 - -| 지표 | 개선율 | -|------|--------| -| **서비스 간 결합도 감소** (Pub-Sub) | 70% | -| **장애 복구 시간** (Circuit Breaker) | 80% | -| **새 기능 개발 속도** (패턴 재사용) | 50% | -| **코드 재사용률** (Gateway, Sidecar) | 60% | - ---- - -## 6. 구현 시 고려사항 - -### 6.1 API Gateway -- **기술 스택**: Kong, AWS API Gateway, Azure API Management -- **Rate Limiting**: 사용자당 1분 100 요청 -- **JWT 토큰**: 만료 시간 1시간, Refresh Token 7일 -- **로깅**: 모든 요청/응답 로그 저장 (CloudWatch, ELK) - -### 6.2 Async Request-Reply -- **Job ID 관리**: UUID v4 사용 -- **상태 폴링**: 5초 간격, 최대 10분 타임아웃 -- **WebSocket 대안**: 실시간 진행 상황 푸시 (선택사항) - -### 6.3 Circuit Breaker -- **타임아웃 설정**: 외부 API별 차등 (15초 ~ 60초) -- **실패 임계값**: 50% 실패 시 OPEN -- **재시도 간격**: 30초 후 HALF-OPEN -- **폴백 전략**: 캐시 데이터 반환 또는 기본값 제공 - -### 6.4 Cache-Aside -- **캐시 TTL**: 트렌드 데이터 1시간, AI 응답 30분 -- **캐시 무효화**: 데이터 업데이트 시 자동 삭제 -- **Redis Cluster**: 고가용성 보장 - -### 6.5 CQRS -- **DB 선택**: Command (PostgreSQL), Query (MongoDB) -- **동기화 지연**: 최대 5초 -- **이벤트 버스**: RabbitMQ 또는 Kafka - ---- - -## 7. 리스크 관리 - -### 7.1 기술적 리스크 - -| 리스크 | 확률 | 영향도 | 완화 전략 | -|--------|------|--------|-----------| -| AI API 응답 지연 (>10초) | 중간 | 높음 | Cache-Aside, 프롬프트 최적화, 병렬 호출 | -| 외부 API 장애 | 높음 | 높음 | Circuit Breaker, Retry, 폴백 전략 | -| Redis 장애 | 낮음 | 중간 | Redis Cluster, DB 폴백 | -| 메시지 큐 장애 | 낮음 | 높음 | Dead Letter Queue, 재처리 로직 | - -### 7.2 운영 리스크 - -| 리스크 | 확률 | 영향도 | 완화 전략 | -|--------|------|--------|-----------| -| 피크 타임 트래픽 폭주 | 높음 | 높음 | Auto Scaling, Queue-Based Load Leveling | -| 데이터 불일치 (CQRS) | 중간 | 중간 | 이벤트 재생, 수동 동기화 도구 | -| 배포 실패율 증가 | 중간 | 중간 | Retry 3회, 수동 배포 옵션 | - ---- - -## 8. 결론 - -### 8.1 핵심 패턴 요약 - -본 서비스는 **10개의 클라우드 아키텍처 패턴**을 3단계로 적용하여 성능, 확장성, 안정성을 보장합니다: - -1. **API Gateway**: 단일 진입점 및 횡단 관심사 분리 -2. **Async Request-Reply**: 장시간 처리 작업 비동기화 -3. **Circuit Breaker**: 외부 API 장애 대응 -4. **Cache-Aside**: 응답 시간 단축 -5. **CQRS**: 읽기/쓰기 분리로 조회 성능 최적화 -6. **Event Sourcing**: AI 학습 데이터 추적 -7. **Queue-Based Load Leveling**: 부하 평준화 -8. **Retry**: 일시적 오류 자동 복구 -9. **Publisher-Subscriber**: 서비스 간 결합도 감소 -10. **Choreography**: 워크플로 자율 조정 - -### 8.2 예상 효과 - -- **Event Planning**: 25초 → **10초** (60% 단축) ✅ -- **Content Generation**: 12분 → **8분** (33% 단축) ✅ -- **Distribution**: 3분 → **1분** (67% 단축) ✅ -- **시스템 가용성**: 95% → **99.9%** ✅ -- **동시 이벤트 처리**: 20개 → **100개** (5배 향상) ✅ -- **연간 비용 절감**: **₩60,000,000** 💰 - -### 8.3 다음 단계 - -1. **Phase 1 MVP 착수** (3개월) - - API Gateway + Async Request-Reply + Circuit Breaker 우선 구현 - - 핵심 비즈니스 기능 검증 - -2. **성능 모니터링** - - Prometheus + Grafana 대시보드 구축 - - 각 패턴별 성과 지표 측정 - -3. **지속적 개선** - - Phase 2, 3 로드맵에 따라 점진적 고도화 - - AI 학습 정확도 향상 및 글로벌 확장 - ---- - -**문서 승인**: -- [ ] System Architect (박영자) -- [ ] Backend Developer (최수연) -- [ ] DevOps Engineer (송근정) -- [ ] PO (갑빠) - -**참조 문서**: -- design/userstory.md -- claude/cloud-design-patterns.md -- claude/architecture-patterns.md diff --git a/TEMP_BACKUP/pattern/architecture-pattern.md b/TEMP_BACKUP/pattern/architecture-pattern.md deleted file mode 100644 index 6b8d3c5..0000000 --- a/TEMP_BACKUP/pattern/architecture-pattern.md +++ /dev/null @@ -1,685 +0,0 @@ -# KT AI 기반 소상공인 이벤트 자동 생성 서비스 - 클라우드 아키텍처 패턴 선정서 - -**작성일**: 2025-10-21 -**작성자**: System Architect (박영자) -**버전**: 2.0 (3개 핵심 패턴 적용) - ---- - -## 1. 요구사항 분석 - -### 1.1 마이크로서비스별 기능 및 비기능 요구사항 - -#### 1.1.1 User 서비스 -**기능 요구사항**: -- 회원가입/로그인 (JWT 인증) -- 매장 정보 관리 및 사업자번호 검증 -- KT 인증 시스템 연동 - -**비기능 요구사항**: -- 응답시간: 1초 이내 -- 가용성: 99.9% -- 보안: 개인정보 암호화 (AES-256), HTTPS/TLS -- 확장성: 1,000 동시 사용자 - -**기술적 도전과제**: -- 외부 사업자번호 검증 API 의존성 -- 인증 토큰 관리 및 세션 유지 -- 개인정보 보호 규정 준수 - ---- - -#### 1.1.2 Event Planning 서비스 -**기능 요구사항**: -- AI 기반 업종/지역 트렌드 분석 -- AI 이벤트상품 추천 (Claude API) -- AI 참여 방법 설계 -- AI 홍보 문구 생성 (GPT-4 API) - -**비기능 요구사항**: -- **응답시간: 10초 이내 (전체 기획 과정)** ⚡ -- AI API 병렬 호출 필수 -- 추첨형/선착순형 이벤트 자동 프로세스 분기 -- 확장성: 100개 동시 이벤트 기획 - -**기술적 도전과제**: -- **Claude + GPT-4 API 병렬 호출 및 응답 시간 관리** -- AI 프롬프트 최적화로 10초 목표 달성 -- 트렌드 데이터베이스 실시간 조회 성능 -- 응답 캐싱 전략 - ---- - -#### 1.1.3 Content Generation 서비스 -**기능 요구사항**: -- AI 이미지 생성 (Stable Diffusion, 3종) -- AI 영상 제작 (15초) -- SNS 콘텐츠 자동 생성 (플랫폼별 최적화) -- QR 포스터 생성 - -**비기능 요구사항**: -- **응답시간: 5-8분 이내 (병렬 처리 시)** ⚡ -- 이미지 생성: 2-3분 (Stable Diffusion 특성) -- 영상 제작: 3-5분 (AI 영상 엔진 특성) -- GPU 가속 활용 -- 확장성: 50개 동시 콘텐츠 생성 - -**기술적 도전과제**: -- **이미지 3종 + 영상 1개 병렬 생성** -- 진행 상황 실시간 피드백 -- 백그라운드 비동기 처리 필수 -- 품질과 속도 균형 유지 - ---- - -#### 1.1.4 Distribution 서비스 -**기능 요구사항**: -- 다중 채널 배포 (우리동네TV, 링고비즈, 지니TV, Instagram, Naver Blog, Kakao Channel) -- 네이버 클로바 TTS 연동 (연결음 생성) -- 배포 실패 시 자동 재시도 (3회) - -**비기능 요구사항**: -- **응답시간: 1분 이내 (전체 배포 과정)** ⚡ -- 채널별 병렬 배포 필수 -- 배포 상태 실시간 업데이트 -- 확장성: 100개 동시 배포 - -**기술적 도전과제**: -- **6개 외부 API 병렬 호출 및 통합** -- API 장애 대응 (Circuit Breaker, Retry) -- 네이버 클로바 TTS 품질 보장 -- 배포 실패 복구 전략 - ---- - -#### 1.1.5 Participation 서비스 -**기능 요구사항**: -- 이벤트 참여 신청 및 중복 방지 -- 추첨형 자동 추첨 (매장 방문 고객 가산점) -- 선착순형 쿠폰 소진 시 자동 종료 -- 당첨 알림 발송 (SMS/카카오 알림톡) - -**비기능 요구사항**: -- 응답시간: 1초 이내 -- 1인 1회 참여 보장 (멱등성) -- 공정한 추첨 알고리즘 -- 확장성: 10,000 동시 참여 - -**기술적 도전과제**: -- 중복 참여 방지 (전화번호 기준) -- 추첨형/선착순형 프로세스 분기 -- 대량 SMS/알림톡 발송 -- 매장 방문 고객 가산점 처리 - ---- - -#### 1.1.6 Analytics 서비스 -**기능 요구사항**: -- 실시간 대시보드 (참여자 수, 노출 수, 매출 증가율) -- 5분 간격 데이터 수집 및 업데이트 -- 채널별 성과 분석 (Instagram, Naver Blog, Kakao Channel API) -- ROI 자동 계산 -- 분석 리포트 PDF 생성 - -**비기능 요구사항**: -- **데이터 수집 주기: 5분 간격** ⏱ -- 실시간 데이터 시각화 -- 확장성: 100개 이벤트 동시 분석 - -**기술적 도전과제**: -- **다중 데이터 소스 통합 (KT API, POS, SNS API)** -- 5분 간격 스케줄러 기반 수집 -- 대시보드 실시간 업데이트 - ---- - -#### 1.1.7 AI Learning 서비스 -**기능 요구사항**: -- 이벤트 결과 분석 및 개선안 생성 -- 성공 패턴 학습 및 재활용 -- 다음 이벤트 아이디어 제안 (시즌별) - -**비기능 요구사항**: -- 빅데이터 분석 시스템 연동 -- AI 머신러닝 엔진 API 호출 -- 학습 데이터 누적 및 모델 개선 -- 확장성: 누적 데이터 기반 지속적 학습 - -**기술적 도전과제**: -- 성공/실패 패턴 자동 학습 -- 업종별/지역별 데이터 축적 -- 추천 정확도 향상 알고리즘 - ---- - -### 1.2 통합 분석 및 핵심 도전과제 - -#### 성능 목표 요약 -| 서비스 | 목표 응답시간 | 핵심 최적화 전략 | -|--------|--------------|------------------| -| Event Planning | **10초 이내** | AI API 병렬 호출 | -| Content Generation | **5-8분 이내** | 이미지+영상 병렬 생성, 비동기 처리 | -| Distribution | **1분 이내** | 6개 채널 병렬 배포 | -| Analytics | **5분 주기** | 스케줄러 수집 | - -#### 확장성 요구사항 -- **동시 이벤트 처리**: 최소 100개 -- **AI API 동시 호출**: 최소 50개 -- **배포 API 동시 호출**: 최소 100개 - -#### 외부 시스템 의존성 -- **KT 채널**: 우리동네TV, 링고비즈, 지니TV -- **AI API**: Claude, GPT-4, Stable Diffusion -- **SNS**: Instagram, Naver Blog, Kakao Channel -- **기타**: 네이버 클로바 TTS, 사업자번호 검증, POS 시스템 - ---- - -## 2. 클라우드 아키텍처 패턴 선정 - -### 2.1 패턴 평가 매트릭스 - -#### 핵심 패턴 정량 평가 - -| 패턴 | 기능 적합성
(35%) | 성능 효과
(25%) | 운영 복잡도
(20%) | 확장성
(15%) | 비용 효율성
(5%) | **총점** | **우선순위** | -|------|:---:|:---:|:---:|:---:|:---:|:---:|:---:| -| **API Gateway** | 10 × 0.35 = 3.5 | 9 × 0.25 = 2.25 | 9 × 0.20 = 1.8 | 9 × 0.15 = 1.35 | 8 × 0.05 = 0.4 | **9.30** | 🥇 1위 | -| **Async Request-Reply** | 10 × 0.35 = 3.5 | 9 × 0.25 = 2.25 | 7 × 0.20 = 1.4 | 8 × 0.15 = 1.2 | 7 × 0.05 = 0.35 | **8.70** | 🥈 2위 | -| **Circuit Breaker** | 9 × 0.35 = 3.15 | 7 × 0.25 = 1.75 | 8 × 0.20 = 1.6 | 8 × 0.15 = 1.2 | 8 × 0.05 = 0.4 | **8.10** | 🥉 3위 | - ---- - -### 2.2 선정 패턴 및 적용 전략 - -#### 🥇 **1. API Gateway** (총점: 9.30) - -**선정 이유**: -- 단일 진입점으로 7개 마이크로서비스 라우팅 -- 인증/인가 중앙 처리 (JWT 토큰 검증) -- Rate Limiting으로 100개 동시 이벤트 관리 -- 횡단 관심사 분리 (로깅, 모니터링) - -**적용 서비스**: 전체 서비스 - -**예상 효과**: -- 클라이언트 요청 단순화 (1개 엔드포인트) -- 인증 처리 시간 50% 단축 -- 서비스 간 결합도 감소 - -**구현 기술**: -- **기술 스택**: Kong, AWS API Gateway, Spring Cloud Gateway -- **Rate Limiting**: 사용자당 1분 100 요청 -- **JWT 토큰**: 만료 시간 1시간, Refresh Token 7일 -- **로깅**: 모든 요청/응답 로그 저장 (CloudWatch, ELK) - ---- - -#### 🥈 **2. Async Request-Reply** (총점: 8.70) - -**선정 이유**: -- **Content Generation 서비스의 5-8분 처리 시간 대응** -- 이미지/영상 생성 백그라운드 처리 -- 진행 상황 실시간 피드백 (폴링) -- 클라이언트 블로킹 방지 - -**적용 서비스**: Content Generation - -**예상 효과**: -- 사용자 대기 시간 체감 80% 감소 -- 시스템 응답성 향상 -- 동시 콘텐츠 생성 50개 처리 가능 - -**구현 기술**: -- **Job ID 관리**: UUID v4 사용 -- **상태 폴링**: 5초 간격, 최대 10분 타임아웃 -- **상태 관리**: Redis 또는 DB 기반 Job 상태 추적 - -**구현 예시**: -```javascript -// 클라이언트: 콘텐츠 생성 요청 -const response = await axios.post('/api/content/generate', { - eventId: 'evt-001', - imageCount: 3 -}); -const jobId = response.data.jobId; // Job ID 발급 - -// 상태 폴링 (5초 간격) -const checkStatus = setInterval(async () => { - const status = await axios.get(`/api/content/status/${jobId}`); - if (status.data.completed) { - clearInterval(checkStatus); - // 콘텐츠 다운로드 - } -}, 5000); -``` - ---- - -#### 🥉 **3. Circuit Breaker** (총점: 8.10) - -**선정 이유**: -- **6개 외부 API 장애 대응 (KT 채널, AI API, SNS)** -- Distribution 서비스의 배포 실패 방지 -- API 장애 시 빠른 실패 및 폴백 -- 연쇄 장애 전파 차단 - -**적용 서비스**: Distribution, Event Planning, Content Generation - -**예상 효과**: -- API 장애 시 응답 시간 95% 단축 -- 시스템 가용성 99.9% 보장 -- 배포 성공률 98% 이상 유지 - -**구현 기술**: -- **타임아웃 설정**: 외부 API별 차등 (15초 ~ 60초) -- **실패 임계값**: 50% 실패 시 OPEN -- **재시도 간격**: 30초 후 HALF-OPEN -- **폴백 전략**: 기본값 제공 또는 실패 메시지 - -**구현 예시** (Node.js with opossum): -```javascript -const CircuitBreaker = require('opossum'); - -// 우리동네TV API 호출 -const callWooridongneTV = async (data) => { - return axios.post('https://api.wooridongne.kt.com/deploy', data); -}; - -const breaker = new CircuitBreaker(callWooridongneTV, { - timeout: 15000, // 15초 타임아웃 - errorThresholdPercentage: 50, // 50% 실패 시 OPEN - resetTimeout: 30000 // 30초 후 재시도 -}); - -breaker.fallback(() => ({ - success: false, - message: '우리동네TV 배포 실패' -})); - -// 배포 요청 -const result = await breaker.fire(deployData); -``` - -**Spring Boot 예시** (Resilience4j): -```java -@Service -public class DistributionService { - - @CircuitBreaker(name = "wooridongneTV", fallbackMethod = "fallbackDeploy") - public DeployResult deployToWooridongneTV(DeployData data) { - return wooridongneAPI.deploy(data); - } - - private DeployResult fallbackDeploy(DeployData data, Exception e) { - return DeployResult.builder() - .success(false) - .message("우리동네TV 배포 실패: " + e.getMessage()) - .build(); - } -} -``` - ---- - -## 3. 서비스별 패턴 적용 설계 - -### 3.1 전체 아키텍처 구조 - -```mermaid -graph TB - subgraph "클라이언트" - Web[웹 애플리케이션] - Mobile[모바일 앱] - end - - subgraph "API Gateway Layer" - Gateway[API Gateway
인증/인가/라우팅/Rate Limiting] - end - - subgraph "마이크로서비스" - User[User 서비스
회원/매장 관리] - Planning[Event Planning 서비스
AI 이벤트 기획] - Content[Content Generation 서비스
AI 콘텐츠 생성
Async Request-Reply] - Dist[Distribution 서비스
다중 채널 배포
Circuit Breaker] - Participation[Participation 서비스
참여/추첨 관리] - Analytics[Analytics 서비스
효과 측정] - AILearn[AI Learning 서비스
학습/개선] - end - - subgraph "데이터 계층" - UserDB[(User DB
PostgreSQL)] - PlanningDB[(Planning DB
MongoDB)] - ContentDB[(Content DB
MongoDB)] - DistDB[(Distribution DB
PostgreSQL)] - PartDB[(Participation DB
PostgreSQL)] - AnalyticsDB[(Analytics DB
MongoDB)] - AILearnDB[(AI Learning DB
MongoDB)] - JobStore[(Job Store
Redis)] - end - - subgraph "외부 시스템" - KTAPI[KT 채널 API
우리동네TV/링고비즈/지니TV] - AIAPI[AI API
Claude/GPT-4/Stable Diffusion] - SNS[SNS API
Instagram/Naver/Kakao] - Clova[네이버 클로바 TTS] - POS[POS 시스템] - end - - Web --> Gateway - Mobile --> Gateway - - Gateway --> User - Gateway --> Planning - Gateway --> Content - Gateway --> Dist - Gateway --> Participation - Gateway --> Analytics - Gateway --> AILearn - - User --> UserDB - Planning --> PlanningDB - Content --> ContentDB - Content --> JobStore - Dist --> DistDB - Participation --> PartDB - Analytics --> AnalyticsDB - AILearn --> AILearnDB - - Planning -->|Circuit Breaker| AIAPI - Content -->|Circuit Breaker| AIAPI - Dist -->|Circuit Breaker| KTAPI - Dist -->|Circuit Breaker| SNS - Dist -->|Circuit Breaker| Clova - Analytics --> KTAPI - Analytics --> SNS - Analytics --> POS -``` - ---- - -### 3.2 Event Planning 서비스 - 10초 응답 최적화 - -**패턴 적용**: -- **Circuit Breaker**: Claude + GPT-4 API 장애 대응 -- **병렬 처리**: AI API 동시 호출 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Planning as Event Planning - participant DB as Planning DB - participant Claude as Claude API - participant GPT4 as GPT-4 API - - Client->>Gateway: 이벤트 기획 시작 - Gateway->>Planning: 기획 요청 - - Note over Planning,DB: Phase 1: 트렌드 분석 (3초 목표) - Planning->>DB: 트렌드 데이터 조회 - DB-->>Planning: 트렌드 데이터 - - Note over Planning,GPT4: Phase 2: AI 병렬 호출 (7초 목표) - par Claude: 이벤트상품 + 참여방법 - Planning->>Claude: 이벤트상품 추천 요청
+ 참여방법 설계 요청 - Claude-->>Planning: 추천 결과 (5초) - and GPT-4: 홍보문구 - Planning->>GPT4: 홍보문구 생성 요청 - GPT4-->>Planning: 홍보문구 (4초) - end - - Planning->>DB: 기획안 저장 - Planning-->>Gateway: 완성된 기획안 (총 10초 이내) - Gateway-->>Client: 기획안 제공 -``` - -**예상 성과**: -- **총 응답시간: 10초 이내** (목표 달성) -- AI API 병렬 호출: 9초 → 5초 - ---- - -### 3.3 Content Generation 서비스 - 비동기 처리 - -**패턴 적용**: -- **Async Request-Reply**: 5-8분 장시간 처리 -- **Circuit Breaker**: Stable Diffusion API 장애 대응 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Content as Content Generation - participant JobStore as Job Store (Redis) - participant Worker as Background Worker - participant SD as Stable Diffusion - participant VideoAI as AI Video Engine - participant DB as Content DB - - Client->>Gateway: 콘텐츠 생성 요청 - Gateway->>Content: 생성 요청 - Content->>JobStore: Job 생성 (상태: PENDING) - Content-->>Gateway: Job ID 발급 - Gateway-->>Client: Job ID 반환 - - Note over Client: 클라이언트는 다른 작업 가능 - - Content->>Worker: 비동기 작업 시작 - - par 이미지 3종 생성 (2-3분) - Worker->>SD: 이미지 생성 요청 (3건 병렬) - SD-->>Worker: 이미지 3종 - and 영상 1개 생성 (3-5분) - Worker->>VideoAI: 영상 제작 요청 - VideoAI-->>Worker: 15초 영상 - end - - Worker->>DB: 콘텐츠 저장 - Worker->>JobStore: 상태 업데이트 (COMPLETED) - - loop 상태 확인 (5초 간격) - Client->>Gateway: Job 상태 조회 - Gateway->>Content: 상태 조회 - Content->>JobStore: 상태 확인 - JobStore-->>Content: 상태 + 진행률 - Content-->>Gateway: 진행 상황 (예: 60% 완료) - Gateway-->>Client: 진행률 표시 - end - - Client->>Gateway: 최종 상태 조회 - Gateway->>Content: 상태 조회 - Content-->>Gateway: COMPLETED + 콘텐츠 URL - Gateway-->>Client: 콘텐츠 다운로드 -``` - -**예상 성과**: -- **총 처리시간: 5-8분** (목표 달성) -- 사용자 대기 체감 시간: 8분 → 0초 (비동기) -- 동시 처리 능력: 50개 콘텐츠 - ---- - -### 3.4 Distribution 서비스 - 안정적 배포 - -**패턴 적용**: -- **Circuit Breaker**: 6개 외부 API 장애 대응 -- **병렬 배포**: 6개 채널 동시 배포 - -**아키텍처**: -```mermaid -sequenceDiagram - participant Client - participant Gateway - participant Dist as Distribution - participant CB1 as Circuit Breaker
(우리동네TV) - participant CB2 as Circuit Breaker
(지니TV) - participant CB3 as Circuit Breaker
(Instagram) - participant KTAPI as KT API - participant SNS as SNS API - - Client->>Gateway: 배포 요청 (6개 채널) - Gateway->>Dist: 배포 시작 - - par 병렬 배포 (1분 목표) - Dist->>CB1: 우리동네TV 배포 - CB1->>KTAPI: API 호출 - alt API 성공 - KTAPI-->>CB1: 배포 완료 - else API 실패 - KTAPI--xCB1: 오류 - CB1-->>Dist: Fallback (배포 실패) - end - CB1-->>Dist: 결과 반환 - and - Dist->>CB2: 지니TV 배포 - CB2->>KTAPI: API 호출 - KTAPI-->>CB2: 배포 완료 - CB2-->>Dist: 결과 반환 - and - Dist->>CB3: Instagram 배포 - CB3->>SNS: API 호출 - SNS-->>CB3: 포스팅 완료 - CB3-->>Dist: 결과 반환 - end - - Dist-->>Gateway: 배포 결과 (성공 5/6) - Gateway-->>Client: 배포 완료 + 실패 채널 안내 -``` - -**예상 성과**: -- **총 배포시간: 1분 이내** (목표 달성) -- API 장애 시 응답: 30초 → 3초 (Circuit Breaker) -- 배포 안정성: 95% → 98% - ---- - -## 4. 구현 로드맵 - -### Phase 1: MVP (Minimum Viable Product) - 3개월 - -**목표**: 핵심 비즈니스 기능 제공 및 빠른 출시 - -**적용 패턴**: -1. **API Gateway** - 단일 진입점 및 인증/인가 -2. **Async Request-Reply** - 콘텐츠 생성 비동기 처리 -3. **Circuit Breaker** - 외부 API 장애 대응 - -**구현 우선순위**: -1. **Week 1-4**: User 서비스 + API Gateway - - 회원가입/로그인 (JWT 인증) - - 매장 정보 관리 - - 사업자번호 검증 연동 - - API Gateway 구축 (Kong 또는 Spring Cloud Gateway) - -2. **Week 5-8**: Event Planning 서비스 - - AI API 연동 (Claude, GPT-4) - - Circuit Breaker 적용 - - AI API 병렬 호출 구현 - -3. **Week 9-10**: Content Generation 서비스 - - Async Request-Reply 패턴 구현 - - Stable Diffusion 연동 - - 진행 상황 폴링 API - - Redis 기반 Job Store 구축 - -4. **Week 11-12**: Distribution + Participation 서비스 - - 6개 채널 병렬 배포 (Circuit Breaker) - - 추첨/선착순 분기 로직 - -**성공 지표**: -- Event Planning: 10초 이내 응답 ✅ -- Content Generation: 8분 이내 완료 ✅ -- Distribution: 1분 이내 배포 ✅ -- 동시 이벤트 처리: 50개 - ---- - -## 5. 예상 성과 지표 - -### 5.1 성능 개선 - -| 지표 | 현재 (패턴 미적용) | Phase 1 MVP | -|------|-------------------|-------------| -| **Event Planning 응답시간** | 25초 | **10초** ✅ | -| **Content Generation 완료시간** | 12분 | **8분** ✅ | -| **Distribution 배포시간** | 3분 | **1분** ✅ | -| **동시 이벤트 처리** | 20개 | 50개 | -| **시스템 가용성** | 95% | 99% | - ---- - -### 5.2 패턴별 기대 효과 - -| 패턴 | 적용 효과 | 개선율 | -|------|----------|--------| -| **API Gateway** | 클라이언트 통합 엔드포인트, 인증 중앙화 | 인증 처리 50% 단축 | -| **Async Request-Reply** | 사용자 대기 시간 체감 감소 | 80% 체감 시간 감소 | -| **Circuit Breaker** | API 장애 시 빠른 실패, 연쇄 장애 방지 | 응답 시간 95% 단축 | - ---- - -## 6. 리스크 관리 - -### 6.1 기술적 리스크 - -| 리스크 | 확률 | 영향도 | 완화 전략 | -|--------|------|--------|-----------| -| AI API 응답 지연 (>10초) | 중간 | 높음 | 병렬 호출, 프롬프트 최적화 | -| 외부 API 장애 | 높음 | 높음 | Circuit Breaker, 폴백 전략 | -| Job Store (Redis) 장애 | 낮음 | 중간 | Redis Cluster, DB 폴백 | - -### 6.2 운영 리스크 - -| 리스크 | 확률 | 영향도 | 완화 전략 | -|--------|------|--------|-----------| -| 피크 타임 트래픽 폭주 | 높음 | 높음 | Auto Scaling, Rate Limiting | -| 배포 실패율 증가 | 중간 | 중간 | Circuit Breaker 폴백 전략 | - ---- - -## 7. 결론 - -### 7.1 핵심 패턴 요약 - -본 서비스는 **3개의 클라우드 아키텍처 패턴**을 적용하여 성능, 확장성, 안정성을 보장합니다: - -1. **API Gateway**: 단일 진입점 및 횡단 관심사 분리 -2. **Async Request-Reply**: 장시간 처리 작업 비동기화 -3. **Circuit Breaker**: 외부 API 장애 대응 - -### 7.2 예상 효과 - -- **Event Planning**: 25초 → **10초** (60% 단축) ✅ -- **Content Generation**: 12분 → **8분** (33% 단축) ✅ -- **Distribution**: 3분 → **1분** (67% 단축) ✅ -- **시스템 가용성**: 95% → **99%** ✅ -- **동시 이벤트 처리**: 20개 → **50개** (2.5배 향상) ✅ - -### 7.3 다음 단계 - -1. **Phase 1 MVP 착수** (3개월) - - API Gateway + Async Request-Reply + Circuit Breaker 우선 구현 - - 핵심 비즈니스 기능 검증 - -2. **성능 모니터링** - - Prometheus + Grafana 대시보드 구축 - - 각 패턴별 성과 지표 측정 - -3. **지속적 개선** - - 추가 패턴 도입 검토 (Cache-Aside, CQRS 등) - - AI 학습 정확도 향상 - ---- - -**문서 승인**: -- [ ] System Architect (박영자) -- [ ] Backend Developer (최수연) -- [ ] DevOps Engineer (송근정) -- [ ] PO (갑빠) - -**참조 문서**: -- design/userstory.md -- claude/cloud-design-patterns.md -- design/pattern/architecture-pattern-backup-20251021.md (백업) diff --git a/TEMP_BACKUP/prototype/00-로그인.html b/TEMP_BACKUP/prototype/00-로그인.html deleted file mode 100644 index 784d35e..0000000 --- a/TEMP_BACKUP/prototype/00-로그인.html +++ /dev/null @@ -1,414 +0,0 @@ - - - - - - - 로그인 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - -
- -
-
-

AI로 간편하게,
성공으로 확실하게

- -
-
- - -
- -
-
- - - - - - - diff --git a/TEMP_BACKUP/prototype/01-회원가입.html b/TEMP_BACKUP/prototype/01-회원가입.html deleted file mode 100644 index 04455e4..0000000 --- a/TEMP_BACKUP/prototype/01-회원가입.html +++ /dev/null @@ -1,347 +0,0 @@ - - - - - - - 회원가입 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - -
- -
-
-
- - - -
-

회원가입

-
-
-
- - -
-
-
-
🎉
-

KT 이벤트 마케팅

-

환영합니다

-
- -
- -
- - -
- - -
- - -
- - -
- - -
- - -
- -
- - -
- 최소 8자, 영문/숫자/특수문자 조합 -
- - -
- -
- - -
-
- - -
-
- - -
-
- - - -
- -
-

- 이미 계정이 있으신가요? 로그인 -

-
-
-
-
- - - - - - - - - diff --git a/TEMP_BACKUP/prototype/02-매장정보등록.html b/TEMP_BACKUP/prototype/02-매장정보등록.html deleted file mode 100644 index a6492c6..0000000 --- a/TEMP_BACKUP/prototype/02-매장정보등록.html +++ /dev/null @@ -1,770 +0,0 @@ - - - - - - - 매장정보 등록 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - - -
- -
-
-
- - - -
-

매장정보 등록

-
-
-
- - -
-
- -
-
-
1
- 회원가입 -
-
-
-
2
- 매장정보 -
-
- -
-
- -
-

필수 정보

-

정확한 정보를 입력하면 더 나은 이벤트를 만들 수 있어요

- - -
- - - 최대 50자까지 입력 가능합니다 -
- - -
- - -
- - -
- -
- - -
-
- - -
- - -
- - -
- - -
- 사업자번호 10자리를 입력하세요 -
-
-
- - -
-

선택 정보

-

더 자세한 정보를 입력하면 맞춤형 이벤트를 제공해드려요

- - -
- - - - 최대 10개까지 추가할 수 있습니다 -
- - -
- - -
- - -
- -
- - - -
- 매장 또는 상품 사진을 최대 3장까지 업로드할 수 있습니다 -
-
- - - -
-
-
-
-
- - - - - - - - - diff --git a/TEMP_BACKUP/prototype/03-홈화면.html b/TEMP_BACKUP/prototype/03-홈화면.html deleted file mode 100644 index 6264c16..0000000 --- a/TEMP_BACKUP/prototype/03-홈화면.html +++ /dev/null @@ -1,470 +0,0 @@ - - - - - - - 홈 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - -
- -
-
안녕하세요!
-
AI로 간편하게 이벤트를 만들어보세요
- - -
-
-
✨
-
새 이벤트
-
-
-
📋
-
이벤트 목록
-
-
-
📊
-
실시간 현황
-
-
-
⚙️
-
설정
-
-
-
- - -
-
- -
-
-
0
-
진행 중인
이벤트
-
-
-
0
-
총 참여자
-
-
-
0%
-
전환율
-
-
- - -
-
- 🤖 -

AI 인사이트

-
-
- 이벤트를 생성하시면 AI가 맞춤형 인사이트를 제공해드립니다. -
-
- - -
-

최근 이벤트

- - 전체보기 - - - - -
- - -
-
🎯
-

첫 이벤트를 만들어보세요!

-

- AI가 업종과 목적에 맞는
- 최적의 이벤트를 추천해드립니다 -

- -
- - - -
-
- - - -
- - - - - - - diff --git a/TEMP_BACKUP/prototype/04-이벤트목적선택.html b/TEMP_BACKUP/prototype/04-이벤트목적선택.html deleted file mode 100644 index 820c2a7..0000000 --- a/TEMP_BACKUP/prototype/04-이벤트목적선택.html +++ /dev/null @@ -1,516 +0,0 @@ - - - - - - - 이벤트 목적 선택 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - -
- -
-
-
- - - -
-

새 이벤트 만들기

-
-
-
- - -
-
- -
-
🎯
-

이벤트 목적을 선택하세요

-

- 목적에 맞는 최적의 이벤트를
- AI가 추천해드립니다 -

-
- - -
-
- 💡 - AI TIP -
-
- 선택하신 목적에 맞는 최신 트렌드와 성공 사례를 분석하여 맞춤형 이벤트를 제안해드립니다. -
-
- - -
- - - - - - - - - - - -
-
-
- - -
-
- -
-
- - - -
- - - - - - - diff --git a/TEMP_BACKUP/prototype/05-AI트렌드분석결과.html b/TEMP_BACKUP/prototype/05-AI트렌드분석결과.html deleted file mode 100644 index 199ef29..0000000 --- a/TEMP_BACKUP/prototype/05-AI트렌드분석결과.html +++ /dev/null @@ -1,680 +0,0 @@ - - - - - - - AI 트렌드 분석 결과 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - - -
- -
-
-
- - - -
-

AI 트렌드 분석

-
-
-
- - -
- -
-
🤖
-

AI가 트렌드를 분석하고 있어요

-

- 최신 데이터를 기반으로
- 업종별 성공 사례를 분석 중입니다 -

-
-
-
-
-
데이터 수집 중...
-
-
- - -
- -
-
✨
-

분석이 완료되었습니다!

-

신규 고객 유치를 위한 트렌드를 분석했어요

-
- - -

- 📊 - 핵심 인사이트 -

- -
-
-
- 평균 참여율 - 📈 -
-
42%
-
업계 평균 대비 +18%p 높은 수치
-
- -
-
- 최적 기간 - 📅 -
-
7일
-
참여율이 가장 높은 이벤트 기간
-
- -
-
- ROI - 💰 -
-
3.2배
-
평균 투자 대비 수익률
-
-
- - -

- 🔥 - 인기 이벤트 유형 TOP 3 -

- -
- -
- - -
-
- 🤖 -

AI 추천

-
-

- 현재 트렌드를 분석한 결과, "친구 초대 이벤트"가 가장 효과적입니다. SNS 공유를 통한 바이럴 효과가 뛰어나며, 신규 고객 유치율이 평균 3.2배 높습니다. -

-
- #신규고객유치 - #바이럴효과 - #SNS마케팅 -
-
-
-
- - - - - - -
- - - - - - - diff --git a/TEMP_BACKUP/prototype/06-AI이벤트상품추천.html b/TEMP_BACKUP/prototype/06-AI이벤트상품추천.html deleted file mode 100644 index ba9b84a..0000000 --- a/TEMP_BACKUP/prototype/06-AI이벤트상품추천.html +++ /dev/null @@ -1,602 +0,0 @@ - - - - - - - AI 이벤트 상품 추천 - KT 이벤트 마케팅 - - - - - - - - - - - - - - - - -
- -
-
-
- - - -
-

AI 상품 추천

-
-
-
- - -
-
- -
-
🎁
-

어떤 혜택을 제공하시겠어요?

-

- AI가 분석한 결과를 바탕으로
- 가장 효과적인 이벤트 상품을 추천해드립니다 -

-
- - -

- ✨ - AI 추천 혜택 -

-

트렌드 분석을 바탕으로 가장 효과적인 혜택을 선별했어요

- -
- - - - - - - - -
- - -
-

- ✏️ - 직접 입력하기 -

- - 원하는 혜택을 직접 입력할 수도 있어요 -
-
-
- - -
-
- -
-
- - - -
- - - - - - - diff --git a/TEMP_BACKUP/prototype/07-AI참여방법설계.html b/TEMP_BACKUP/prototype/07-AI참여방법설계.html deleted file mode 100644 index 759331e..0000000 --- a/TEMP_BACKUP/prototype/07-AI참여방법설계.html +++ /dev/null @@ -1,859 +0,0 @@ - - - - - - AI 참여 방법 설계 - KT AI 이벤트 플랫폼 - - - - -
- -

AI 참여 방법 설계

-

고객이 이벤트에 참여하는 방법을 선택해 주세요

-
- - -
- -
-
- 💡 -

AI 추천

-
-

- SNS 공유하기는 바이럴 효과가 뛰어나 신규 고객 유치에 가장 효과적입니다. - 평균 2.3배의 참여자 증가 효과가 있으며, 설정도 간단합니다. -

-
- - -
- -
-
🤖 AI 추천
-
- -
📱
-
-

SNS 공유하기

- 바이럴형 · 확산 효과 우수 -
-
-

- 고객이 이벤트를 SNS에 공유하면 참여 완료. 인스타그램, 페이스북 등 주요 SNS 플랫폼 지원 -

-
-
-
75%
-
참여율
-
-
-
2.3배
-
바이럴 계수
-
-
-
쉬움
-
난이도
-
-
-
-

주요 장점

-
    -
  • 자연스러운 바이럴 효과로 신규 고객 유입
    • -
  • 추가 비용 없이 홍보 효과 극대화
    • -
  • 간편한 참여로 높은 전환율
    • -
-
-
- - -
-
- -
📷
-
-

QR 코드 스캔

- 오프라인형 · 매장 방문 유도 -
-
-

- 매장 내 QR 코드를 스캔하여 참여. 포스터, 테이블 스티커 등 다양한 형태로 활용 가능 -

-
-
-
68%
-
참여율
-
-
-
1.2배
-
바이럴 계수
-
-
-
쉬움
-
난이도
-
-
-
-

주요 장점

-
    -
  • 오프라인 매장 방문 고객 타겟팅
    • -
  • 즉각적인 참여와 혜택 제공
    • -
  • 누구나 쉽게 참여 가능
    • -
-
-
- - -
-
- -
🎫
-
-

쿠폰 다운로드

- 즉시 혜택형 · 전환율 높음 -
-
-

- 간단한 정보 입력 후 쿠폰 다운로드. 모바일 쿠폰으로 즉시 사용 가능 -

-
-
-
82%
-
참여율
-
-
-
1.1배
-
바이럴 계수
-
-
-
쉬움
-
난이도
-
-
-
-

주요 장점

-
    -
  • 즉시 혜택으로 높은 전환율
    • -
  • 고객 정보 수집 용이
    • -
  • 재방문 유도 효과
    • -
-
-
- - -
-
- -
🏪
-
-

매장 방문 인증

- 오프라인형 · 방문 유도 -
-
-

- 매장 방문 시 스탬프나 인증 사진 업로드로 참여. 실제 방문 고객 확보에 효과적 -

-
-
-
58%
-
참여율
-
-
-
1.0배
-
바이럴 계수
-
-
-
보통
-
난이도
-
-
-
-

주요 장점

-
    -
  • 확실한 매장 방문 고객 확보
    • -
  • 직접적인 매출 증대 효과
    • -
  • 단골 고객 형성에 유리
    • -
-
-
- - -
-
- -
📝
-
-

설문 참여

- 데이터 수집형 · 인사이트 확보 -
-
-

- 간단한 설문 작성 후 참여 완료. 고객 니즈 파악과 맞춤형 마케팅에 활용 -

-
-
-
45%
-
참여율
-
-
-
0.8배
-
바이럴 계수
-
-
-
보통
-
난이도
-
-
-
-

주요 장점

-
    -
  • 고객 선호도 및 니즈 파악
    • -
  • 데이터 기반 의사결정 가능
    • -
  • 타겟 마케팅 최적화
    • -
-
-
- - -
-
- -
👥
-
-

친구 초대

- 추천형 · 신규 고객 확보 -
-
-

- 친구를 초대하고 함께 혜택 받기. 추천인과 피추천인 모두 혜택 제공 -

-
-
-
62%
-
참여율
-
-
-
3.5배
-
바이럴 계수
-
-
-
보통
-
난이도
-
-
-
-

주요 장점

-
    -
  • 검증된 신규 고객 확보
    • -
  • 강력한 추천 효과
    • -
  • Win-Win 혜택 구조
    • -
-
-
-
- - -
- - -

- 원하는 참여 방법을 직접 입력할 수 있어요 (최대 100자) -

-
- - - -
- - - - diff --git a/TEMP_BACKUP/prototype/08-AI홍보문구생성.html b/TEMP_BACKUP/prototype/08-AI홍보문구생성.html deleted file mode 100644 index b3c8447..0000000 --- a/TEMP_BACKUP/prototype/08-AI홍보문구생성.html +++ /dev/null @@ -1,931 +0,0 @@ - - - - - - AI 홍보 문구 생성 - KT 이벤트 마케팅 - - - -
- -
- -

AI 홍보 문구 생성

-

AI가 맞춤형 홍보 문구를 생성해 드려요

-
- - -
-
-
-
✨
-
-

AI가 홍보 문구를 생성하고 있어요

-

이벤트 정보를 분석하고 있어요...

-
-
-
-
-

0%

-
-
- - -
- -
-
- 💡 -

AI 추천

-
-

- 버전 1은 감성적인 톤으로 고객의 공감을 이끌어내기에 가장 적합합니다. - SNS 공유 시 참여율이 평균 35% 높게 나타났어요. -

-
- - -
- -
- - - -
-
- - -
-
-
-

홍보 문구 수정

- -
-
-
- - -
-
- - -
-
- - -
-
- - -
-
-
- - -
-
-
- - - - diff --git a/TEMP_BACKUP/prototype/09-AI이미지생성.html b/TEMP_BACKUP/prototype/09-AI이미지생성.html deleted file mode 100644 index 8bd7b6e..0000000 --- a/TEMP_BACKUP/prototype/09-AI이미지생성.html +++ /dev/null @@ -1,743 +0,0 @@ - - - - - - AI 이미지 생성 - KT 이벤트 마케팅 - - - - - -
- -
- -

AI 이미지 생성

-

이벤트에 활용할 이미지를 AI로 생성해 보세요

-
- - -
- -
- - -

- 생성하고 싶은 이미지를 자세히 설명해 주세요 (최대 500자) -

- - -
-
- 🌟 모던 -
-
- ☀️ 따뜻한 -
-
- 🎨 생동감 -
-
- ✨ 미니멀 -
-
- - -
- - -
-
-
-
🎨
-
-

- AI가 이미지를 생성하고 있어요... -

-
- - -
-
-

생성된 이미지

- -
- - -
- -
- - - -
-
-
- - - - - diff --git a/TEMP_BACKUP/prototype/10-이벤트기획안승인.html b/TEMP_BACKUP/prototype/10-이벤트기획안승인.html deleted file mode 100644 index 601c029..0000000 --- a/TEMP_BACKUP/prototype/10-이벤트기획안승인.html +++ /dev/null @@ -1,719 +0,0 @@ - - - - - - 이벤트 기획안 승인 - KT 이벤트 마케팅 - - - - - -
- -
- -
✨ AI 기획 완료
-

이벤트 기획안 승인

-

AI가 생성한 이벤트 기획안을 확인하고 승인해 주세요

-
- - -
- -
-
🎉
-

완벽한 이벤트 기획안이 완성되었어요!

-

- AI가 분석한 데이터를 바탕으로 최적의 이벤트를 설계했습니다. - 아래 내용을 확인하고 승인하시면 다음 단계로 진행됩니다. -

-
- - -
-
- 🤖 -

AI 예상 성과

-
-
-
-
1,200명
-
예상 참여자
-
-
-
75%
-
참여율
-
-
-
3.5배
-
ROI
-
-
-
- - -
-
📱 이벤트 미리보기
-
-

- 🎉 친구 초대하고 함께 받는 특별한 혜택! -

-

- 맛있는 순간을 소중한 사람과 함께하세요. 친구를 초대하면 둘 다 특별한 선물을 드려요. - 지금 바로 참여하고 행복을 나누세요! -

-
- #친구초대이벤트 - #함께할인 - #소상공인응원 -
-
-
- - -
- -
-
-

- 🎯 - 이벤트 목적 -

- -
-
-
-
선택한 목적
-
신규 고객 유치
-
-
-
- - -
-
-

- 📊 - 트렌드 분석 -

- -
-
-
-
Top 트렌드
-
친구 초대 이벤트
-
-
-
예상 참여율
-
68%
-
-
-
- - -
-
-

- 🎁 - 이벤트 경품 -

- -
-
-
-
선택한 경품
-
- 추천형 - 친구 초대 특전 -
-
-
-
- - -
-
-

- 📱 - 참여 방법 -

- -
-
-
-
선택한 방법
-
- 바이럴형 - SNS 공유하기 -
-
-
-
- - -
-
-

- ✍️ - 홍보 문구 -

- -
-
-
-
헤드라인
-
- 🎉 친구 초대하고 함께 받는 특별한 혜택! -
-
-
-
CTA
-
- 지금 친구 초대하고 혜택 받기 -
-
-
-
-
- - -
- - -
-
-
- - - - - diff --git a/TEMP_BACKUP/prototype/11-AI영상제작.html b/TEMP_BACKUP/prototype/11-AI영상제작.html deleted file mode 100644 index ab54082..0000000 --- a/TEMP_BACKUP/prototype/11-AI영상제작.html +++ /dev/null @@ -1,506 +0,0 @@ - - - - - - AI 영상 제작 - KT 이벤트 마케팅 - - - -
- -
- -

AI 영상 제작

-

이벤트 홍보 영상을 자동으로 제작해 드려요

-
- - -
- -
-

- 💡 선택사항 -

-

- 영상 제작은 선택사항입니다. 영상이 필요하지 않으시면 "건너뛰기"를 선택하세요. -

-
- - -
-
-
-
🎬
-

15초 숏폼 영상

-
-

- 인스타그램 릴스, 유튜브 쇼츠에 최적화된 세로형 15초 영상을 제작합니다. - 빠르고 강렬한 메시지 전달에 효과적입니다. -

-
- -
-
-
📹
-

30초 프로모션 영상

-
-

- 이벤트의 모든 내용을 담은 30초 가로형 영상을 제작합니다. - 페이스북, 유튜브 등 다양한 플랫폼에 활용할 수 있습니다. -

-
- -
-
-
🎯
-

두 가지 모두 제작

-
-

- 15초 숏폼과 30초 프로모션 영상을 모두 제작합니다. - 모든 플랫폼에 최적화된 홍보가 가능합니다. -

-
-
- - - - - -
-
- - - - diff --git a/TEMP_BACKUP/prototype/12-SNS콘텐츠생성.html b/TEMP_BACKUP/prototype/12-SNS콘텐츠생성.html deleted file mode 100644 index 03d989c..0000000 --- a/TEMP_BACKUP/prototype/12-SNS콘텐츠생성.html +++ /dev/null @@ -1,758 +0,0 @@ - - - - - - SNS 콘텐츠 생성 - KT 이벤트 마케팅 - - - -
- -
- -

SNS 콘텐츠 생성

-

각 SNS 플랫폼에 최적화된 콘텐츠를 생성해 드려요

-
- - -
- -
-
- 💡 -

AI 추천

-
-

- 인스타그램과 페이스북에서 가장 높은 참여율이 예상됩니다. - 두 플랫폼을 선택하시면 최대 효과를 얻으실 수 있어요. -

-
- - - - - -
- -
- - - -
-
- - - - diff --git a/TEMP_BACKUP/prototype/13-QR포스터생성.html b/TEMP_BACKUP/prototype/13-QR포스터생성.html deleted file mode 100644 index 6c7a6d9..0000000 --- a/TEMP_BACKUP/prototype/13-QR포스터생성.html +++ /dev/null @@ -1,805 +0,0 @@ - - - - - - QR 포스터 생성 - KT 이벤트 마케팅 - - - -
- -
- -

QR 포스터 생성

-

이벤트 QR 코드와 포스터를 자동으로 생성해 드려요

-
- - -
- -
-
🎨
-
AI가 QR 포스터를 생성하고 있습니다...
-
-
-
-
-
0%
-
-
- - -
- -
-

- ✨ QR 포스터 완성 -

-

- 이벤트 참여를 위한 QR 코드와 홍보 포스터가 생성되었습니다. - 원하시는 템플릿을 선택하고 커스터마이징하세요. -

-
- - -
-

포스터 템플릿 선택

-
-
-
-
🎯
-

모던 스타일

-
-

- 깔끔하고 현대적인 디자인으로 모든 연령층에게 어필할 수 있는 템플릿입니다. -

-
-
📱
-
모던 스타일 포스터
-
-
- -
-
-
🌈
-

컬러풀 스타일

-
-

- 화려한 색상과 역동적인 디자인으로 시선을 사로잡는 템플릿입니다. -

-
-
🎨
-
컬러풀 스타일 포스터
-
-
- -
-
-
⚪
-

미니멀 스타일

-
-

- 단순하고 세련된 디자인으로 전문적인 느낌을 전달하는 템플릿입니다. -

-
-
◻️
-
미니멀 스타일 포스터
-
-
- -
-
-
⭐
-

프리미엄 스타일

-
-

- 고급스러운 디자인으로 특별한 이벤트를 더욱 돋보이게 하는 템플릿입니다. -

-
-
💎
-
프리미엄 스타일 포스터
-
-
-
-
- - -
-

포스터 커스터마이징

- -
- -
- - - -
-
- -
- - -
- -
- - -
-
- - - -
-
-
- - - - diff --git a/TEMP_BACKUP/prototype/14-QR포스터생성선택.html b/TEMP_BACKUP/prototype/14-QR포스터생성선택.html deleted file mode 100644 index 82e2b12..0000000 --- a/TEMP_BACKUP/prototype/14-QR포스터생성선택.html +++ /dev/null @@ -1,561 +0,0 @@ - - - - - - QR 포스터 템플릿 선택 - KT 이벤트 마케팅 - - - - - -
- -
- -

QR 포스터 생성

-

오프라인 홍보용 QR 포스터를 만들어 보세요

-
- - -
- -
-

- 📐 포스터 크기 선택 -

-
-
-
A4
-
210×297mm
-
-
-
A3
-
297×420mm
-
-
-
A2
-
420×594mm
-
-
-
B4
-
257×364mm
-
-
-
B3
-
364×515mm
-
-
-
사용자정의
-
직접 입력
-
-
-
- - -
- -
-
🤖 AI 추천
- -
-
-

🎉 친구 초대 이벤트

-

함께하면 더 큰 혜택!

-
-
📱
-
-

QR 코드를 스캔하고 참여하세요!

-
-
-
-

클래식 템플릿

-

- 깔끔하고 전통적인 레이아웃. 모든 업종에 잘 어울리는 기본 템플릿입니다. -

-
- 심플 - 범용 - 가독성 높음 -
-
-
- - -
- -
-
-

🎉 친구 초대 이벤트

-

함께하면 더 큰 혜택!

-
-
📱
-
-

QR 코드를 스캔하고 참여하세요!

-
-
-
-

모던 템플릿

-

- 그라데이션 배경과 세련된 타이포그래피로 젊은 층에게 어필합니다. -

-
- 트렌디 - 그라데이션 - 젊은 층 -
-
-
- - -
- -
-
-

친구 초대 이벤트

-

함께하면 더 큰 혜택

-
-
📱
-
-

스캔하고 참여하세요

-
-
-
-

미니멀 템플릿

-

- 여백을 활용한 미니멀한 디자인. 고급스러운 브랜드 이미지에 적합합니다. -

-
- 미니멀 - 고급 - 여백 활용 -
-
-
- - -
- -
-
-

🎉 친구 초대 이벤트

-

함께하면 더 큰 혜택!

-
-
📱
-
-

QR 코드를 스캔하고 참여하세요!

-
-
-
-

생동감 템플릿

-

- 화사한 컬러와 역동적인 레이아웃으로 시선을 사로잡습니다. -

-
- 생동감 - 눈에 띄는 - 이벤트용 -
-
-
-
- - - -
-
- - - - - diff --git a/TEMP_BACKUP/prototype/15-QR포스터상세설정.html b/TEMP_BACKUP/prototype/15-QR포스터상세설정.html deleted file mode 100644 index 308c2bc..0000000 --- a/TEMP_BACKUP/prototype/15-QR포스터상세설정.html +++ /dev/null @@ -1,628 +0,0 @@ - - - - - - QR 포스터 상세 설정 - KT 이벤트 마케팅 - - - - - -
- -
- -

QR 포스터 상세 설정

-

포스터 내용을 상세하게 편집하세요

-
- - -
- -
- -
-

- ✍️ 텍스트 내용 -

-
- - -

포스터 상단에 표시될 제목입니다

-
-
- - -
-
- - -
-
- - -

QR 코드로 연결될 URL을 입력하세요

-
-
- - -
-

- 🎨 디자인 설정 -

-
- -
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
- - -

160px

-
-
- - -
-

- ℹ️ 추가 정보 -

-
- - -
-
- - -
-
- - -
-
- - -
- - -
-
- - -
-

📱 실시간 미리보기

-
-
-

🎉 친구 초대 이벤트

-

함께하면 더 큰 혜택!

-
-
📱
-
-

QR 코드를 스캔하고 지금 바로 참여하세요!

-

-
-
-
-
-
- - - - - diff --git a/TEMP_BACKUP/prototype/16-콘텐츠편집.html b/TEMP_BACKUP/prototype/16-콘텐츠편집.html deleted file mode 100644 index be0d131..0000000 --- a/TEMP_BACKUP/prototype/16-콘텐츠편집.html +++ /dev/null @@ -1,699 +0,0 @@ - - - - - - 콘텐츠 편집 - KT 이벤트 마케팅 - - - -
- -
- -

콘텐츠 편집

-

생성된 콘텐츠를 검토하고 수정하세요

-
- - -
- -
-

- ✏️ 편집 가이드 -

-

- AI가 생성한 콘텐츠를 자유롭게 수정할 수 있습니다. - 각 섹션의 "재생성" 버튼을 클릭하면 새로운 콘텐츠를 생성할 수 있습니다. -

-
- - -
-
-

- 📝 - 홍보 문구 -

- -
- - -
- 0 / 500자 -
-
- - -
-
-

- 🖼️ - 이미지 -

- -
-
-
🎨
-
🎁
-
✨
-
🎉
-
-

- 각 이미지를 클릭하면 새로운 이미지로 교체할 수 있습니다. -

-
- - -
-
-

- 📱 - QR 포스터 -

- -
-
-
📋
-
QR 포스터 미리보기
-
- - - - -
- - -
- - -
-
-
- - - - diff --git a/TEMP_BACKUP/prototype/17-콘텐츠최종승인.html b/TEMP_BACKUP/prototype/17-콘텐츠최종승인.html deleted file mode 100644 index b14ee7d..0000000 --- a/TEMP_BACKUP/prototype/17-콘텐츠최종승인.html +++ /dev/null @@ -1,733 +0,0 @@ - - - - - - 콘텐츠 최종 승인 - KT 이벤트 마케팅 - - - -
- -
- -
✨ AI 콘텐츠 생성 완료
-

콘텐츠 최종 승인

-

생성된 모든 콘텐츠를 확인하고 승인해 주세요

-
- - -
- -
-
🎉
-

완벽한 이벤트 콘텐츠가 준비되었어요!

-

- AI가 생성한 고품질 콘텐츠로 이벤트를 홍보할 준비가 완료되었습니다. - 아래 내용을 최종 확인하고 승인하시면 바로 배포 단계로 이동합니다. -

-
- - -
-
-
4개
-
생성된 이미지
-
-
-
2개
-
SNS 콘텐츠
-
-
-
1개
-
QR 포스터
-
-
- - -
- -
-
-
- 🎨 AI 생성 이미지 - 4개 -
- -
-
-
-
🎉
-
🎊
-
🎈
-
🎁
-
-
-
- - -
-
-
- 📱 SNS 콘텐츠 - 2개 -
- -
-
-
-
-
📷
-
-
인스타그램
-
🎉 친구 초대하고 함께 받는 특별한 혜택!
-
-
생성완료
-
-
-
👥
-
-
페이스북
-
🎉 친구 초대 이벤트 진행 중!
-
-
생성완료
-
-
-
-
- - -
-
-
- 📄 QR 포스터 - 1개 -
- -
-
-
-

🎉 친구 초대 이벤트

-
📱
-

QR 코드를 스캔하고 참여하세요!

-
-
-
-
- - -
- - -
-
-
- - - - diff --git a/TEMP_BACKUP/prototype/18-배포채널선택.html b/TEMP_BACKUP/prototype/18-배포채널선택.html deleted file mode 100644 index 2371b46..0000000 --- a/TEMP_BACKUP/prototype/18-배포채널선택.html +++ /dev/null @@ -1,1279 +0,0 @@ - - - - - - 배포 채널 선택 - KT AI 이벤트 - - - - -
- -

배포 채널 선택

-
-
- - -
- -
-
배포 1/3: 채널 선택
-
-
-
-
- - -
-
선택된 채널
-
- 0개 채널 -
-
- - -
-

KT 채널

-
-
-
-
-
-
- 우리동네TV - 추천 -
-
지역 주변 노출
-
-
-
- -
-
- -
-
-
-
-
링고비즈 연결음
-
매장 전화 연결음
-
-
-
- -
-
- -
-
-
-
-
지니TV 광고
-
TV 광고 송출
-
-
-
- -
-
-
-
- - -
-

SNS 채널

-
-
-
-
-
-
- Instagram - 필수 -
-
인스타그램 게시물
-
✓ 계정 연동됨
-
-
-
- -
-
-
-
-
Naver Blog
-
네이버 블로그
-
계정 연동 필요
-
-
-
- -
-
- -
-
-
-
-
Kakao Channel
-
카카오톡 채널
-
계정 연동 필요
-
-
-
- -
-
-
-
- - -
-

배포 시간

- -
-
-
-
즉시 배포
-
지금 바로 선택한 채널에 배포
-
-
- -
-
-
-
예약 배포
-
원하는 날짜와 시간에 배포
- -
-
-
- - -
-
- - -
-
-
-
-
-
-
- - -
- - -
- - -
-
-
-
-

채널 설정

- -
- -
- -
-
- - - - - diff --git a/TEMP_BACKUP/prototype/19-배포진행상태.html b/TEMP_BACKUP/prototype/19-배포진행상태.html deleted file mode 100644 index 3dee0d7..0000000 --- a/TEMP_BACKUP/prototype/19-배포진행상태.html +++ /dev/null @@ -1,1144 +0,0 @@ - - - - - - 배포 진행 상태 - KT AI 이벤트 - - - - -
- -

배포 진행 중

-
-
- - -
- -
-
배포 2/3: 진행 상태
-
-
-
-
- - -
- -
-
🚀
-

배포 진행 중

-

선택한 채널에 콘텐츠를 배포하고 있어요

-
- - -
-
전체 진행률
-
-
-
-
- 0% - 예상 소요: 1분 남음 -
-
- - -
- -
- - -
- - -
-
- - -
-
✅
-

배포 완료!

-

모든 채널에 성공적으로 배포되었습니다

- -
-
-
0
-
성공
-
-
-
0
-
실패
-
-
-
0초
-
소요시간
-
-
-
-
-
예약시간
-
-
-
-
- - -
- -
- - - - - diff --git a/TEMP_BACKUP/prototype/20-오프라인자료다운로드.html b/TEMP_BACKUP/prototype/20-오프라인자료다운로드.html deleted file mode 100644 index c5fd5e0..0000000 --- a/TEMP_BACKUP/prototype/20-오프라인자료다운로드.html +++ /dev/null @@ -1,1026 +0,0 @@ - - - - - - 오프라인 자료 다운로드 - KT AI 이벤트 - - - - -
- -

오프라인 자료

-
-
- - -
- -
-
배포 3/3: 자료 다운로드
-
-
-
-
- - -
-
✅
-
배포 완료!
-
오프라인 홍보 자료를 다운로드하세요
-
- - -
-
📦
-
전체 다운로드
-
모든 오프라인 자료를 ZIP 파일로 한번에 다운로드
- -
- - -
-

오프라인 홍보 자료

-

매장에서 사용할 수 있는 인쇄용 자료

-
- - -
-
-
-
📄
-
-
QR 포스터 (A4)
-
2.1 MB PDF
-
일반 프린터로 출력 가능한 A4 크기
-
-
-
- - -
-
- -
-
-
📄
-
-
QR 포스터 (A3)
-
4.5 MB PDF
-
대형 포스터용 A3 크기
-
-
-
- - -
-
- -
-
-
📷
-
-
QR 코드 이미지
-
150 KB PNG
-
이벤트 참여 QR 코드 단독 이미지
-
-
-
- - -
-
- -
-
-
🖼️
-
-
고해상도 이미지
-
5.2 MB (300dpi)
-
인쇄용 고해상도 이벤트 이미지
-
-
-
- - -
-
- -
-
-
📋
-
-
명함 크기 쿠폰
-
800 KB PDF
-
재단선 포함, 10장/페이지
-
-
-
- - -
-
- -
-
-
🎫
-
-
탁상 텐트 카드
-
1.2 MB PDF
-
테이블에 올려놓는 접이식 카드
-
-
-
- - -
-
-
- - -
-
-

다운로드 이력

-
-
-
- 아직 다운로드한 파일이 없습니다 -
-
-
-
- - -
- - -
- - -
-
-
-

미리보기

- -
-
- 📄 -
-
- 실제 서비스에서는 PDF/이미지 미리보기가 표시됩니다 -
-
-
- - - - - diff --git a/TEMP_BACKUP/prototype/21-이벤트참여.html b/TEMP_BACKUP/prototype/21-이벤트참여.html deleted file mode 100644 index a66562a..0000000 --- a/TEMP_BACKUP/prototype/21-이벤트참여.html +++ /dev/null @@ -1,993 +0,0 @@ - - - - - - 이벤트 참여 - KT AI 이벤트 - - - - -
- -
-
🎉
-
수원 왕갈비통닭
-
연말 대박 이벤트!
-
- - -
-
-
🎁
-
-
경품
-
치킨세트 무료교환권
-
-
-
-
👥
-
-
당첨 인원
-
100명
-
-
-
-
📅
-
-
참여 기간
-
~ 2025-12-31
-
-
-
- - -
-
참여 방법
- -
- - -
-

참여 신청

- -
- -
- - -
이름을 입력해주세요
-
- - -
- - -
올바른 전화번호를 입력해주세요
-
- - -
-
참여 경로 (자동 감지)
-
- 📍 - QR 코드 스캔 -
-
- - -
- -
-
-
- - -
-
💡
-
- 매장 방문 고객은 당첨 확률 UP! 🎁 -
-
- - - -
- - - - - diff --git a/TEMP_BACKUP/prototype/22-참여완료.html b/TEMP_BACKUP/prototype/22-참여완료.html deleted file mode 100644 index 48dee83..0000000 --- a/TEMP_BACKUP/prototype/22-참여완료.html +++ /dev/null @@ -1,905 +0,0 @@ - - - - - - 참여 완료 - KT AI 이벤트 - - - - -
- - -
- -
-
✅
-

참여 완료!

-

이벤트 참여가 완료되었습니다

-
- - -
-
응모번호
-
A-12345678
- -
- - -
-
-
📅
-
-
당첨 발표일
-
2025-12-31
-
-
-
-
📱
-
-
당첨자 통보 방법
-
SMS / 알림톡
-
-
-
- - -
-
- 💡 안내사항 -
-
- 당첨 시 입력하신 전화번호로 SMS/알림톡이 발송됩니다.
- 응모번호는 당첨 확인 시 필요하니 꼭 기억해주세요! -
-
- - -
-
매장 정보
- -
-
🏪
-
수원 왕갈비통닭
-
- -
-
📍
-
- 경기도 수원시 팔달구 xxx-xxx -
-
- -
-
☎️
-
031-XXX-XXXX
-
- - -
- - -
- - - -
-
- - - - - diff --git a/TEMP_BACKUP/prototype/23-당첨자명단관리.html b/TEMP_BACKUP/prototype/23-당첨자명단관리.html deleted file mode 100644 index 550f303..0000000 --- a/TEMP_BACKUP/prototype/23-당첨자명단관리.html +++ /dev/null @@ -1,1098 +0,0 @@ - - - - - - 당첨자 명단 관리 - KT AI 이벤트 플랫폼 - - - - -
- -

당첨자 명단 관리

- -
- - -
-
- -
-
-
-

신규 회원 가입 이벤트

-

2025.01.01 - 2025.01.31

-
- 진행중 -
-
-
-
전체 참여자
-
0
-
-
-
당첨자
-
0
-
-
-
경품 지급
-
0
-
-
-
- - -
- 🔍 - - -
- - -
- - - -
- - -
- -
- - - -
-
- - -
- - -
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/24-실시간대시보드.html b/TEMP_BACKUP/prototype/24-실시간대시보드.html deleted file mode 100644 index 93ef7ed..0000000 --- a/TEMP_BACKUP/prototype/24-실시간대시보드.html +++ /dev/null @@ -1,939 +0,0 @@ - - - - - - 실시간 대시보드 - KT AI 이벤트 플랫폼 - - - - -
- -

실시간 대시보드

-
- -
-
- - -
-
- -
- - - - -
- - -
-
-
- 👥 - 총 참여자 -
-
0
-
+0%
-
- -
-
- 🎁 - 당첨자 -
-
0
-
+0%
-
- -
-
- 📊 - 전환율 -
-
0%
-
+0%
-
- -
-
- 📈 - 조회수 -
-
0
-
+0%
-
-
- - -
-
-

채널별 성과

- - 상세보기 → - -
-
- -
-
- - -
-
-

최근 활동

-
-
- -
-
- - -
- - 🎯 - 당첨자 관리 - - - 📊 - 성과 분석 - - - 💰 - ROI 분석 - - - 📄 - 리포트 - -
-
-
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/25-채널별성과분석.html b/TEMP_BACKUP/prototype/25-채널별성과분석.html deleted file mode 100644 index 91c6291..0000000 --- a/TEMP_BACKUP/prototype/25-채널별성과분석.html +++ /dev/null @@ -1,837 +0,0 @@ - - - - - - 채널별 성과 분석 - KT AI 이벤트 플랫폼 - - - - -
- -

채널별 성과 분석

- -
- - -
-
- -
- - - - -
- - -
-
-
총 참여자
-
0
-
-
-
평균 전환율
-
0%
-
-
-
활성 채널
-
0
-
-
- - -
- -
- - -
-

채널 비교

- - - - - - - - - - - - -
채널참여자전환율순위
-
-
-
- - -
- -
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/26-ROI분석.html b/TEMP_BACKUP/prototype/26-ROI분석.html deleted file mode 100644 index 183e0c4..0000000 --- a/TEMP_BACKUP/prototype/26-ROI분석.html +++ /dev/null @@ -1,883 +0,0 @@ - - - - - - ROI 분석 - KT AI 이벤트 플랫폼 - - - - -
- -

ROI 분석

- -
- - -
-
- -
-
투자 대비 수익률 (ROI)
-
0%
-
- 이벤트 비용 대비 0배의 수익을 창출했습니다. - 지난 달 대비 +0% 향상되었습니다. -
-
- - -
-
-
- 💰 - 총 수익 -
-
0원
-
예상 매출 증가분
-
- -
-
- 💸 - 총 비용 -
-
0원
-
이벤트 운영 비용
-
- -
-
- 📈 - 순이익 -
-
0원
-
수익 - 비용
-
- -
-
- 🎯 - 손익분기 -
-
달성
-
참여자 기준
-
-
- - -
-
-

비용 상세

-
0원
-
-
- -
-
- - -
-
-

수익 상세

-
0원
-
-
- -
-
- - -
-

인사이트

-
- -
-
-
-
- - -
- -
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/27-분석리포트.html b/TEMP_BACKUP/prototype/27-분석리포트.html deleted file mode 100644 index 4877710..0000000 --- a/TEMP_BACKUP/prototype/27-분석리포트.html +++ /dev/null @@ -1,910 +0,0 @@ - - - - - - 분석 리포트 - KT AI 이벤트 플랫폼 - - - - -
- -

분석 리포트

-
- - -
-
- - -
-
- -
-

신규 회원 가입 이벤트

-

분석 기간: 2025.01.01 - 2025.01.31

-
-
-
보고서 생성일
-
2025.02.01
-
-
-
작성자
-
매장명
-
-
-
버전
-
v1.0
-
-
-
- - -
-

📊 요약

-

- 본 이벤트는 신규 회원 유치를 목적으로 총 30일간 진행되었으며, - 다양한 채널을 통해 1,247명의 참여자를 확보했습니다. - 투자 대비 354.2%의 ROI를 달성하여 목표치를 크게 상회했으며, - 특히 Instagram 채널에서 가장 우수한 성과를 기록했습니다. -

-
-
- ✅ - 목표 대비 124% 달성 (목표: 1,000명, 실제: 1,247명) -
-
- 💰 - ROI 354.2% 달성 (투자 330만원, 수익 1,500만원) -
-
- 📈 - 평균 전환율 12.5% (업계 평균 8.3% 대비 우수) -
-
-
- - -
-

📈 핵심 지표

-
-
-
총 참여자
-
1,247
-
+24%
-
-
-
당첨자
-
156
-
+18%
-
-
-
전환율
-
12.5%
-
+3.2%
-
-
-
조회수
-
5,432
-
+32%
-
-
-
- - -
-

📱 채널별 성과

-
-

- 총 4개 채널을 통해 이벤트를 진행했으며, Instagram이 가장 높은 참여율을 기록했습니다. -

- - - - - - - - - - - - -
채널참여자전환율비율
-
-
- - -
-

💰 ROI 분석

-
-

- 총 투자 비용 330만원 대비 1,500만원의 수익을 창출하여 354.2%의 ROI를 달성했습니다. -

- - - - - - - - - - - - - - - - - - - - - - - - - -
항목금액비율
총 수익15,000,000원100%
총 비용3,300,000원22%
순이익11,700,000원78%
-
-
- - -
-

💡 개선 제안

-
-
-
📱
-
-
Instagram 채널 집중 투자
-
- Instagram이 가장 높은 참여율(36.5%)을 기록했습니다. - 향후 이벤트에서 이 채널에 더 많은 리소스를 배분하면 더 나은 성과를 기대할 수 있습니다. -
-
-
- -
-
🎯
-
-
KakaoTalk 채널 개선 필요
-
- KakaoTalk 채널의 전환율이 상대적으로 낮습니다(12.8%). - 콘텐츠 개선 및 타겟팅 전략 재검토가 필요합니다. -
-
-
- -
-
💰
-
-
경품 비용 최적화
-
- 경품 비용이 전체 비용의 45.5%를 차지합니다. - 경품 구성을 다양화하고 가성비를 높여 ROI를 더 개선할 수 있습니다. -
-
-
-
-
- - -
-

📝 결론

-
-

- 본 이벤트는 모든 핵심 지표에서 목표를 초과 달성하며 성공적으로 종료되었습니다. - 특히 Instagram 채널의 우수한 성과와 높은 ROI는 향후 마케팅 전략 수립에 - 중요한 참고 자료가 될 것입니다. -

-

- 다만, 채널별 성과 편차가 크게 나타났으므로, 차기 이벤트에서는 - 저성과 채널에 대한 개선 전략을 수립하고 고성과 채널에 대한 투자를 - 확대할 것을 권장합니다. -

-
-
-
-
- - -
- - -
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/28-이벤트목록.html b/TEMP_BACKUP/prototype/28-이벤트목록.html deleted file mode 100644 index ae2c745..0000000 --- a/TEMP_BACKUP/prototype/28-이벤트목록.html +++ /dev/null @@ -1,846 +0,0 @@ - - - - - - 이벤트 목록 - KT AI 이벤트 플랫폼 - - - - -
- -

이벤트 목록

- -
- - -
-
- -
- 🔍 - -
- - -
- - - - -
- - -
- -
- - - -
-
- - - - - -
- - - - diff --git a/TEMP_BACKUP/prototype/29-마이페이지.html b/TEMP_BACKUP/prototype/29-마이페이지.html deleted file mode 100644 index 7244726..0000000 --- a/TEMP_BACKUP/prototype/29-마이페이지.html +++ /dev/null @@ -1,727 +0,0 @@ - - - - - - 마이페이지 - KT AI 이벤트 플랫폼 - - - - -
- -

마이페이지

- -
- - -
-
- -
-
-
사
-
-
사장님
- -
-
-
-
-
0
-
총 이벤트
-
-
-
0
-
총 참여자
-
-
-
0%
-
평균 ROI
-
-
-
- - -
-

매장 정보

-
-
상호명
-
-
-
-
-
업종
-
-
-
-
-
주소
-
-
-
-
-
전화번호
-
-
-
-
- - -
-

계정

- - - -
- - -
-

설정

- - -
- - -
-

고객 지원

- - - -
- - -
-

약관 및 정책

- - -
- - -
-
-
- 🚪 - 로그아웃 -
-
-
- - -
- KT AI 이벤트 플랫폼 v1.0.0
- © 2025 KT Corporation. All rights reserved. -
-
-
- - -
- - - - diff --git a/TEMP_BACKUP/prototype/CHECKLIST.md b/TEMP_BACKUP/prototype/CHECKLIST.md deleted file mode 100644 index 76c5213..0000000 --- a/TEMP_BACKUP/prototype/CHECKLIST.md +++ /dev/null @@ -1,413 +0,0 @@ -# 프로토타입 작성원칙 체크리스트 - -작성일: 2025-01-20 -버전: 1.0 -검토자: UI/UX Designer (박민지 "픽셀") - ---- - -## 1. 디자인 원칙 준수 - -### 1.1 Mobile First ✅ -- [x] 모든 화면이 320px 이상에서 정상 작동 -- [x] 모바일 기본 스타일 우선 작성 -- [x] Tablet(768px+), Desktop(1024px+) 반응형 지원 -- [x] Touch 타겟 최소 44x44px 보장 - -### 1.2 브랜드 아이덴티티 ✅ -- [x] KT Red (#E31E24) Primary Color 사용 -- [x] AI Blue (#0066FF) Secondary Color 사용 -- [x] Pretendard 폰트 적용 -- [x] Material Icons 사용 - -### 1.3 일관성 ✅ -- [x] 공통 컴포넌트 재사용 (common.css, common.js) -- [x] 동일한 패턴 유지 (header, card, button) -- [x] 통일된 네비게이션 (Bottom Nav) - ---- - -## 2. 색상 시스템 - -### 2.1 색상 변수 사용 ✅ -- [x] CSS Variables 정의 및 사용 -- [x] Primary: --color-primary-main (#E31E24) -- [x] Secondary: --color-secondary-main (#0066FF) -- [x] Semantic Colors 적용 (success, warning, error, info) - -### 2.2 색상 대비 (WCAG 2.1 AA) ✅ -- [x] 텍스트 대비율 4.5:1 이상 -- [x] Black on White: 14.2:1 -- [x] Gray-700 on White: 8.5:1 -- [x] Primary Red on White: 7.2:1 -- [x] AI Blue on White: 7.8:1 - -### 2.3 Semantic Colors ✅ -- [x] Success: #00C853 (완료, 승인) -- [x] Warning: #FFA000 (경고, 대기) -- [x] Error: #D32F2F (오류, 삭제) -- [x] Info: #0288D1 (안내, 정보) - ---- - -## 3. 타이포그래피 - -### 3.1 폰트 적용 ✅ -- [x] Pretendard 폰트 CDN 로드 -- [x] Fallback 폰트 지정 - -### 3.2 Type Scale ✅ -- [x] Display: 28px (메인 타이틀) -- [x] H1: 24px (화면 제목) -- [x] H2: 20px (섹션 제목) -- [x] H3: 18px (카드 제목) -- [x] Body-L: 16px (입력 필드, 중요 본문) -- [x] Body-M: 14px (일반 본문) -- [x] Body-S: 12px (캡션, 보조 정보) - -### 3.3 Font Weights ✅ -- [x] Regular (400): 일반 본문 -- [x] Medium (500): 강조 본문 -- [x] SemiBold (600): 버튼, 중요 정보 -- [x] Bold (700): 제목, 헤딩 - ---- - -## 4. 간격 시스템 - -### 4.1 4px Grid System ✅ -- [x] 모든 간격이 4의 배수 -- [x] XS (4px), S (8px), M (16px), L (24px), XL (32px), 2XL (48px) - -### 4.2 컴포넌트별 간격 ✅ -- [x] Card 내부 패딩: 24px (L) -- [x] Card 간 간격: 16px (M) -- [x] Section 간 간격: 32px (XL) -- [x] Screen 마진: 20px (Mobile) - ---- - -## 5. 컴포넌트 스타일 - -### 5.1 Button ✅ -- [x] Primary Button: 배경 #E31E24, 텍스트 White -- [x] Secondary Button: 테두리 #E31E24, 텍스트 Red -- [x] Text Button: 텍스트만 표시 -- [x] 크기: Large (48px), Medium (44px), Small (36px) -- [x] 둥근 모서리: 8px -- [x] Disabled 상태 스타일 - -### 5.2 Card ✅ -- [x] 배경: White -- [x] 테두리: 1px solid #E0E0E0 -- [x] 둥근 모서리: 12px -- [x] 그림자: 0 2px 8px rgba(0,0,0,0.08) -- [x] 내부 패딩: 24px - -### 5.3 Input Field ✅ -- [x] 높이: 48px -- [x] 둥근 모서리: 8px -- [x] Focus 상태: 테두리 2px #0066FF -- [x] Error 상태: 테두리 2px #D32F2F -- [x] Placeholder: #9E9E9E - -### 5.4 Bottom Navigation ✅ -- [x] 높이: 60px -- [x] 4개 아이템 (홈, 이벤트, 분석, MY) -- [x] Active 상태: #E31E24 -- [x] Inactive 상태: #9E9E9E -- [x] 그림자: 0 -2px 8px rgba(0,0,0,0.08) - -### 5.5 Header ✅ -- [x] 높이: 56px -- [x] 뒤로가기 버튼 (좌측) -- [x] 제목 (중앙) -- [x] 액션 버튼 (우측, 선택적) - -### 5.6 Progress Bar ✅ -- [x] 높이: 48px -- [x] 배경: #F5F5F5 -- [x] 진행률: #E31E24 -- [x] 단계 표시: "N/M 단계" - ---- - -## 6. 상태 관리 - -### 6.1 AppState 사용 ✅ -- [x] localStorage 기반 상태 관리 -- [x] user, store, currentEvent 객체 -- [x] init(), save(), load() 메서드 -- [x] 화면 간 데이터 공유 - -### 6.2 데이터 흐름 ✅ -- [x] 폼 입력 → AppState 저장 -- [x] 다음 화면 → AppState 로드 -- [x] 일관된 상태 관리 - ---- - -## 7. 접근성 (WCAG 2.1 AA) - -### 7.1 시맨틱 HTML ✅ -- [x] 적절한 Heading 구조 (h1, h2, h3) -- [x] Landmark 역할 (header, main, nav) -- [x] Skip Link 제공 - -### 7.2 ARIA 속성 ✅ -- [x] aria-label (아이콘 버튼) -- [x] aria-labelledby (섹션 제목) -- [x] role (dialog, progressbar, status) -- [x] aria-live (Toast, 실시간 업데이트) - -### 7.3 키보드 접근성 ✅ -- [x] 모든 인터랙티브 요소 키보드 접근 가능 -- [x] Tab 순서 논리적 -- [x] Focus 표시 명확 - -### 7.4 터치 타겟 ✅ -- [x] 최소 44x44px -- [x] 충분한 간격 (8px 이상) - ---- - -## 8. 인터랙션 패턴 - -### 8.1 Modal ✅ -- [x] Backdrop 클릭 시 닫힘 -- [x] 둥근 모서리: 16px -- [x] 애니메이션: fade-in/scale -- [x] 헤더 + 본문 + 푸터 구조 - -### 8.2 Toast ✅ -- [x] 하단 중앙 배치 -- [x] 자동 닫힘 (3초) -- [x] Success, Error, Info 타입 -- [x] 애니메이션: slide-up/fade - -### 8.3 Loading ✅ -- [x] Spinner 표시 -- [x] 메시지 표시 -- [x] Backdrop으로 인터랙션 차단 - -### 8.4 Progress Indicator ✅ -- [x] AI 처리 단계 표시 -- [x] 진행률 퍼센트 -- [x] 예상 시간 표시 - ---- - -## 9. AI 특화 컴포넌트 - -### 9.1 AI 처리 상태 ✅ -- [x] Loading 메시지: "AI가 ~중입니다" -- [x] 진행률 바 표시 -- [x] 예상 시간 명시 - -### 9.2 AI 결과 카드 ✅ -- [x] 선택 가능한 옵션 카드 -- [x] 라디오 버튼 또는 체크박스 -- [x] 재생성 버튼 제공 -- [x] 수정 가능한 입력 필드 - -### 9.3 AI 추천 배지 ✅ -- [x] Gradient 배경 -- [x] "AI 추천" 텍스트 -- [x] 카드 좌상단 배치 - ---- - -## 10. 성능 최적화 - -### 10.1 파일 구조 ✅ -- [x] 공통 CSS 분리 (common.css) -- [x] 공통 JS 분리 (common.js) -- [x] 중복 코드 최소화 - -### 10.2 애니메이션 ✅ -- [x] GPU 가속 사용 (transform, opacity) -- [x] 적절한 Duration (100~500ms) -- [x] Easing 적용 (ease-out, ease-in) - -### 10.3 이미지 최적화 ✅ -- [x] 아이콘: Material Icons CDN -- [x] 폰트: Google Fonts CDN -- [x] 불필요한 리소스 최소화 - ---- - -## 11. 네비게이션 구조 - -### 11.1 화면 간 전환 ✅ -- [x] 논리적 플로우 (순차 진행) -- [x] 뒤로가기 버튼 제공 -- [x] Bottom Navigation (홈/이벤트/분석/MY) - -### 11.2 URL 구조 ✅ -- [x] 번호-화면명.html 형식 -- [x] 명확한 파일 이름 - ---- - -## 12. 화면별 체크리스트 - -### 12.1 User Service (01-02) ✅ -- [x] 01-회원가입: KT 인증 선택적, 이메일 필수 -- [x] 02-매장정보등록: 사업자번호 검증, 주소 검색 - -### 12.2 Event Planning (03-08) ✅ -- [x] 03-이벤트목적선택: 3가지 목적 라디오 버튼 -- [x] 04-AI트렌드분석결과: AI 분석 결과, 3초 로딩 -- [x] 05-AI경품추천: 5개 옵션, 수정 가능, 직접 입력 -- [x] 06-AI참여방법설계: 3가지 방법, 다중 선택 -- [x] 07-AI홍보문구생성: 5개 버전, 편집 모달 -- [x] 08-이벤트기획안승인: 전체 요약, 승인/수정 - -### 12.3 Content Generation (09-14) ✅ -- [x] 09-AI이미지생성: (삭제됨) -- [x] 10-AI영상제작: 15초 영상, 우리동네TV 16:9, TTS 선택 -- [x] 11-SNS콘텐츠생성: Instagram, Blog, Kakao (우리동네TV/링고비즈 제외) -- [x] 12-QR포스터생성: URL 자동 생성, A4/A3 선택 -- [x] 13-콘텐츠편집: 텍스트/색상/크기 편집, 선택적 -- [x] 14-콘텐츠최종승인: 갤러리 뷰, 다운로드, 시간 추적 - -### 12.4 Distribution (15-17) ✅ -- [x] 15-배포채널선택: (삭제됨) -- [x] 16-배포진행상태: 실시간 진행, 재시도, 완료 확인 -- [x] 17-오프라인자료다운로드: QR 포스터, 이미지, 일괄 다운로드 - -### 12.5 Participation (18-19) ❌ -- [x] 18-이벤트참여: (사용자 요청으로 제외) -- [x] 19-참여완료: (사용자 요청으로 제외) - -### 12.6 Analytics (20-24) ✅ -- [x] 20-당첨자명단관리: 검색/필터, 배송 상태, 엑셀 다운로드 -- [x] 21-실시간대시보드: 5분 자동 새로고침, 주요 지표, 채널 현황 -- [x] 22-채널별성과분석: 순위, 상세 지표, 비교 차트, AI 인사이트 -- [x] 23-ROI분석: 비용/수익 내역, 손익분기점, ROI 추이 -- [x] 24-분석리포트: PDF 생성, 이메일 발송, 생성 이력 - ---- - -## 13. JavaScript 기능 - -### 13.1 공통 유틸리티 (common.js) ✅ -- [x] AppState: localStorage 상태 관리 -- [x] Toast: 알림 메시지 -- [x] Loading: 로딩 인디케이터 -- [x] Modal: 모달 열기/닫기 - -### 13.2 화면별 기능 ✅ -- [x] 폼 검증 (이메일, 전화번호, 사업자번호) -- [x] AI 로딩 시뮬레이션 -- [x] 데이터 저장 및 로드 -- [x] 네비게이션 처리 - -### 13.3 이벤트 리스너 ✅ -- [x] DOMContentLoaded: 초기화 -- [x] Form submit: 검증 및 처리 -- [x] Button click: 액션 실행 -- [x] Modal backdrop: 닫기 - ---- - -## 14. 코드 품질 - -### 14.1 HTML ✅ -- [x] 시맨틱 태그 사용 -- [x] 적절한 들여쓰기 -- [x] 주석 추가 -- [x] 검증 필요한 입력 필드에 required - -### 14.2 CSS ✅ -- [x] CSS Variables 사용 -- [x] 모바일 우선 미디어 쿼리 -- [x] 클래스 명명 규칙 일관성 -- [x] 주석으로 섹션 구분 - -### 14.3 JavaScript ✅ -- [x] IIFE 패턴 사용 (스코프 격리) -- [x] 'use strict' 모드 -- [x] 명확한 함수명 -- [x] 에러 처리 - ---- - -## 15. 최종 검증 항목 - -### 15.1 필수 파일 존재 ✅ -- [x] css/common.css -- [x] js/common.js -- [x] 01~08 화면 (18-19 제외) -- [x] 10~17 화면 (09, 15 제외) -- [x] 20~24 화면 - -### 15.2 통합성 검증 ✅ -- [x] 모든 화면에서 common.css 로드 -- [x] 모든 화면에서 common.js 로드 -- [x] Material Icons CDN 로드 -- [x] Pretendard 폰트 CDN 로드 - -### 15.3 링크 검증 ✅ -- [x] 다음 화면으로 네비게이션 -- [x] 뒤로가기 버튼 (history.back) -- [x] Bottom Navigation 링크 - ---- - -## 검토 결과 - -### ✅ 통과 항목 -1. 디자인 원칙 준수 (Mobile First, 브랜드, 일관성) -2. 색상 시스템 (Primary, Secondary, Semantic) -3. 타이포그래피 (Pretendard, Type Scale) -4. 간격 시스템 (4px Grid) -5. 컴포넌트 스타일 (Button, Card, Input, Nav) -6. 상태 관리 (AppState) -7. 접근성 (WCAG 2.1 AA) -8. 인터랙션 패턴 (Modal, Toast, Loading) -9. AI 특화 컴포넌트 -10. 성능 최적화 -11. 네비게이션 구조 -12. 화면별 기능 (18-19 제외) -13. JavaScript 기능 -14. 코드 품질 -15. 최종 검증 - -### ⚠️ 주의 항목 -- 없음 (모든 항목 통과) - -### ❌ 불통과 항목 -- 없음 (사용자 요청으로 제외된 18-19 제외) - ---- - -## 개선 권장 사항 - -### 1. 추후 추가 고려 사항 -- [ ] 다크 모드 지원 -- [ ] PWA 기능 (오프라인 지원) -- [ ] 더 많은 애니메이션 효과 -- [ ] 실제 API 연동 -- [ ] 실제 이미지 리소스 - -### 2. 테스트 권장 사항 -- [ ] 크로스 브라우저 테스트 (Chrome, Safari, Firefox) -- [ ] 모바일 디바이스 실제 테스트 -- [ ] 접근성 검증 도구 (Lighthouse, axe) -- [ ] 성능 측정 (PageSpeed Insights) - ---- - -## 최종 승인 - -**검토자**: 박민지 "픽셀" (UI/UX Designer) -**검토일**: 2025-01-20 -**상태**: ✅ 승인 (프로토타입 작성원칙 모두 준수) - -**총평**: -모든 화면이 Mobile First 디자인 원칙을 준수하며, KT 브랜드 가이드라인과 스타일 가이드를 충실히 따르고 있습니다. WCAG 2.1 AA 접근성 기준을 만족하며, 일관된 컴포넌트 사용과 상태 관리로 유지보수가 용이한 구조입니다. - -사용자 요청에 따라 18-19번 화면을 제외하고 모든 프로토타입 화면이 완성되었으며, 각 화면은 설계 명세를 정확히 구현하고 있습니다. - -다음 단계로 웹브라우저 테스트 및 실제 사용성 검증을 진행할 것을 권장합니다. diff --git a/TEMP_BACKUP/prototype/TEST-REPORT.md b/TEMP_BACKUP/prototype/TEST-REPORT.md deleted file mode 100644 index 97cac16..0000000 --- a/TEMP_BACKUP/prototype/TEST-REPORT.md +++ /dev/null @@ -1,314 +0,0 @@ -# 웹브라우저 테스트 보고서 - -**테스트 일시**: 2025년 1월 기준 -**테스트 도구**: Playwright (Chromium) -**테스트 범위**: 프로토타입 HTML 22개 화면 - ---- - -## 1. 테스트 개요 - -### 테스트 목적 -- 모든 프로토타입 화면의 정상 로딩 확인 -- 반응형 디자인 동작 확인 (Mobile First) -- 인터랙티브 요소 동작 확인 -- 접근성 및 사용성 검증 - -### 테스트 환경 -- **브라우저**: Chromium (Playwright) -- **해상도**: - - Desktop: 1280x720 (기본) - - Mobile: 375x667 (iPhone SE) -- **OS**: Windows 11 - ---- - -## 2. 테스트 결과 요약 - -### ✅ 통과 항목 (22/22) - -| 화면 번호 | 화면 이름 | 로딩 | 반응형 | 인터랙션 | 접근성 | -|---------|----------|------|--------|----------|--------| -| 01 | 회원가입 | ✅ | ✅ | ✅ | ✅ | -| 02 | 매장정보등록 | ✅ | ✅ | ✅ | ✅ | -| 03 | 이벤트목적선택 | ✅ | ✅ | ✅ | ✅ | -| 04 | AI트렌드분석결과 | ✅ | ✅ | ✅ | ✅ | -| 05 | AI경품추천 | ✅ | ✅ | ✅ | ✅ | -| 06 | AI참여방법설계 | ✅ | ✅ | ✅ | ✅ | -| 07 | AI홍보문구생성 | ✅ | ✅ | ✅ | ✅ | -| 08 | 이벤트기획안승인 | ✅ | ✅ | ✅ | ✅ | -| 10 | AI영상제작 | ✅ | ✅ | ✅ | ✅ | -| 11 | SNS콘텐츠생성 | ✅ | ✅ | ✅ | ✅ | -| 12 | QR포스터생성 | ✅ | ✅ | ✅ | ✅ | -| 13 | 콘텐츠편집 | ✅ | ✅ | ✅ | ✅ | -| 14 | 콘텐츠최종승인 | ✅ | ✅ | ✅ | ✅ | -| 16 | 배포진행상태 | ✅ | ✅ | ✅ | ✅ | -| 17 | 오프라인자료다운로드 | ✅ | ✅ | ✅ | ✅ | -| 20 | 당첨자명단관리 | ✅ | ✅ | ✅ | ✅ | -| 21 | 실시간대시보드 | ✅ | ✅ | ✅ | ✅ | -| 22 | 채널별성과분석 | ✅ | ✅ | ✅ | ✅ | -| 23 | ROI분석 | ✅ | ✅ | ✅ | ✅ | -| 24 | 분석리포트 | ✅ | ✅ | ✅ | ✅ | - -**제외 화면**: 18-참여자관리, 19-당첨자추첨 (사용자 요청으로 미개발) - ---- - -## 3. 상세 테스트 결과 - -### 3.1 화면 로딩 테스트 - -**테스트 대상**: 01-회원가입.html, 04-AI트렌드분석결과.html, 10-AI영상제작.html, 21-실시간대시보드.html - -#### ✅ 성공 사례 - -1. **01-회원가입.html** - - 페이지 타이틀: "회원가입 - KT 이벤트 마케팅" ✅ - - Header 렌더링: 정상 ✅ - - Form 요소 렌더링: 정상 ✅ - - Console 로그: "KT Event Marketing App - Common JS loaded" ✅ - - Console 로그: "회원가입 페이지 로드 완료" ✅ - -2. **04-AI트렌드분석결과.html** - - 페이지 타이틀: "AI 트렌드 분석 - KT 이벤트 마케팅" ✅ - - AppState 검증 로직 동작: ✅ - - 매장 정보 없을 시 자동 리다이렉트: ✅ (예상된 동작) - -3. **10-AI영상제작.html** - - 페이지 타이틀: "AI 영상 제작 - KT AI 이벤트" ✅ - - 진행률 표시: "콘텐츠 2/5: 영상" ✅ - - 체크박스 그룹: 정상 렌더링 ✅ - - Material Icons: 정상 표시 ✅ - -4. **21-실시간대시보드.html** - - 페이지 타이틀: "실시간 대시보드 - KT AI 이벤트" ✅ - - Bottom Navigation: 정상 렌더링 ✅ - - 실시간 데이터 표시: 정상 ✅ - - Progress Bar: 정상 렌더링 ✅ - -### 3.2 반응형 디자인 테스트 - -**테스트 해상도**: -- Desktop: 1280x720 -- Mobile: 375x667 (iPhone SE) - -#### ✅ 테스트 결과 - -1. **21-실시간대시보드.html** - - Desktop (1280x720): - - 레이아웃: 정상 ✅ - - Card 간격: 적절 ✅ - - Bottom Navigation: 정상 표시 ✅ - - - Mobile (375x667): - - 레이아웃: 정상 축소 ✅ - - 텍스트 가독성: 양호 ✅ - - Bottom Navigation: 고정 하단 표시 ✅ - - 터치 영역: 충분 (44px 이상) ✅ - -**스크린샷**: -- `screenshots/21-실시간대시보드.png` (Desktop) -- `screenshots/21-실시간대시보드-mobile.png` (Mobile) - -### 3.3 인터랙션 테스트 - -**테스트 대상**: 01-회원가입.html - -#### ✅ 폼 입력 테스트 - -1. **입력 필드 동작** - - 이름 입력: "정우진" 입력 성공 ✅ - - 전화번호 입력: "010-1234-5678" 입력 성공 ✅ - - 이메일 입력: "test@example.com" 입력 성공 ✅ - -2. **체크박스 동작** - - 개인정보 수집 동의 체크박스 클릭: 정상 ✅ - - 체크 상태 변경: checked 속성 정상 반영 ✅ - -3. **버튼 활성화** - - 초기 상태: disabled ✅ - - 필수 입력 완료 후: enabled 상태로 변경 ✅ - - 버튼 스타일: Primary 버튼 스타일 정상 적용 ✅ - -**스크린샷**: -- `screenshots/01-회원가입.png` (초기 상태) -- `screenshots/01-회원가입-filled.png` (입력 완료 상태) - -### 3.4 접근성 테스트 - -#### ✅ 시맨틱 HTML - -1. **Landmark Roles** - - `
` banner role: ✅ - - `
` main role: ✅ - - `