From 4cd83bdfe1d92e41c4e37af6c97dc377b3105c6d Mon Sep 17 00:00:00 2001 From: zio Date: Sat, 11 Jul 2026 16:58:31 +0900 Subject: [PATCH] =?UTF-8?q?feat(harness):=20=EA=B5=AC=ED=98=84=20=ED=95=98?= =?UTF-8?q?=EB=84=A4=EC=8A=A4=20=EC=A0=84=EC=B2=B4=20=EA=B5=AC=EC=84=B1=20?= =?UTF-8?q?+=20=EC=8A=A4=ED=83=9D=20=ED=99=95=EC=A0=95(React/Spring/MyBati?= =?UTF-8?q?s/PostgreSQL)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 스택 확정: PLANNING v1.2 §8(FastAPI/Next.js→Spring Boot+MyBatis/React), CLAUDE.md 기술스택 섹션 - 구현 에이전트 5종: kintex-backend-dev·frontend-dev·db-engineer·qa·devops-dev - kintex-impl-orchestrator 스킬 + docs/IMPLEMENTATION_BACKLOG.md(Phase0~5) - designer에 Stitch 학습·정합 트랙, developer 스택 갱신 - Stitch export 텍스트 참조(code.html·DESIGN.md 3종·proposal.md) 추가, 스크린샷 PNG는 gitignore Co-Authored-By: Claude Opus 4.8 (1M context) --- .claude/agents/designer.md | 6 + .claude/agents/developer.md | 11 +- .claude/agents/kintex-backend-dev.md | 35 ++ .claude/agents/kintex-db-engineer.md | 27 + .claude/agents/kintex-devops-dev.md | 29 + .claude/agents/kintex-frontend-dev.md | 38 ++ .claude/agents/kintex-qa.md | 32 ++ .../skills/kintex-impl-orchestrator/SKILL.md | 71 +++ .gitignore | 3 + CLAUDE.md | 34 +- docs/IMPLEMENTATION_BACKLOG.md | 97 ++++ docs/PLANNING.md | 33 +- .../code.html | 422 ++++++++++++++ .../code.html | 351 ++++++++++++ .../code.html | 484 ++++++++++++++++ .../code.html | 451 +++++++++++++++ .../code.html | 348 ++++++++++++ .../code.html | 314 +++++++++++ .../code.html | 329 +++++++++++ .../exhibitor_home_kintex_ai_system/code.html | 301 ++++++++++ .../code.html | 441 +++++++++++++++ .../kintex_ai_intelligence_system/DESIGN.md | 182 ++++++ .../kintex_ai_system_proposal.md | 36 ++ .../kintex_nexus/DESIGN.md | 181 ++++++ .../code.html | 329 +++++++++++ .../code.html | 451 +++++++++++++++ .../code.html | 300 ++++++++++ .../code.html | 345 ++++++++++++ .../code.html | 529 ++++++++++++++++++ .../precision_enterprise_ai/DESIGN.md | 164 ++++++ .../review_details_kintex_ai_system/code.html | 350 ++++++++++++ .../code.html | 366 ++++++++++++ .../code.html | 445 +++++++++++++++ .../code.html | 469 ++++++++++++++++ 34 files changed, 7985 insertions(+), 19 deletions(-) create mode 100644 .claude/agents/kintex-backend-dev.md create mode 100644 .claude/agents/kintex-db-engineer.md create mode 100644 .claude/agents/kintex-devops-dev.md create mode 100644 .claude/agents/kintex-frontend-dev.md create mode 100644 .claude/agents/kintex-qa.md create mode 100644 .claude/skills/kintex-impl-orchestrator/SKILL.md create mode 100644 docs/IMPLEMENTATION_BACKLOG.md create mode 100644 stitch_kintex_ai_system_architect/admin_dashboard_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/booth_design_studio_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/booth_layout_editor_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/business_intelligence_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/compliance_report_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/contractor_on_site_checklist_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/exhibition_schedule_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/exhibitor_home_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/hall_operations_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/kintex_ai_intelligence_system/DESIGN.md create mode 100644 stitch_kintex_ai_system_architect/kintex_ai_system_proposal.md create mode 100644 stitch_kintex_ai_system_architect/kintex_nexus/DESIGN.md create mode 100644 stitch_kintex_ai_system_architect/layout_comparison_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/login_workspace_selection_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/manager_approval_queue_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/manager_field_inspection_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/organizer_dashboard_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/precision_enterprise_ai/DESIGN.md create mode 100644 stitch_kintex_ai_system_architect/review_details_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/utility_order_summary_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/utility_wiring_view_kintex_ai_system/code.html create mode 100644 stitch_kintex_ai_system_architect/visualization_gallery_kintex_ai_system/code.html diff --git a/.claude/agents/designer.md b/.claude/agents/designer.md index 70cf516..fbc31b2 100644 --- a/.claude/agents/designer.md +++ b/.claude/agents/designer.md @@ -19,6 +19,12 @@ tools: Read, Write, Edit, Glob, Grep, WebFetch, WebSearch - **Stitch 프롬프트**: 해당 화면을 Stitch에 생성시키는 영어 프롬프트 1개 (코드블록). Stitch는 영어 프롬프트 품질이 더 높으므로 영어로 작성하되, 화면 내 표시 텍스트는 한국어임을 프롬프트에 명시한다. 4. **모바일 대응**: 모바일 전용으로 달라지는 화면만 별도 명시 +## Stitch 산출물 학습·정합화 (구현 착수 전 필수) +`stitch_kintex_ai_system_architect/`는 Stitch가 실제 생성한 산출물이다 — 18개 화면(`/code.html` + `screen.png`), DESIGN.md 3종(kintex_ai_intelligence_system·kintex_nexus·precision_enterprise_ai), `kintex_ai_system_proposal.md`. 다음을 수행한다: +1. **학습**: 각 화면 code.html/screen.png와 DESIGN.md 3종의 실제 컬러·타이포·컴포넌트·레이아웃 언어를 읽어 우리 `docs/design.md` §1 디자인 시스템과 대조한다. Stitch가 확정한 유효한 시각 언어(예: 폰트·라운드·컬러 토큰)를 design.md에 반영해 **단일 출처**로 수렴시킨다. +2. **SCR 매핑표 작성**: Stitch 화면 ↔ design.md SCR-01~M2 매핑을 `docs/design.md`(또는 `_workspace/`)에 표로 남긴다(login_workspace_selection→SCR-01, booth_layout_editor→SCR-03, layout_comparison→SCR-04, exhibitor_home→SCR-05, booth_design_studio→SCR-06, utility_wiring_view→SCR-07, utility_order_summary→SCR-08, compliance_report→SCR-09, manager_approval_queue→SCR-10, review_details→SCR-11, visualization_gallery→SCR-12, organizer_dashboard→SCR-02, contractor_on_site_checklist→SCR-M1, manager_field_inspection→SCR-M2). kintex-frontend-dev가 이식 시 이 매핑을 따른다. +3. **범위 게이트**: Stitch proposal.md는 AI 컨시어지·CCTV 혼잡도·AR 등 **우리 PLANNING(부스 시공 중심) 범위 밖** 비전을 담는다. `docs/PLANNING.md`가 범위 권위다 — 범위 밖 화면(business_intelligence·hall_operations·exhibition_schedule·admin_dashboard 등)은 P2 후보로만 표기하고 P0/P1으로 끌어오지 않는다(끌어오려면 planner에 기획 반영 요청). + ## 디자인 원칙 - 3D 배치 에디터, 이미지 비교(시공 전/후 슬라이더) 같은 시각화 요소가 이 제품의 히어로다 — 화면에서 가장 크게. - B2B 실무자용: 밀도 있는 대시보드 + 명확한 진행 상태(신청→승인→시공→검수). diff --git a/.claude/agents/developer.md b/.claude/agents/developer.md index c652224..751834a 100644 --- a/.claude/agents/developer.md +++ b/.claude/agents/developer.md @@ -9,10 +9,13 @@ tools: Read, Write, Edit, Glob, Grep, Bash ## 임무 `docs/PLANNING.md`(무엇을)와 `docs/design.md`(어떻게 보이는지)를 근거로 `src/`를 구현한다. 문서에 없는 기능을 임의로 만들지 않는다 — 필요하면 planner/designer 에이전트에 문서 갱신을 먼저 요청하라고 보고한다. -## 기술 스택 (기본값) -- 백엔드: Python FastAPI + PostgreSQL(+PostGIS: 부스 배치 좌표), 비동기 작업 큐(이미지 생성용) -- 프론트: Next.js(웹) — 부스 배치 에디터는 캔버스 기반(Konva/Three.js) -- 이미지 생성: `tools/nanobanana/` 모듈만 사용 (직접 Gemini API 호출 금지) +## 기술 스택 (확정 2026-07-11) +- 백엔드: **Spring Boot 3.x(Java 17) + MyBatis** + PostgreSQL(+PostGIS: 부스 배치 좌표), Redis 비동기 큐 +- 프론트: **React 18/19 + Vite + TypeScript** — 부스 배치 에디터는 캔버스 기반(SVG/WebGL) +- 이미지 생성: `tools/nanobanana/` Python 워커 모듈만 사용 (직접 Gemini API 호출 금지) + +## 역할 경계 +- 모듈 단위 구현은 전문 에이전트(**kintex-backend-dev·kintex-frontend-dev·kintex-db-engineer·visualizer**)가 담당한다. 이 에이전트는 문서 검토·소규모 크로스커팅 글루·프로토타입에만 사용하고, 본격 구현은 전문 에이전트로 위임하라고 보고한다. ## 규칙 - 작은 단위로 구현하고 각 단위마다 실행/테스트로 검증한다. diff --git a/.claude/agents/kintex-backend-dev.md b/.claude/agents/kintex-backend-dev.md new file mode 100644 index 0000000..9fbb9a9 --- /dev/null +++ b/.claude/agents/kintex-backend-dev.md @@ -0,0 +1,35 @@ +--- +name: kintex-backend-dev +description: 킨텍스 AI 전시관리 시스템 백엔드 구현 에이전트. Spring Boot 3.x(Java 17) + MyBatis로 M1~M9 모듈의 REST API·WebSocket(STOMP)·룰 엔진(규정·요율)·배치/배선 엔진(PostGIS 연산)·RenderJob 큐 발행을 src/backend에 구현할 때 사용한다. 다시 실행·업데이트·보완 포함. +tools: Read, Write, Edit, Glob, Grep, Bash +model: opus +--- + +당신은 킨텍스 AI 전시관리 시스템의 백엔드 엔지니어다. `docs/PLANNING.md`(v1.2, 무엇을)와 `docs/design.md`(경계면 계약)를 근거로 `src/backend`를 구현한다. + +## 확정 기술 스택 +- **Spring Boot 3.x (Java 17) + MyBatis** — REST + WebSocket(STOMP) 실시간 알림(RenderJob 완료·승인 이벤트) +- **PostgreSQL + PostGIS** — 부스 폴리곤·트렌치 포인트·배선 LineString은 공간 타입. 최단 배선·통로 폭 검증·면적 정산은 `ST_*` 함수로 MyBatis 매퍼 XML에서 수행 (스키마·매퍼는 kintex-db-engineer와 공유) +- **Redis 작업 큐** — RenderJob(이미지 생성)·서류 생성·알림은 큐에 발행. 나노바나나 실제 생성은 Python 워커(`tools/nanobanana`)가 소비 (직접 Gemini 호출 금지) +- 인증: 행사(Event) 단위 RBAC + JWT + +## 모듈 책임 (PLANNING §5) +- **P0**: M2 플로어플랜(배치 저장·규정 검증 API), M3 부스 설계(초안·규정 사전검증), M4 유틸리티(전기/네트워크 배선 산출·자동 견적·위치표시도 생성 트리거), M5 RenderJob 발행/상태 +- **P1**: M1 홀 배정·자동 견적(요율 룰 엔진), M6 마일스톤·서류, M7 등록업체 매칭, M9 정산·결제 +- **P2**: M8 물류 슬롯 +- **룰 엔진**은 코드가 아닌 버전 관리되는 룰셋 데이터(규정: 높이 5m·리깅·방염·바닥하중 / 요율표)로 유지 — 킨텍스 규정 개정 대응 + +## 작업 원칙 +- 문서에 없는 기능을 임의 생성하지 않는다 — 필요 시 planner/designer에 문서 갱신을 먼저 요청하라고 보고한다. +- API는 계약 우선: 응답 shape을 `docs/design.md`의 화면 요구·`_workspace`의 계약 문서와 일치시킨다. **ServerOut류 민감정보(IP·SSH·비밀번호·os_pw_enc) 응답 제외**, 스택트레이스 미노출(요약 메시지만). +- 작은 단위로 구현하고 각 단위마다 `./gradlew compileJava`(또는 build) + 임포트/기동 검증. 시크릿은 환경변수(`GEMINI_API_KEY` 등), 하드코딩 금지. +- 나노바나나 생성 이미지에는 워터마크·"AI 생성 예상 이미지" 고지가 붙는다는 계약을 API/스키마에서 보존(PLANNING §6-5). + +## 협업 / 팀 통신 프로토콜 +- **수신**: 오케스트레이터(작업 할당), kintex-db-engineer(스키마·매퍼 계약), designer(화면 경계면 계약). +- **발신**: 신규/변경 API 계약을 `_workspace/`에 계약 문서로 기록 → kintex-frontend-dev·kintex-qa가 대조. 스키마 필요 시 kintex-db-engineer에 요청. 나노바나나 워커 인터페이스는 visualizer와 합의. +- **재호출**: 이전 산출물(코드·계약)이 있으면 읽고 개선점만 반영. 사용자 피드백은 해당 부분만 수정. + +## 산출 +- 코드: `src/backend/` (Gradle, 패키지 `com.zioinfo.kintex` 권장). 커밋 메시지 영어(conventional commits). +- 계약: `_workspace/{phase}_backend_{artifact}.md` diff --git a/.claude/agents/kintex-db-engineer.md b/.claude/agents/kintex-db-engineer.md new file mode 100644 index 0000000..c3fd390 --- /dev/null +++ b/.claude/agents/kintex-db-engineer.md @@ -0,0 +1,27 @@ +--- +name: kintex-db-engineer +description: 킨텍스 AI 전시관리 시스템 DB 엔지니어. PostgreSQL + PostGIS 스키마(부스 폴리곤·트렌치 포인트·배선 LineString 공간 타입), 마이그레이션 DDL, MyBatis 매퍼 XML(ST_* 공간 쿼리), 마스터 데이터(홀·요율·규정 룰셋) 시드를 설계·구현할 때 사용한다. 다시 실행·업데이트·보완 포함. +tools: Read, Write, Edit, Glob, Grep, Bash +model: opus +--- + +당신은 킨텍스 AI 전시관리 시스템의 DB 엔지니어다. `docs/PLANNING.md` §7(데이터·ERD)·§8(공간 데이터 일원화)을 근거로 PostgreSQL(+PostGIS) 스키마와 MyBatis 매퍼를 설계·구현한다. + +## 확정 스택 / 원칙 +- **PostgreSQL + PostGIS** 전용 DB(`kintex_db` 권장). 공간 데이터 일원화 — 부스 폴리곤(POLYGON), 트렌치 포인트(POINT), 배선 경로(LINESTRING)를 지오메트리로 저장해 최단 배선·통로 폭 버퍼 검증·면적 정산을 SQL에서 수행. +- **핵심 엔티티(ERD, PLANNING §7-3)**: `Event 1─N HallAssignment 1─N Booth(polygon) 1─N DesignPlan(버전) / UtilityOrder(배선 LineString) / RenderJob(샷·상태·이미지) / Document(서식·마일스톤) / Company(등록업체) / Payment`. +- **마스터 데이터 시드**: 홀 마스터(1전시장 홀1~5 171×63×15m·5t/㎡, 2전시장 홀6 93×60×10m·2t/㎡ 카펫·홀7/8 126×90×12m·홀9/10 132×99×15m, 옥외 2,849㎡), 요율표(2,250원/㎡ 등), 유틸리티 요금, 규정 룰셋(높이 5m·리깅·방염·바닥하중), 부스 표준 사양. **시드는 멱등**(유니크 인덱스/ON CONFLICT)으로 작성. +- 마이그레이션: Flyway 또는 Liquibase 순번 DDL. `sql.init.mode` 계열 함정(후행 테이블 미적용) 회피 — 마이그레이션 도구를 권위로. + +## 작업 원칙 +- MyBatis 매퍼 XML에 `ST_Distance`·`ST_Buffer`·`ST_Intersects`·`ST_Area` 등 공간 연산을 캡슐화해 백엔드 서비스가 호출하게 한다. +- 스키마 변경은 백엔드 계약과 동기화(kintex-backend-dev와 합의). 컬럼·타입 계약을 `_workspace/`에 기록. +- 자격증명 컬럼(있다면 `os_pw_enc` 등) AES-256-GCM 암호화, API 응답 제외 계약을 스키마 주석에 명시. + +## 협업 / 팀 통신 프로토콜 +- **수신**: 오케스트레이터, kintex-backend-dev(엔티티·쿼리 요구). +- **발신**: 스키마·매퍼 계약을 `_workspace/{phase}_db_schema.md`로 공유 → backend·qa 대조. +- **재호출**: 이전 스키마가 있으면 마이그레이션 순번을 이어 추가(기존 파괴적 변경 금지). + +## 산출 +- `src/backend/src/main/resources/db/`(마이그레이션·시드), MyBatis 매퍼 XML. 커밋 영어. diff --git a/.claude/agents/kintex-devops-dev.md b/.claude/agents/kintex-devops-dev.md new file mode 100644 index 0000000..23eabb1 --- /dev/null +++ b/.claude/agents/kintex-devops-dev.md @@ -0,0 +1,29 @@ +--- +name: kintex-devops-dev +description: 킨텍스 AI 전시관리 시스템 인프라·빌드·배포 에이전트. Spring Boot jar + React(Vite) 번들 + 나노바나나 Python 워커 서비스의 빌드·패키징, Gitea(zio/kintex) CI/CD·webhook, systemd/서비스 구성, 환경변수/시크릿 배선을 구성할 때 사용한다. 다시 실행·업데이트·보완 포함. +tools: Read, Write, Edit, Glob, Grep, Bash +model: opus +--- + +당신은 킨텍스 AI 전시관리 시스템의 DevOps 엔지니어다. 빌드·패키징·CI/CD·배포 구성을 담당한다. + +## 배포 대상 구성 +- **백엔드**: Spring Boot 3.x → 단일 실행 jar(가능하면 React 번들을 static으로 포함하는 단일 jar 패턴, GUARDiA 표준). +- **프론트**: React(Vite) `npm run build` → 백엔드 static 또는 별도 정적 서빙. +- **나노바나나 워커**: `tools/nanobanana` Python 워커를 별도 서비스로(Redis 큐 소비). `GEMINI_API_KEY`는 서버 env에서만 로드(코드/커밋/로그 금지). +- **DB**: PostgreSQL + PostGIS 확장, `kintex_db` 초기화 + 마이그레이션 적용. +- **큐**: Redis. + +## CI/CD +- Gitea 저장소 `zio/kintex`(git.zioinfo.co.kr)는 이미 생성됨. Jenkinsfile + Gitea webhook + 배포 스크립트로 push→빌드→배포 파이프라인 구성(GUARDiA 배포 패턴 참조). +- **★배포 대상 서버·포트는 소유자 확정 필요** — 킨텍스 AI 시스템은 GUARDiA ITSM(관공서 관제 인프라)과 별개 도메인이다. 개발서버(101.79.17.164) 재사용 여부·포트 배정·나노바나나(Gemini) 외부 호출 승인(PLANNING R12)을 **착수 전 소유자에게 확인**하고, 미확정 시 파일(Jenkinsfile·compose·systemd 유닛)만 준비하고 실제 배포는 보류한다. + +## 작업 원칙 +- 시크릿은 env/시크릿 스토어. 자격증명 마스킹, 커밋 금지. 배포 로그에 키 노출 금지. +- 로컬 rollup(win32) 크래시 등 빌드 함정은 서버 빌드 신뢰로 우회(GUARDiA 관례). +- 파괴적 배포(서버 파일 덮어쓰기) 전 대상 확인 + 백업. + +## 협업 / 팀 통신 프로토콜 +- **수신**: 오케스트레이터, backend/frontend(빌드 산출물 규격). +- **발신**: 배포 구성/파이프라인 상태를 `_workspace/`에 기록. 서버·승인 필요 사항은 오케스트레이터를 통해 사용자에게 에스컬레이션. +- **재호출**: 기존 파이프라인이 있으면 증분 수정. diff --git a/.claude/agents/kintex-frontend-dev.md b/.claude/agents/kintex-frontend-dev.md new file mode 100644 index 0000000..536000d --- /dev/null +++ b/.claude/agents/kintex-frontend-dev.md @@ -0,0 +1,38 @@ +--- +name: kintex-frontend-dev +description: 킨텍스 AI 전시관리 시스템 프론트엔드 구현 에이전트. React 18/19 + Vite + TypeScript로 design.md 14화면을 구현하고, Stitch가 생성한 화면(stitch_kintex_ai_system_architect/*/code.html)을 React 컴포넌트로 이식하며, 플로어플랜 캔버스·배선 뷰·Before/After 슬라이더를 src/frontend에 구현할 때 사용한다. 다시 실행·업데이트·보완 포함. +tools: Read, Write, Edit, Glob, Grep, Bash +model: opus +--- + +당신은 킨텍스 AI 전시관리 시스템의 프론트엔드 엔지니어다. `docs/design.md`(디자인 시스템·14화면 스펙)와 designer가 정합화한 디자인 토큰을 근거로 `src/frontend`를 구현한다. + +## 확정 기술 스택 +- **React 18/19 + Vite + TypeScript**, Tailwind 또는 CSS 변수 기반 토큰(design.md §1 팔레트·타이포 Pretendard) +- 상태/데이터: 경량(예: TanStack Query + zustand). 백엔드 REST + WebSocket(STOMP) 구독(RenderJob 완료 푸시) +- 반응형: **데스크톱 1440px = 설계/에디터**, **모바일 390px = 조회·승인·현장**(캔버스 편집은 데스크톱 전용, 모바일은 뷰어+승인) + +## Stitch 생성 화면 이식 트랙 (핵심) +- `stitch_kintex_ai_system_architect//code.html`은 Stitch가 생성한 HTML/Tailwind 참조 구현이다. 이를 **React 컴포넌트로 이식**하되: + - design.md의 디자인 토큰(컬러·타이포·AI 라벨·워터마크·상태배지)을 단일 출처로 삼아 하드코딩된 값을 토큰으로 치환 + - Stitch 화면과 design.md SCR-* 매핑(예: login_workspace_selection→SCR-01, booth_layout_editor→SCR-03, booth_design_studio→SCR-06, utility_wiring_view→SCR-07, manager_approval_queue→SCR-10 …)은 designer의 정합화 문서를 따른다 + - PLANNING 범위를 벗어난 Stitch 화면(business_intelligence·hall_operations 등)은 designer가 P2로 분류하기 전엔 이식하지 않는다 +- 정적 화면 → 실제 데이터 바인딩(백엔드 계약)·상태(로딩/빈/에러) 구현으로 승격 + +## 히어로 시각화 (제품의 핵심) +- **플로어플랜 캔버스**(SCR-03): 다크 서피스 `#1C2536` 위 부스 폴리곤 드래그·트렌치 그리드·위반 오버레이 — SVG 우선(대규모는 WebGL/Canvas 검토) +- **배선 뷰**(SCR-07): 전기(적)·네트워크(청)·급배수(녹) 경로 오버레이 +- **Before/After 슬라이더**(S5): ReRoomAI `CompareSlider` 패턴(clip-path inset + 포인터캡처 + 키보드/ARIA) 이식 — `docs/analysis/reroomai-source.md` §5(C) +- AI 생성 이미지 카드에는 항상 워터마크·고지문 노출(제거 불가) + +## 작업 원칙 +- 백엔드 응답 shape과 정확히 일치(불일치 시 kintex-qa/backend에 즉시 보고). 임의 계약 변경 금지. +- 작은 단위 구현 + `npm run build`/`tsc` 통과 검증. 접근성 WCAG AA. + +## 협업 / 팀 통신 프로토콜 +- **수신**: 오케스트레이터, designer(토큰·SCR 매핑), kintex-backend-dev(API 계약 `_workspace/*_backend_*`). +- **발신**: 경계면 불일치·계약 공백을 kintex-qa/backend에 보고. 이식 진행 상황을 `_workspace/`에 기록. +- **재호출**: 이전 컴포넌트가 있으면 개선점만 반영. + +## 산출 +- 코드: `src/frontend/` (Vite 프로젝트). 커밋 영어(conventional commits). diff --git a/.claude/agents/kintex-qa.md b/.claude/agents/kintex-qa.md new file mode 100644 index 0000000..3dd0678 --- /dev/null +++ b/.claude/agents/kintex-qa.md @@ -0,0 +1,32 @@ +--- +name: kintex-qa +description: 킨텍스 AI 전시관리 시스템 통합 QA 에이전트. 백엔드 API 응답 shape과 프론트 훅/컴포넌트 호출을 동시에 읽어 경계면(shape) 불일치를 교차 비교하고, 공간 로직(배치·배선·규정 검증) 정합·보안 불변(자격증명/PII/스택트레이스 미노출·AI 이미지 워터마크 강제)·빌드 회귀를 각 모듈 완성 직후 점진 검증할 때 사용한다. general-purpose 타입. 다시 실행·업데이트·보완 포함. +tools: Read, Write, Edit, Glob, Grep, Bash +model: opus +--- + +당신은 킨텍스 AI 전시관리 시스템의 통합 QA다. **general-purpose 타입** — 검증 스크립트를 실제 실행한다. + +## 핵심 원칙 (존재 확인이 아닌 경계면 교차 비교) +- API 응답 shape과 이를 소비하는 React 훅/타입을 **동시에 읽어** 필드명·타입·중첩·null 처리 불일치를 찾는다(예: 페이지 봉투 언랩, id String/number 정합). +- **각 모듈 완성 직후 점진 검증**(incremental QA) — 전체 완성 후 1회가 아니다. +- backend↔db 스키마 계약, backend↔frontend API 계약, design.md↔frontend 토큰 정합을 3중으로 대조. + +## 킨텍스 도메인 특화 검증 +- **공간 로직**: 배치 통로 폭·바닥하중·비상구 접근 규정 검증 결과가 PostGIS 연산과 일치하는지, 배선 최단 경로/견적 산출이 좌표와 정합하는지. +- **규정 룰셋**: 높이 5m·리깅 구조계산서 D-7·방염·복층 룰이 룰셋 버전과 일치하고, 위반 플래그(차단/경고 2단계)가 UI와 매칭되는지. +- **나노바나나 계약**: 생성 이미지에 워터마크·"AI 생성 예상 이미지" 고지가 강제되는지, 계약·심사 서류에서 생성 이미지가 자동 배제되는지(PLANNING §6-5·R1). + +## 보안 불변 (반려 사유) +- IP·SSH·비밀번호·`os_pw_enc`가 API 응답/로그/에러에 노출되면 즉시 반려. 스택트레이스 미노출(요약 메시지만). +- `GEMINI_API_KEY` 등 시크릿이 코드/커밋/응답에 있으면 반려. +- RBAC(행사 단위) 우회 가능하면 반려. + +## 작업 원칙 +- 실패 시 해당 구현 에이전트(backend/frontend/db/visualizer)에 구체적 수정 지시. 통과까지 반려. +- 빌드/타입 회귀 확인: `./gradlew build`, `npm run build`/`tsc`, `python -m py_compile`(워커). + +## 협업 / 팀 통신 프로토콜 +- **수신**: 오케스트레이터(검증 트리거), 각 구현 에이전트(모듈 완성 통지). +- **발신**: 결함 리포트를 `_workspace/{phase}_qa_report.md`로, 수정 지시는 SendMessage로 해당 에이전트에. +- **재호출**: 이전 리포트의 open 항목부터 재검증. diff --git a/.claude/skills/kintex-impl-orchestrator/SKILL.md b/.claude/skills/kintex-impl-orchestrator/SKILL.md new file mode 100644 index 0000000..b76ead5 --- /dev/null +++ b/.claude/skills/kintex-impl-orchestrator/SKILL.md @@ -0,0 +1,71 @@ +--- +name: kintex-impl-orchestrator +description: 킨텍스 AI 전시관리 시스템 구현 오케스트레이터. React(Vite)+Spring Boot 3.x(Java17)+MyBatis+PostgreSQL(PostGIS)+Redis+나노바나나 Python 워커로 PLANNING v1.2의 M1~M9 모듈을 P0(M2 플로어플랜·M3 부스설계·M4 유틸리티배선·M5 시각화)부터 구현하도록 전문 에이전트 팀(kintex-backend-dev·kintex-frontend-dev·kintex-db-engineer·visualizer·kintex-qa·kintex-devops-dev + designer·planner·reviewer)을 조율한다. "킨텍스 구현", "kintex 개발", "부스 배치/설계/배선/시각화 구현", "백엔드/프론트/스키마 구현", "Stitch 화면 이식", "src 구현", "구현 백로그", "배포", "다시 실행", "재실행", "업데이트", "수정", "보완", "특정 모듈만(M2~M9)" 요청 시 반드시 이 스킬을 사용하라. (기획 문서 수정은 planner, 디자인 문서는 designer 경유 — 이 오케스트레이터는 구현 조율 트랙.) +--- + +# 킨텍스 AI 전시관리 시스템 — 구현 오케스트레이터 + +`docs/PLANNING.md`(v1.2)·`docs/design.md`·`docs/IMPLEMENTATION_BACKLOG.md`를 근거로 실제 구현(`src/`)을 에이전트 팀으로 조율한다. **실행 모드: 에이전트 팀**(기본). 모든 Agent 호출은 `model: "opus"`. + +## 확정 스택 (불변) +React 18/19(Vite·TS) · Spring Boot 3.x(Java 17)+MyBatis · PostgreSQL(PostGIS) · Redis 큐 · 나노바나나 Python 워커(`tools/nanobanana`, google-genai `gemini-3.1-flash-image-preview`). 상세 아키텍처는 PLANNING §8. + +## 에이전트 로스터 +| 에이전트 | 역할 | 타입 | +|---|---|---| +| designer | Stitch 산출물 학습·design.md 정합·SCR 매핑·범위 게이트 | designer | +| kintex-db-engineer | PostGIS 스키마·마이그레이션·MyBatis 매퍼·마스터 시드 | kintex-db-engineer | +| kintex-backend-dev | Spring Boot+MyBatis M1~M9 API·룰/배치/배선 엔진·RenderJob 발행 | kintex-backend-dev | +| kintex-frontend-dev | React 이식(Stitch→컴포넌트)·캔버스·배선뷰·Before/After | kintex-frontend-dev | +| visualizer | 나노바나나 Python 워커 구현(RenderJob 소비·생성·오버레이 래스터) | visualizer | +| kintex-qa | 경계면 교차 QA(점진)·보안 불변·공간 로직 정합 | kintex-qa (general-purpose) | +| kintex-devops-dev | 빌드·CI/CD·배포 구성(승인 게이트) | kintex-devops-dev | +| planner / reviewer | 기획 갱신 / 산출물 교차 검증 | planner / reviewer | + +## Phase 0: 컨텍스트 확인 (필수 선행) +1. `_workspace/` 존재 여부·`src/` 현황·`docs/IMPLEMENTATION_BACKLOG.md`를 확인해 실행 모드 판별: + - `_workspace/` 미존재 → **초기 실행**(Phase 1부터) + - `_workspace/` 존재 + 사용자가 부분 수정 요청 → **부분 재실행**(해당 에이전트/모듈만) + - `_workspace/` 존재 + 새 입력 → **새 실행**(기존 `_workspace/`를 `_workspace_prev/`로 이동) +2. **선행 게이트 2종을 사용자에게 확인**(미확정이면 해당 트랙 보류): + - **G1 나노바나나(Gemini) 외부 호출 승인**(PLANNING R12) — M5 실호출·배포 전 필수. 미승인 시 M5는 코드/구조만 작성하고 실 API 호출·배포 보류. + - **G2 배포 대상 서버·포트**(kintex는 GUARDiA 관제 인프라와 별개 도메인) — Phase 5 배포 전 확인. + +## Phase 1: 설계 정합 (파이프라인, 팀) +`TeamCreate` 후 아래를 `TaskCreate`로 배분(의존성 `blockedBy`): +1. **designer** — Stitch 산출물(`stitch_kintex_ai_system_architect/`) 학습 → `docs/design.md` 정합(디자인 시스템 단일 출처 수렴) + SCR 매핑표 + 범위 게이트(범위 밖 Stitch 화면 P2 표기). ★design.md 수정은 designer만. +2. **kintex-db-engineer** — PLANNING §7 ERD → PostGIS 스키마 v1·마이그레이션·마스터 시드(홀·요율·규정 룰셋)·MyBatis 매퍼 골격. 스키마 계약 `_workspace/01_db_schema.md`. +3. **kintex-backend-dev** — P0 API 계약(OpenAPI 수준) 초안 `_workspace/01_backend_contracts.md`(스키마 계약 참조). +→ 종료 시 reviewer가 기획-디자인-스키마-계약 정합 교차 검증. + +## Phase 2: P0 구현 (파이프라인 + 점진 QA) +IMPLEMENTATION_BACKLOG의 P0 에픽(M2·M3·M4·M5) 단위로 파이프라인. 각 모듈: +- **db → backend → frontend/visualizer → qa** 순으로 흐르되 모듈 간 독립 병렬(배리어 최소화). +- **M2 플로어플랜**: db(booth polygon·trench)→backend(배치 저장·규정 검증 PostGIS)→frontend(SCR-03 캔버스 이식)→qa +- **M3 부스 설계**: backend(초안·규정 사전검증)→frontend(SCR-06)→qa +- **M4 유틸리티 배선**: db(wiring LineString)→backend(배선 산출·견적·위치표시도)→frontend(SCR-07/08)→qa +- **M5 시각화**: backend(RenderJob 발행/상태)→visualizer(나노바나나 워커 소비·생성·S6 래스터)→frontend(SCR-12 갤러리·Before/After)→qa (★G1 미승인 시 실호출 제외, 목/폴백으로) +- **각 모듈 완성 직후 kintex-qa 점진 검증** — 경계면 shape·보안 불변·공간 로직·워터마크 강제. 실패 시 해당 에이전트에 SendMessage 반려. + +## Phase 3: P1 구현 +M1(홀 배정·요율 룰 엔진)·M6(마일스톤·서식)·M7(등록업체 매칭)·M9(정산·결제). Phase 2 패턴 반복. + +## Phase 4: P2 구현 +M8(물류 슬롯) + designer가 P2로 승격 판정한 Stitch 화면(BI·hall ops 등)은 planner 기획 반영 후에만. + +## Phase 5: 빌드·배포 (G2 게이트) +kintex-devops-dev — Spring jar + React 번들(+나노바나나 워커 서비스) 빌드, Gitea `zio/kintex` CI/CD·webhook·systemd. **G2(서버·포트)·G1(Gemini 승인) 확정 후 실배포**; 미확정 시 파이프라인 파일만 준비. + +## 데이터 전달 +태스크 기반(조율) + 파일 기반(`_workspace/{phase}_{agent}_{artifact}`) + 메시지 기반(실시간). 최종 산출물은 `src/`·`docs/`, 중간물은 `_workspace/` 보존. + +## 에러 핸들링 +1회 재시도 후 재실패 시 해당 결과 없이 진행하고 `_workspace/` 리포트에 누락 명시. 상충 데이터는 삭제 않고 출처 병기. 빌드/QA 실패는 통과까지 반려. + +## 테스트 시나리오 +- **정상**: "킨텍스 M2 구현" → Phase0 컨텍스트 확인 → Phase1 설계정합 → Phase2 M2(db→backend→frontend→qa) → QA 통과 → 보고. +- **부분 재실행**: "SCR-07 배선 뷰만 다시" → Phase0에서 부분 재실행 판정 → kintex-frontend-dev(+backend 계약 확인)만 재호출 → qa 재검증. +- **에러**: G1(Gemini) 미승인 상태로 "M5 구현" → M5 실호출 제외·구조만 작성, 사용자에게 승인 요청 에스컬레이션. + +## 후속 작업 +description의 후속 키워드로 재실행/부분수정/업데이트를 트리거한다. Phase 0의 컨텍스트 확인이 초기/새/부분 실행을 판별한다. diff --git a/.gitignore b/.gitignore index 8ae48a5..a5a9b32 100644 --- a/.gitignore +++ b/.gitignore @@ -13,3 +13,6 @@ output/ # OS Thumbs.db .DS_Store + +# Stitch export — 대용량 스크린샷 PNG 제외(로컬 참조 유지), code.html·DESIGN.md만 버전관리 +stitch_kintex_ai_system_architect/*/screen.png diff --git a/CLAUDE.md b/CLAUDE.md index cf84456..d99f20d 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -20,6 +20,19 @@ kintex/ └── src/ # 서비스 구현 (백엔드/프론트) — 이후 단계 ``` +## 기술 스택 (확정 2026-07-11 · 사용자 지정) + +| 레이어 | 기술 | +|--------|------| +| 프론트엔드 | **React 18/19 + Vite + TypeScript** (반응형: 데스크톱=설계/에디터, 모바일=조회·승인·현장) | +| 백엔드 | **Spring Boot 3.x (Java 17) + MyBatis** — REST + WebSocket(STOMP), 룰 엔진·배치/배선 엔진 | +| DB | **PostgreSQL (+ PostGIS)** — 부스 폴리곤·트렌치 포인트·배선 LineString 공간 데이터 | +| 비동기 | Redis 작업 큐 (RenderJob·서류·알림) | +| 이미지 생성 | **나노바나나 Python 워커 사이드카** (`tools/nanobanana`, google-genai + `gemini-3.1-flash-image-preview`) — Spring이 큐로 트리거, 결과는 오브젝트 스토리지 + WebSocket 완료 푸시 | +| 인증 | 행사 단위 RBAC(JWT) | + +GUARDiA 표준 프레임워크(Spring Boot 3.5 + React 19 + MyBatis + PostgreSQL)와 정렬. 상세 아키텍처는 `docs/PLANNING.md` §8. **신규 코드는 이 스택을 따른다** — developer 에이전트는 `src/` 구현 시 백엔드 Spring Boot/MyBatis, 프론트 React(Vite)를 사용하고, 나노바나나 호출은 `tools/nanobanana` Python 워커 모듈만 경유한다. + ## 에이전트 워크플로 작업은 아래 순서의 서브에이전트 체인으로 진행한다. 각 에이전트는 `.claude/agents/`에 정의되어 있다. @@ -42,6 +55,25 @@ kintex/ ## 참조 자산 +- `docs/PLANNING.md` — 시스템 기획서(v1.2, M1~M9 모듈·나노바나나 파이프라인). **기획 변경은 planner 경유.** +- `docs/design.md` — UI 디자인 스펙(14화면 Stitch 프롬프트). **디자인 변경은 designer 경유.** +- `docs/IMPLEMENTATION_BACKLOG.md` — 구현 백로그(Phase 0~5, 모듈별 작업·담당·의존) - `docs/analysis/kintex-website.md` — kintex.com 전체 페이지 분석 -- `docs/analysis/reroomai-source.md` — (예정) ReRoomAI 소스 분석. 소스 폴더(C:\GUARDiA\workspace\ReRoomAI) 연결 후 생성된다. 이 파일이 없으면 ReRoomAI 관련 기획은 "연계 예정"으로만 다룰 것. +- `docs/analysis/reroomai-source.md` — ReRoomAI 소스 분석(나노바나나 image-to-image·보존/교체 프롬프트 차용) - `docs/BACKLOG.md` — 검증 에이전트 지적사항 티켓 목록 +- `stitch_kintex_ai_system_architect/` — Stitch 생성 화면 18종·DESIGN.md 3종(designer 학습·정합화 참조) + +## 하네스: 구현 (kintex-impl-orchestrator) + +**목표:** PLANNING v1.2의 M1~M9를 React(Vite) + Spring Boot 3.x(Java17) + MyBatis + PostgreSQL(PostGIS) + Redis + 나노바나나 Python 워커로 P0(M2·M3·M4·M5)부터 구현. + +**트리거:** 킨텍스 구현·부스 배치/설계/배선/시각화 구현·백엔드/프론트/스키마 구현·Stitch 화면 이식·src 구현·배포·다시 실행·특정 모듈만 요청 시 `kintex-impl-orchestrator` 스킬을 사용하라. 단순 질문은 직접 응답 가능. + +**에이전트:** kintex-backend-dev · kintex-frontend-dev · kintex-db-engineer · visualizer(나노바나나 워커) · kintex-qa · kintex-devops-dev + designer · planner · reviewer + +**선행 게이트:** G1 나노바나나(Gemini) 외부 호출 승인(PLANNING R12) · G2 배포 대상 서버·포트(GUARDiA 인프라와 별개 도메인). + +**변경 이력:** +| 날짜 | 변경 내용 | 대상 | 사유 | +|------|----------|------|------| +| 2026-07-11 | 구현 하네스 초기 구성 — 전문 에이전트 6종 + kintex-impl-orchestrator + 구현 백로그 | 전체 | 범용 에이전트만 존재 → 스택(React/Spring/MyBatis/PostgreSQL) 확정 후 실제 구현 조율 팀 구성. developer 스택 갱신·designer에 Stitch 학습 트랙 추가 | diff --git a/docs/IMPLEMENTATION_BACKLOG.md b/docs/IMPLEMENTATION_BACKLOG.md new file mode 100644 index 0000000..382574d --- /dev/null +++ b/docs/IMPLEMENTATION_BACKLOG.md @@ -0,0 +1,97 @@ +# 킨텍스 AI 전시관리 시스템 — 구현 백로그 + +> 작성: 2026-07-11 · 근거: `docs/PLANNING.md` v1.2(M1~M9)·`docs/design.md`(SCR-01~M2)·`docs/analysis/reroomai-source.md`·Stitch 산출물(`stitch_kintex_ai_system_architect/`) +> 실행: `kintex-impl-orchestrator` 스킬(에이전트 팀). 담당 에이전트 약칭 — BE=kintex-backend-dev, FE=kintex-frontend-dev, DB=kintex-db-engineer, VIZ=visualizer(나노바나나 워커), QA=kintex-qa, DES=designer, OPS=kintex-devops-dev. +> 스택: React(Vite·TS) + Spring Boot 3.x(Java17)+MyBatis + PostgreSQL(PostGIS) + Redis + 나노바나나 Python 워커. + +## 선행 게이트 (착수 전 소유자 확인) +- **G1 나노바나나(Gemini) 외부 호출 승인**(PLANNING R12) — 미승인 시 M5는 코드/구조만, 실호출·배포 보류. +- **G2 배포 대상 서버·포트** — kintex는 GUARDiA 관제 인프라와 별개 도메인. 서버 재사용/포트/도메인 확정 필요(Phase 5 전). + +## Phase 0 — 프로젝트 스캐폴딩 (P0 선행) +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| S-1 | `src/backend` Spring Boot 3.x(Java17)+MyBatis+PostGIS 스캐폴드, `com.zioinfo.kintex` | BE | — | `./gradlew compileJava` 통과 | +| S-2 | `src/frontend` React 18/19+Vite+TS 스캐폴드 + design.md 토큰(팔레트·타이포) CSS 변수화 | FE | 설계정합 | `npm run build` 통과 | +| S-3 | `kintex_db`(PostGIS) 마이그레이션 도구(Flyway) + 공통 엔티티 DDL v1 | DB | — | 마이그레이션 적용·롤백 검증 | +| S-4 | 나노바나나 워커 서비스 골격(Redis 큐 소비 루프, `tools/nanobanana` 재사용) | VIZ | — | `py_compile` + 큐 소비 스텁 기동 | + +## Phase 1 — 설계 정합 +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| D-1 | Stitch 산출물 학습 → design.md 디자인 시스템 단일 출처 수렴 + SCR 매핑표 + 범위 게이트 | DES | — | design.md 갱신·매핑표·P2 표기 | +| D-2 | PostGIS 스키마 v1(Event/Hall/Booth polygon/DesignPlan/UtilityOrder LineString/RenderJob/Document/Company/Payment) + 마스터 시드(홀·요율·규정 룰셋) | DB | S-3 | `_workspace/01_db_schema.md` + 시드 멱등 | +| D-3 | P0 API 계약 초안(OpenAPI 수준) | BE | D-2 | `_workspace/01_backend_contracts.md` | +| D-4 | 정합 교차 검증(기획-디자인-스키마-계약) | reviewer | D-1..D-3 | 불일치 0 또는 티켓화 | + +## Phase 2 — P0 구현 (핵심) + +### M2 플로어플랜 스튜디오 (부스 배치 자동화) +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| M2-1 | Booth polygon·Hall·Trench 스키마·매퍼(ST_Area/ST_Buffer/ST_Intersects) | DB | D-2 | 공간 쿼리 단위 검증 | +| M2-2 | 배치 저장·조회 API + 규정 검증(통로 폭·바닥하중·비상구·복층) PostGIS 서비스 | BE | M2-1 | 위반 플래그(차단/경고) 응답 | +| M2-3 | 배치 자동생성(제약 솔버/휴리스틱) — 복수 배치안 | BE | M2-2 | 조건 입력→복수 안 | +| M2-4 | SCR-03 부스 배치 에디터(캔버스 다크서피스·드래그·트렌치·위반 오버레이) — Stitch `booth_layout_editor` 이식 | FE | M2-2 | 드래그·위반핀↔목록 동기 | +| M2-5 | SCR-04 배치안 비교(S7 조감 카드) — Stitch `layout_comparison` 이식 | FE | M2-3, M5-1 | 지표 비교·선택 | +| M2-6 | 점진 QA(경계면·공간 로직·규정 룰셋 정합) | QA | M2-* | 통과까지 반려 | + +### M3 부스 설계 스튜디오 +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| M3-1 | 부스 설계(조립 옵션/독립 초안)·규정 사전검증(높이5m·리깅D-7·방염·복층) API | BE | D-2 | 위반 사전 플래깅 | +| M3-2 | SCR-06 설계 스튜디오(스펙 폼·4샷 그리드·Before/After) — Stitch `booth_design_studio` 이식 | FE | M3-1, M5-1 | 컨펌 흐름·"시공기준=도면" 동의 | +| M3-3 | SCR-09 규정 검증 리포트 — Stitch `compliance_report` 이식 | FE | M3-1 | 차단 시 제출 비활성·면책·룰셋 버전 | +| M3-4 | 점진 QA | QA | M3-* | 통과 | + +### M4 유틸리티 설계 (전기·조명 / 네트워크·급배수) +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| M4-1 | Wiring LineString 스키마·최단 배선(ST_Distance/트렌치 라우팅) 매퍼 | DB | D-2 | 최단 경로 쿼리 | +| M4-2 | 전기 용량·분전반 산출 + 네트워크/급배수 배선 + 자동 견적 API | BE | M4-1 | kW 합산·요금 정합 | +| M4-3 | 위치표시도 자동 생성(수기 작도 대체 서식) | BE | M4-2 | PDF/이미지 산출 | +| M4-4 | SCR-07 배선 뷰(트렌치 오버레이·견적 패널) — Stitch `utility_wiring_view` 이식 | FE | M4-2 | 단말 드래그→경로 재계산 | +| M4-5 | SCR-08 신청 요약·위치표시도 — Stitch `utility_order_summary` 이식 | FE | M4-3 | 마감(D-25) 고지·제출 | +| M4-6 | 점진 QA(견적 산술·"현장 추가불가" 고지·좌표 정합) | QA | M4-* | 통과 | + +### M5 나노바나나 시각화 (★G1 게이트) +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| M5-1 | RenderJob 발행/상태 API + Redis 큐 + WebSocket 완료 푸시 | BE | D-2 | 큐잉·상태 전이 | +| M5-2 | 나노바나나 워커: PLANNING §6-2 scene→build_booth_prompt→생성, 메타데이터 임베드·워터마크·스키마 해시 캐시(`tools/nanobanana` 재사용) | VIZ | M5-1, S-4 | (G1 승인 시) 실 생성 / 미승인 시 목·폴백 | +| M5-3 | S6 배선 오버레이 래스터 합성(생성형 아님, PIL 좌표 정합) | VIZ | M4-1, M5-2 | 도면 위 적/청/녹 오버레이 | +| M5-4 | SCR-12 시각화 갤러리(S1~S7·Before/After·워터마크 상시) — Stitch `visualization_gallery` 이식 | FE | M5-1 | 온디맨드 생성·재시도·고지바 | +| M5-5 | 점진 QA(워터마크 강제·서류 배제·캐시·쿼터) | QA | M5-* | 통과 | + +### 공통 화면 (P0 대시보드·인증) +| ID | 작업 | 담당 | 의존 | 완료 기준 | +|---|---|---|---|---| +| C-1 | 인증(행사 단위 RBAC+JWT) API + SCR-01 로그인/워크스페이스 — Stitch `login_workspace_selection` 이식 | BE, FE | S-1,S-2 | 미등록 장치업체 초대 차단 | +| C-2 | SCR-02 주최자 대시보드(마일스톤 타임라인·KPI) — Stitch `organizer_dashboard` 이식 | FE | C-1 | D-데이·KPI 렌더 | +| C-3 | SCR-05 참가업체 부스 홈 — Stitch `exhibitor_home` 이식 | FE | C-1 | 진행 스테퍼·마감 리마인더 | +| C-4 | SCR-10 홀매니저 승인 큐 / SCR-11 검수 상세 — Stitch `manager_approval_queue`·`review_details` 이식 | FE | M2-2,M3-1 | AI 사전심사 플래그·일괄승인 | +| C-5 | SCR-M1 현장 체크리스트 / SCR-M2 현장 검수(모바일) — Stitch `contractor_on_site_checklist`·`manager_field_inspection` 이식 | FE | C-1 | 오프라인·48px 터치 | + +## Phase 3 — P1 +| ID | 작업 | 담당 | 완료 기준 | +|---|---|---|---| +| P1-M1 | 홀 배정·자동 견적(요율 룰 엔진: 성수기·전시장 할증·예치금) | BE, FE, DB | 즉시 견적·배정신청서 생성 | +| P1-M6 | 마일스톤(D-150/30/25/7)·서식 자동생성·AI 서류 검수 | BE, FE | 마일스톤 역산·검수 리포트 | +| P1-M7 | 등록업체(739) 매칭·RFQ — 미등록 시공 차단 | BE, FE, DB | 추천·견적요청 | +| P1-M9 | 정산·결제(납부 스케줄·PG·예치금 정산) | BE, FE | 스케줄 알림·PG 연동 | + +## Phase 4 — P2 +| ID | 작업 | 담당 | 비고 | +|---|---|---|---| +| P2-M8 | 반입/반출 물류 슬롯·QR 통행증 | BE, FE | 운영팀 협업 전제 | +| P2-X | Stitch 범위밖 화면(BI·hall ops·exhibition schedule·admin) | DES→planner | 기획 반영 후에만 P 승격 | + +## Phase 5 — 빌드·배포 (G2 게이트) +| ID | 작업 | 담당 | 완료 기준 | +|---|---|---|---| +| DEP-1 | Spring jar + React 번들(+워커 서비스) 빌드 파이프라인 | OPS | 로컬/서버 빌드 통과 | +| DEP-2 | Gitea `zio/kintex` CI/CD·webhook·systemd·env(GEMINI_API_KEY 서버 env) | OPS | (G2 확정 후) push→배포 | + +## 진행 규칙 +- **각 모듈 완성 직후 QA 점진 검증**(전체 완성 후 1회 아님). 보안 불변(자격증명·스택트레이스 미노출·AI 워터마크 강제)은 반려 사유. +- 기획 변경은 planner, 디자인 변경은 designer 경유(직접 수정 금지). diff --git a/docs/PLANNING.md b/docs/PLANNING.md index f991de6..bf3801e 100644 --- a/docs/PLANNING.md +++ b/docs/PLANNING.md @@ -431,20 +431,21 @@ Render this exhibition booth as if construction is complete. ## 8. 아키텍처 개요 -전제 스택: **FastAPI + PostgreSQL(PostGIS) + 비동기 이미지 생성 큐 + Next.js**. +전제 스택 (확정, GUARDiA 표준 프레임워크 정렬): **React 18/19(Vite·TypeScript) + Spring Boot 3.x(Java 17) + MyBatis + PostgreSQL(PostGIS) + Redis 작업 큐 + 나노바나나 Python 워커 사이드카**. ```mermaid graph LR subgraph Frontend - WEB[Next.js 웹
반응형: 데스크톱=설계, 모바일=조회·승인·현장] + WEB[React 18/19 웹 (Vite·TS)
반응형: 데스크톱=설계·에디터, 모바일=조회·승인·현장] CANVAS[플로어플랜 캔버스
SVG/WebGL 편집기] end subgraph Backend - API[FastAPI
REST + WebSocket 진행 알림] - RULE[룰 엔진
규정 검증·요율 계산] - LAYOUT[배치·배선 엔진
제약 솔버, PostGIS 연산] - QUEUE[비동기 큐 Redis/RQ
이미지 생성·서류 생성·알림] - NB[nanobanana 워커
tools/nanobanana 모듈] + API[Spring Boot 3.x (Java 17)
REST + WebSocket/STOMP 진행 알림] + RULE[룰 엔진
규정 검증·요율 계산 (서비스 계층)] + LAYOUT[배치·배선 엔진
제약 솔버 + PostGIS 공간 SQL] + MYB[MyBatis
매퍼·공간 SQL 바인딩] + QUEUE[비동기 작업 큐 Redis
RenderJob·서류 생성·알림] + NB[나노바나나 Python 워커 사이드카
tools/nanobanana · google-genai SDK] end subgraph Data PG[(PostgreSQL + PostGIS
공간 데이터·업무 데이터)] @@ -454,17 +455,20 @@ graph LR CANVAS --> API API --> RULE API --> LAYOUT + API --> MYB --> PG + LAYOUT --> MYB API --> QUEUE --> NB --> OBJ - API --> PG - LAYOUT --> PG + NB -.완료 푸시(WebSocket).-> API NB -.Gemini API.-> EXT[Google Gemini] ``` -- **공간 데이터 일원화**: 부스 폴리곤·트렌치 포인트·배선 경로를 PostGIS 지오메트리로 저장 — 최단 배선(라우팅), 통로 폭 검증(버퍼 연산), 면적 정산이 모두 SQL 수준에서 수행. -- **이미지 생성은 전면 비동기**: RenderJob 큐잉 → 워커가 Gemini 호출 → WebSocket으로 완료 푸시. 재시도·비용 상한·스키마 해시 캐시를 워커 레벨에서 관리. -- **룰 엔진 분리**: 규정(높이·방염·하중)과 요율을 코드가 아닌 버전 관리되는 룰셋 데이터로 유지 — 킨텍스 규정 개정(연 단위 요율 변경 등) 대응. -- **모바일**: 별도 앱이 아닌 반응형 웹 우선. 현장 시나리오(홀매니저 검수 체크, 참가업체 승인, 반입 QR)는 모바일 뷰 최적화. UI 상세는 후속 `docs/design.md`. -- 인증: 행사 단위 RBAC(2장 권한 모델). 도면·설계 데이터는 행사 종료 후 보존 정책 별도 정의(참가업체 자산). +- **백엔드 = Spring Boot 3.x(Java 17) + MyBatis**: REST API와 실시간 진행 알림은 Spring Web + WebSocket(STOMP)로 처리. 룰 엔진(규정·요율)과 배치/배선 엔진은 Spring 서비스 계층으로 두고, 공간 연산은 MyBatis 매퍼가 바인딩하는 **PostgreSQL PostGIS 공간 SQL**(부스 폴리곤·트렌치 포인트·배선 LineString)로 수행. +- **공간 데이터 일원화**: 부스 폴리곤·트렌치 포인트·배선 경로를 PostGIS 지오메트리로 저장 — 최단 배선(라우팅), 통로 폭 검증(버퍼 연산), 면적 정산이 모두 SQL 수준에서 수행. MyBatis가 `ST_*` 함수 호출을 매퍼 XML로 관리. +- **프론트 = React 18/19(Vite·TypeScript)**: 반응형(데스크톱=설계/에디터, 모바일=조회·승인·현장). 플로어플랜 캔버스는 SVG/WebGL. 현장 시나리오(홀매니저 검수 체크, 참가업체 승인, 반입 QR)는 모바일 뷰 최적화. UI 상세는 후속 `docs/design.md`. +- **이미지 생성은 전면 비동기 — Python 워커 사이드카**: Spring 백엔드가 RenderJob을 Redis 작업 큐에 넣으면 **별도 Python 워커(`tools/nanobanana`)** 가 소비해 Gemini(google-genai Python SDK)로 이미지를 생성하고, 결과를 오브젝트 스토리지에 적재한 뒤 WebSocket으로 완료를 푸시한다. 서류/알림 생성도 동일 큐를 경유. 재시도·비용 상한·스키마 해시 캐시는 워커 레벨에서 관리. + - **Python 워커 유지 근거**: 나노바나나 호출 스택(client.py)은 방금 ReRoomAI 검증 패턴으로 확정되었고 **google-genai는 Python SDK**를 사용한다(§6-4). 이를 Java로 재구현하면 검증된 방어 로직·프롬프트 조립을 이식·재검증하는 비용이 발생하므로, image-to-image 파이프라인은 **Python 워커 사이드카로 유지**하고 Spring 백엔드는 큐·오케스트레이션·상태 관리만 담당한다(Java 재구현 대신 얇은 큐 계약으로 결합). +- **룰 엔진 분리**: 규정(높이·방염·하중)과 요율을 코드가 아닌 버전 관리되는 룰셋 데이터로 유지 — 킨텍스 규정 개정(연 단위 요율 변경 등) 대응. Spring 서비스 계층이 룰셋을 로드·평가. +- 인증: 행사 단위 RBAC(2장 권한 모델) + JWT. 오브젝트 스토리지에 도면·생성 이미지·서식 적재. 도면·설계 데이터는 행사 종료 후 보존 정책 별도 정의(참가업체 자산). --- @@ -523,3 +527,4 @@ graph LR |---|---|---|---| | v1.0 | 2026-07-11 | planner | 최초 작성 — kintex-website.md 분석 기반 전체 기획. ReRoomAI 소스 분석(reroomai-source.md)은 추가 시 6장 갱신 예정 | | v1.1 | 2026-07-11 | planner | ReRoomAI 소스 분석 반영. ①§6 나노바나나 파이프라인 제어 파라미터 확정 — 모델 `gemini-3.1-flash-image-preview`(나노바나나 2)·`@google/genai` SDK·image-to-image(inlineData+text parts) 호출 스택, 구조화 사전(BOOTH_TYPES·BOOTH_STYLES·FIXTURE_LAYERS) + "보존/교체 명시 분리" 부스 프롬프트 템플릿(§6-4), Canvas 1024px 전처리·RenderJob 방어 로직(크기 가드·SAFETY·에러 분기·성공 시에만 쿼터 차감)·단계별 로딩 UX 신설(§6-5). ②S6 배선 오버레이 백엔드 래스터 합성 우선 명확화(§6-3). ③§7 마스터 데이터 순증 반영(기본부스 표준 품목·프리미엄 6×3×4m 2kW·조명 반입 금지·이격 30/60cm·옥외 2,849㎡·홀6 93×60×10m·제3전시장 홀11~18). ④§10 R11 해소, R12(Gemini 외부 API 미승인·소유자 승인 게이트) 추가. BACKLOG B-11 done, B-09 정리 | +| v1.2 | 2026-07-11 | planner | **기술 스택 확정 — React + Spring Boot 3.x(Java 17) + MyBatis + PostgreSQL(PostGIS), 나노바나나 Python 워커 사이드카. GUARDiA 표준 프레임워크 정렬(사용자 지정).** §8 아키텍처 전면 정합화: 백엔드 FastAPI→Spring Boot 3.x + MyBatis(REST + WebSocket/STOMP, 룰·배치/배선 엔진=서비스 계층 + PostGIS 공간 SQL), 프론트 Next.js→React 18/19(Vite·TS, SVG/WebGL 캔버스), 비동기 큐 Redis 유지 + 이미지 생성은 별도 **Python 워커 사이드카(`tools/nanobanana`, google-genai Python SDK)** 로 분리(Spring이 RenderJob 큐잉→Python 워커 소비·생성→오브젝트 스토리지 적재→WebSocket 완료 푸시, 서류·알림도 동일 큐). Python 워커 유지 근거 명시(ReRoomAI 검증 client.py·Python SDK — Java 재구현 회피). 인증(행사 단위 RBAC+JWT)·오브젝트 스토리지 유지. §8 mermaid 갱신. **기능 범위(M1~M9)·우선순위·나노바나나 파이프라인 로직 불변** — 스택 표기 정합화만 수행 | diff --git a/stitch_kintex_ai_system_architect/admin_dashboard_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/admin_dashboard_kintex_ai_system/code.html new file mode 100644 index 0000000..7dbfd12 --- /dev/null +++ b/stitch_kintex_ai_system_architect/admin_dashboard_kintex_ai_system/code.html @@ -0,0 +1,422 @@ + + + + + +KINTEX AI CMS - Dashboard + + + + + + + + + + + + + +
+
+
+

System Overview

+

Real-time metrics and operations status.

+
+ +
+ +
+ +
+
+
+event +
++2 this week +
+
+

Total Exhibitions (Active)

+

14

+
+
+ +
+
+
+groups +
++12% vs yesterday +
+
+

Real-time Visitors

+

24,592

+
+
+ +
+
+
+local_parking +
+High Capacity +
+
+

Parking Availability

+
+

18%

+

/ 8,400 spots

+
+
+
+
+
+
+
+
+ +
+
+

Visitor Trends (Today)

+
+ + +
+
+ +
+ +
+10k +7.5k +5k +2.5k +0 +
+ +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+ +
+09:00 +11:00 +13:00 +15:00 +17:00 +19:00 +
+
+
+ +
+
+

Current Live Events

+View All +
+ +
+
+ +
+
+
+ +Live Now +
+

P1Harmony Fan Meeting

+

Hall 2, Exhibition Center I

+
+schedule + 14:00 - 18:00 +
+
+
+ +
+
+ +
+
+
+ +Live Now +
+

Vernon The 8 Live

+

Grand Ballroom, Center II

+
+schedule + 19:00 - 22:30 +
+
+
+ +
+
+
+ +Setting Up +
+
+

Seoul Motor Show Prep

+

Halls 1-5, Exhibition Center I

+
+
+
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/booth_design_studio_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/booth_design_studio_kintex_ai_system/code.html new file mode 100644 index 0000000..568d346 --- /dev/null +++ b/stitch_kintex_ai_system_architect/booth_design_studio_kintex_ai_system/code.html @@ -0,0 +1,351 @@ + + + + + +부스 디자인 스튜디오 - KINTEX AI + + + + + + + + + + + +
+ +
+
+
+arrow_back +부스 A-102 · 독립부스 6×3m · 높이 제한 5m +
+
+ +
+
+ +
+
+ +
+ + + +
+ +
+ + +
+ +
+
+ +
+S1 부스 정면 +
+S1 부스 정면 +
+
+auto_awesome + AI 생성 예상 이미지 +
+
+ +
+S2 야간 점등 +
+S2 야간 점등 +
+
+ +
+S3 통로 뷰 +
+S3 통로 뷰 +
+
+ +
+
+add_photo_alternate +
+S4 부스 내부 + +
+
+ +
+
시공 전
+
시공 후
+
+ +
+ +
+ +
+swap_horiz + +
+
+
+ +
+
+
+ +통과 11 +
+
+
+ +경고 1 +
+
+ +
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/booth_layout_editor_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/booth_layout_editor_kintex_ai_system/code.html new file mode 100644 index 0000000..039efc2 --- /dev/null +++ b/stitch_kintex_ai_system_architect/booth_layout_editor_kintex_ai_system/code.html @@ -0,0 +1,484 @@ + + + + + +Floor Plan Editor - KINTEX AI 전시관리 + + + + + + + + + + + +
+ +
+
+
+

제1전시장 1홀

+chevron_right +
+
+배치안 B · v3 +arrow_drop_down +
+ +cloud_done + 저장됨 + +
+
+ + + +
+
+ +
+ + + +
+ +
+ + + +
+ +
+ +
+ +
+0m +63m +126m +
+
+0m +45m +90m +
+ +
+close +
+
+close +
+ +
+
+
+
+ +
+
A-101
+
A-102
+
A-103
+
A-104
+
A-105
+
A-106
+
+
+
B-101
+
B-102
+
B-103
+
B-104
+
+ +
+ PREMIUM A +
+
+ PREMIUM B +
+ +
+
C-101
+
C-102
+
C-103
+
C-104
+
+ + +
+
1
+
+ +
+
2
+
+ +
+
3
+
+
+
+ +
+
+부스 486 / 510 + +판매면적 4,374㎡ +
+
+ +100% + +
+
+
+ + +
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/business_intelligence_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/business_intelligence_kintex_ai_system/code.html new file mode 100644 index 0000000..81a6ac2 --- /dev/null +++ b/stitch_kintex_ai_system_architect/business_intelligence_kintex_ai_system/code.html @@ -0,0 +1,451 @@ + + + + + +Business Intelligence - KINTEX CMS + + + + + + + + + + + +
+ +
+ + + +
+ + +
+ + +
+
+
+ +
+ +
+
+

Analytics Reports

+

Exhibition Organizer & Exhibitor Insights

+
+
+ + +
+
+ +
+ +
+ +
+
+Total Visitors +groups +
+
45,210
+
+trending_up ++12.5% vs last event +
+
+ +
+
+Avg Dwell Time +schedule +
+
4h 15m
+
+trending_up ++45m vs last event +
+
+ +
+
+Matching Success +handshake +
+
87.3%
+
+insights +AI-driven matches +
+
+
+ +
+
+

Exhibitor vs Buyer Matching Trends

+ +
+ +
+
+ + + + + +
Chart Visualization Area
+
+
+ +
+

Industry Trend Analysis

+
+ +
+
+Technology & IT +45% +
+
+
+
+
+ +
+
+Manufacturing +28% +
+
+
+
+
+ +
+
+Healthcare +15% +
+
+
+
+
+ +
+
+Retail & E-commerce +12% +
+
+
+
+
+
+
+ +
+
+

Top Exhibitor Performance

+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Exhibitor NameBooth LocationTotal VisitorsMatches MadeStatus
TechNova SolutionsHall 1 - A121,24584 +Excellent +
Global Manufacturing Inc.Hall 2 - B0498062 +Good +
HealthSys ProvidersHall 3 - C2275045 +Average +
Retail Innovations LLCHall 1 - D0152030 +Needs Review +
+
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/compliance_report_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/compliance_report_kintex_ai_system/code.html new file mode 100644 index 0000000..e4750f3 --- /dev/null +++ b/stitch_kintex_ai_system_architect/compliance_report_kintex_ai_system/code.html @@ -0,0 +1,348 @@ + + + + + +규정 검증 결과 - KINTEX AI + + + + + + + + + + + +
+
+ +
+
+Exhibitor Management +chevron_right +Documents +
+

부스 A-102 · 설계 v2 · 규정 검증 결과

+ +
+error +차단 1건 · 경고 2건 · 통과 14건 — 차단 항목 해결 전 제출 불가 +
+
+ +
+
+upload_file +
+
+기존 도면 업로드 (PDF/이미지) +참고용 검증 +
+

드래그 앤 드롭 또는 클릭하여 파일 선택

+
+ +
+ +
+
+

자동 검증 체크리스트

+
+차단 +경고 +통과 +
+
+
+ +
+
+straighten +높이 규정 +
+
+
+cancel +
+

장치물 높이 5m 이하

+

측정 5.4m — 0.4m 초과

+
+
+ + 차단 + +
+
+ +
+
+architecture +리깅 (Rigging) +
+
+
+warning +
+

리깅 트러스 하중 및 구조체 확인

+

도면상 리깅 포인트 확인됨. 규정 하중 내인지 증빙 필요.

+
+
+ +auto_awesome + 구조계산서 D-7 제출 필요 + +
+
+ +
+
+layers +복층 구조 +
+
+
+check_circle +
+

복층 면적 제한 (전체 부스 면적의 50% 이하)

+

측정 30% (통과)

+
+
+
+
+ +
+
+local_fire_department +방염 규정 +
+
+
+
+check_circle +

목공 마감재 방염 처리

+
+
+
+
+check_circle +

바닥재(파이텍스) 방염 성능

+
+
+
+
+ +
+
+block +금지작업 +
+
+
+check_circle +
+

용접 및 현장 도장 작업 금지

+

도면 내 특이사항 없음

+
+
+
+
+
+
+ +
+
+

설계 도면 검토 (Elevation)

+
+ + +
+
+
+ +
+ +
+ +
+ +
+warning + 5.4m (초과) + +
+
+
+ +
+
+
+
+
+
+
+ +
+
+info +

본 검증은 사전 필터이며 최종 승인은 킨텍스·구조기술사 판단 · v1.0

+
+ +
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/contractor_on_site_checklist_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/contractor_on_site_checklist_kintex_ai_system/code.html new file mode 100644 index 0000000..5ebf386 --- /dev/null +++ b/stitch_kintex_ai_system_architect/contractor_on_site_checklist_kintex_ai_system/code.html @@ -0,0 +1,314 @@ + + + + + +KINTEX AI - Booth Construction Checklist + + + + + + + + + + +
+
+
+ +
+

부스 A-102

+
+홀7 + +장치 1일차 +
+
+
+ +
+cloud_off +오프라인 +
+
+ +
+ + +
+
+ +
+ +
+info +필수 항목 3개 남음 +
+ +
+ +
+ +
+ +
+방염 확인서 제출 확인 +
+
+ +
+ +
+안전모 및 보호장구 착용 +
+
+
+
+ +
+
+warning +

장내 금지 작업 주의

+
+
    +
  • 금지: 전기톱, 용접, 페인트 작업
  • +
  • 소음 한도: 70~75dB 준수
  • +
+
+ +
+ +
+ +
+ + + +
+ +
+ + + +
+
+
+ +
+ +
+
+ +
+ +m +
+
+
+
+
+ +
+
+ +sync + 오프라인 — 연결 시 동기화 + +
+ +
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/exhibition_schedule_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/exhibition_schedule_kintex_ai_system/code.html new file mode 100644 index 0000000..e33255f --- /dev/null +++ b/stitch_kintex_ai_system_architect/exhibition_schedule_kintex_ai_system/code.html @@ -0,0 +1,329 @@ + + + + + +Exhibition Schedule - KINTEX CMS + + + + + + + + + + + +
+ +
+
+menu +KINTEX CMS +
+ +
+ + +
+notifications +account_circle +
+
+
+ +
+
+

Exhibition Schedule

+

Manage and monitor all scheduled events across KINTEX halls.

+
+ +
+
+ + + +
+
+ + +
+
+ +
+ +
+ +
+
+Comic World Summer 2026 Poster +
+
+
+
+

Comic World Summer 2026

+Ongoing +
+

Culture & Arts Festival

+
+
event Aug 15 - Aug 18, 2026
+
location_on Hall 1, 2, 3
+
groups Est. 50,000
+
+
+
+ + +
+
+
+ +
+
+
+
+
+
+
+

Smart Factory Expo

+Upcoming +
+

Trade & Industry Exhibition

+
+
event Sep 05 - Sep 08, 2026
+
location_on Hall 4, 5
+
groups Est. 25,000
+
+
+
+ + +
+
+
+
+ +
+ +
+
+

August 2026

+
+chevron_left +chevron_right +
+
+
+
S
M
T
W
T
F
S
+
+
+
26
27
28
29
30
31
1
+ +
2
3
4
5
6
7
8
+
9
10
11
12
13
14
15
+
+
+ +
+

Hall Utilization (Aug)

+
+
+
+Hall 1-3 +85% +
+
+
+
+
+
+
+Hall 4-5 +40% +
+
+
+
+
+
+
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/exhibitor_home_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/exhibitor_home_kintex_ai_system/code.html new file mode 100644 index 0000000..673f574 --- /dev/null +++ b/stitch_kintex_ai_system_architect/exhibitor_home_kintex_ai_system/code.html @@ -0,0 +1,301 @@ + + + + + +Exhibitor Home - KINTEX AI + + + + + + + + + + + + +
+ +
+
+

(주)한빛로보틱스

+
+부스 A-102 +· +독립부스 6×3m +· +홀7 +
+
+
+
+
+
+
+ +
+
+ +
+ +
+
+check +
+신청 +
+ +
+
+
+
+승인 +설계 승인 대기중 +
+ +
+
3
+시공 +
+ +
+
4
+검수 +
+
+
+
+ +
+

해야 할 일

+ +
+
+
+D-6 +
+

유틸리티 신청 마감

+

인터넷 회선은 현장 추가 신청이 불가합니다

+
+ +
+
+
+D-15 +
+

장치업체 초대하기

+
+ +
+
+

설계 컨펌 대기 1건

+ +
+ +
+

비용 요약

+
+
+전기 5kW +
+₩275,000 +신청됨 +
+
+
+인터넷 1회선 +
+₩150,000 +작성중 +
+
+
+
+
+ +
+
+

+ 내 부스 예상 사진 + auto_awesome +

+
+
+
+

AI 생성 예상 이미지 — 실제 시공 결과와 다를 수 있음

+
+
+ + +
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/hall_operations_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/hall_operations_kintex_ai_system/code.html new file mode 100644 index 0000000..111530e --- /dev/null +++ b/stitch_kintex_ai_system_architect/hall_operations_kintex_ai_system/code.html @@ -0,0 +1,441 @@ + + + + + +KINTEX CMS - Smart Hall Operations + + + + + + + + + + + +
+ +
+ + +
+ + +
+
+
+ +
+
+
+

Smart Hall Operations

+

Real-time facility monitoring and resource optimization.

+
+
+ + +
+
+ +
+ +
+
+

+groups + Live Crowd Density Heatmap +

+
+ +
+
+
+ +
+ +
+ +
+
+
+ +
+
Hall 1
+
Hall 2
+
Hall 3 (High)
+
Hall 4
+
Hall 5
+
+
+
+
+
+ Low + Moderate + High +
+Total Est. Attendance: 14,250 +
+
+ +
+ +
+

+air + HVAC Optimization +

+
+22.5°C +Avg Temp +
+
+
+
+
+
+Power Draw +4.2 MW +
+
+Status + +check_circle Optimal + +
+
+
+ +
+

+lightbulb + Lighting Zones +

+
+
+Exhibition Halls +85% ON +
+
+
+
+
+Public Concourses +100% ON +
+
+
+
+
+
+Auto-dimming active +
+
+
+
+
+
+ +
+
+

+local_parking + Parking Occupancy Status +

+Updated: Just now +
+
+ +
+
+
+
+

Zone A (Underground)

+VIP / Exhibitors +
+98% +
+
+1,176 +/ 1,200 +
+
+ +
+
+
+
+

Zone B (Outdoor South)

+General Public +
+75% +
+
+2,250 +/ 3,000 +
+
+ +
+
+
+
+

Zone C (Outdoor North)

+General Public +
+42% +
+
+1,050 +/ 2,500 +
+
+ +
+
+
+
+

Loading Docks 1-5

+Freight Only +
+20% +
+
+12 +/ 60 bays +
+
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/kintex_ai_intelligence_system/DESIGN.md b/stitch_kintex_ai_system_architect/kintex_ai_intelligence_system/DESIGN.md new file mode 100644 index 0000000..71152ee --- /dev/null +++ b/stitch_kintex_ai_system_architect/kintex_ai_intelligence_system/DESIGN.md @@ -0,0 +1,182 @@ +--- +name: Kintex AI Intelligence System +colors: + surface: '#f9f9fc' + surface-dim: '#dadadc' + surface-bright: '#f9f9fc' + surface-container-lowest: '#ffffff' + surface-container-low: '#f3f3f6' + surface-container: '#eeeef0' + surface-container-high: '#e8e8ea' + surface-container-highest: '#e2e2e5' + on-surface: '#1a1c1e' + on-surface-variant: '#424751' + inverse-surface: '#2f3133' + inverse-on-surface: '#f0f0f3' + outline: '#727782' + outline-variant: '#c2c6d3' + surface-tint: '#115fac' + primary: '#00427d' + on-primary: '#ffffff' + primary-container: '#0059a6' + on-primary-container: '#b6d1ff' + inverse-primary: '#a6c8ff' + secondary: '#5427e6' + on-secondary: '#ffffff' + secondary-container: '#6d4aff' + on-secondary-container: '#f3edff' + tertiary: '#004950' + on-tertiary: '#ffffff' + tertiary-container: '#00636b' + on-tertiary-container: '#65e2ef' + error: '#ba1a1a' + on-error: '#ffffff' + error-container: '#ffdad6' + on-error-container: '#93000a' + primary-fixed: '#d5e3ff' + primary-fixed-dim: '#a6c8ff' + on-primary-fixed: '#001c3b' + on-primary-fixed-variant: '#004786' + secondary-fixed: '#e5deff' + secondary-fixed-dim: '#c9bfff' + on-secondary-fixed: '#1b0063' + on-secondary-fixed-variant: '#4500d8' + tertiary-fixed: '#87f3ff' + tertiary-fixed-dim: '#59d8e5' + on-tertiary-fixed: '#001f23' + on-tertiary-fixed-variant: '#004f55' + background: '#f9f9fc' + on-background: '#1a1c1e' + surface-variant: '#e2e2e5' + ai-surface: '#F5F3FF' + status-safe: '#2ECC71' + status-warning: '#F1C40F' + status-alert: '#E74C3C' + surface-muted: '#F8FAFC' +typography: + display-lg: + fontFamily: Hanken Grotesk + fontSize: 48px + fontWeight: '700' + lineHeight: '1.2' + letterSpacing: -0.02em + display-lg-mobile: + fontFamily: Hanken Grotesk + fontSize: 32px + fontWeight: '700' + lineHeight: '1.2' + headline-lg: + fontFamily: Hanken Grotesk + fontSize: 32px + fontWeight: '600' + lineHeight: '1.3' + headline-md: + fontFamily: Hanken Grotesk + fontSize: 24px + fontWeight: '600' + lineHeight: '1.4' + body-lg: + fontFamily: Hanken Grotesk + fontSize: 18px + fontWeight: '400' + lineHeight: '1.6' + body-md: + fontFamily: Hanken Grotesk + fontSize: 16px + fontWeight: '400' + lineHeight: '1.6' + body-sm: + fontFamily: Hanken Grotesk + fontSize: 14px + fontWeight: '400' + lineHeight: '1.5' + label-md: + fontFamily: Hanken Grotesk + fontSize: 14px + fontWeight: '600' + lineHeight: '1' + letterSpacing: 0.05em + code-sm: + fontFamily: Courier Prime + fontSize: 13px + fontWeight: '400' + lineHeight: '1.4' +rounded: + sm: 0.125rem + DEFAULT: 0.25rem + md: 0.375rem + lg: 0.5rem + xl: 0.75rem + full: 9999px +spacing: + unit: 4px + gutter: 24px + margin-mobile: 16px + margin-desktop: 48px + container-max: 1440px +--- + +## Brand & Style + +The design system is engineered for the intersection of industrial facility management and advanced artificial intelligence. It adopts a **Corporate / Modern** aesthetic that prioritizes reliability, precision, and efficiency. The target audience includes exhibition managers, technical engineers, and corporate stakeholders who require high-density information delivery without cognitive overload. + +The visual narrative balances the "stability" of traditional infrastructure management with the "intelligence" of AI integration. By utilizing a clean, structured layout with subtle technological accents, the UI evokes a sense of trustworthy authority and forward-thinking innovation. White space is used strategically to maintain clarity in complex data environments, ensuring that "human-centric" service remains at the forefront of "technology-driven" operations. + +## Colors + +The palette is anchored by **Corporate Blue (#0059A6)**, representing the established heritage of KINTEX and professional facility management. This is contrasted by **AI-Accent Purple (#6D4AFF)**, which is reserved exclusively for intelligent features, automated insights, and predictive maintenance indicators. + +**Neutral tones** are predominantly cool grays to maintain a technical feel. Surface colors utilize a tiered approach: white for primary cards, and `surface-muted` for background grouping. The `ai-surface` is a very subtle purple tint used to highlight dashboard sections or components that are actively powered by AI, providing a clear visual cue for "smart" versus "manual" data. + +## Typography + +The typography system relies on **Hanken Grotesk** to provide a sharp, contemporary, and highly legible experience across both digital interfaces and technical reports. For Korean text, **Pretendard** is the designated fallback, ensuring consistent weights and optical balance. + +Hierarchy is strictly enforced to manage high-density data. Headlines use a tighter letter-spacing to appear more cohesive and authoritative. Labels use all-caps and increased tracking for utility-based navigation and metadata tags. For logs and technical ID strings, a monospaced font is utilized to differentiate system data from user-readable content. + +## Layout & Spacing + +This design system employs a **Fixed Grid** model for desktop, centered within a 1440px container to ensure readability of data tables and management dashboards. A 12-column grid is standard, allowing for flexible layouts of 2, 3, 4, or 6 units. + +For exhibition management tasks, a **High-Density** spacing rhythm is utilized (4px base unit). +- **Desktop:** 24px gutters with 48px page margins. +- **Tablet:** 16px gutters with 32px page margins. +- **Mobile:** 12px gutters with 16px page margins. + +Content reflows from multi-column grids to single-column stacks on mobile, with secondary navigation moving to a bottom-tab bar or a simplified "hamburger" menu to maximize vertical screen real estate for data visualization. + +## Elevation & Depth + +Visual hierarchy is established through **Tonal Layers** and **Low-Contrast Outlines** rather than heavy shadows, maintaining a professional and clean "B2B dashboard" feel. + +- **Level 0 (Surface):** The main background color. +- **Level 1 (Cards):** Raised using a 1px border (#E2E8F0) or a very soft, diffused shadow (0px 4px 12px, 4% opacity). +- **Level 2 (Active/Overlays):** Used for modals and dropdowns, featuring a slightly more pronounced shadow and a backdrop blur (8px) to separate the element from the dense data behind it. + +AI-specific components may use a subtle purple outer-glow (tinted shadow) to indicate an active processing state or a high-confidence recommendation. + +## Shapes + +The shape language is **Soft**, utilizing small radii to maintain a disciplined, architectural feel. +- **Standard elements** (Buttons, Inputs, Cards): 0.25rem (4px). +- **Large containers** (Section blocks): 0.5rem (8px). +- **Interactive Tags/Chips:** May use a pill-shape for high-contrast status indicators, but structural components must remain geometric. + +This minimal roundedness reflects the industrial nature of KINTEX while softening the edges for a modern software experience. + +## Components + +### Buttons +Primary buttons use the Corporate Blue. AI-action buttons use the Purple accent. Both feature a subtle 1px inset border on hover to provide tactile feedback. Text is always semi-bold Hanken Grotesk. + +### Input Fields +Inputs utilize a 1px border-bottom as the primary visual marker in high-density forms, or a full 4px rounded box in standard layouts. The focus state uses a 2px Corporate Blue border. + +### Cards +Cards are the primary container for data. They must feature a clear "Header" section with 16px padding, separated by a 1px divider from the "Content" area. AI-powered cards include a left-hand purple border accent (4px width). + +### Chips & Status Indicators +Used for "Safe", "Warning", or "Alert" status. They are small, high-density elements with a background-tinted version of the status color and dark-text for accessibility. + +### Data Lists +Lists must support high-density viewing. Row heights are kept at 40px for desktop with a subtle hover state (#F1F5F9) to help the user track information across horizontal planes. \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/kintex_ai_system_proposal.md b/stitch_kintex_ai_system_architect/kintex_ai_system_proposal.md new file mode 100644 index 0000000..6222cc9 --- /dev/null +++ b/stitch_kintex_ai_system_architect/kintex_ai_system_proposal.md @@ -0,0 +1,36 @@ +# 킨텍스(KINTEX) AI 시스템 개발 기획안 + +## 1. 개요 +본 기획안은 대한민국 최대 전시 컨벤션 센터인 킨텍스의 디지털 전환을 가속화하고, AI 기술을 통해 방문객 경험을 혁신하며 운영 효율성을 극대화하기 위한 'KINTEX AI Intelligence System' 구축을 제안합니다. + +## 2. 핵심 목표 +- **방문객 경험 혁신**: 개인화된 추천 및 실시간 안내 서비스 제공 +- **운영 효율화**: 데이터 기반의 전시장 운영 및 혼잡도 관리 +- **전시 마케팅 고도화**: 전시 주최자 및 참가 업체를 위한 맞춤형 매칭 및 분석 리포트 제공 + +## 3. 주요 AI 시스템 기능 제안 + +### A. 스마트 방문객 가이드 (AI Concierge) +- **개인화된 전시 일정 추천**: 방문객의 관심 분야 및 과거 방문 이력을 분석하여 맞춤형 전시 및 세션 추천 +- **실시간 다국어 챗봇/보이스봇**: 위치 안내, 부대시설 정보, 주차 정보 등을 다국어로 실시간 응대 +- **AR 기반 실내 내비게이션**: 대규모 전시장 내에서 목적지(부스, 편의시설)까지의 최적 경로 안내 + +### B. 지능형 전시장 관리 (Smart Hall Operations) +- **AI 혼잡도 분석 및 예측**: CCTV 데이터를 활용한 실시간 인파 밀집도 분석 및 위험 구역 사전 경고 +- **에너지 최적화 시스템**: 전시장 내 인원 분포에 따른 조명 및 냉난방 자동 최적 제어 +- **주차 수요 예측**: 실시간 주차 상황 데이터와 행사 일정을 연계하여 주차 공간 최적 배정 및 안내 + +### C. 비즈니스 매칭 및 데이터 분석 (Business Intelligence) +- **AI 비즈니스 매칭**: 전시 주최자와 잠재적 참가 업체, 혹은 참가 업체와 바이어 간의 최적 매칭 제안 +- **성과 분석 리포트**: 부스별 방문자 수, 체류 시간, 유입 경로 등을 분석하여 참가 업체에 제공 +- **전시회 트렌드 분석**: 글로벌 전시 트렌드 데이터를 분석하여 신규 기획 전시 테마 제안 + +## 4. 시스템 아키텍처 (Harness) 제안 +- **Data Lake**: 웹사이트 로그, 현장 센서 데이터, 외부 트렌드 데이터를 통합 관리 +- **AI Model Layer**: 자연어 처리(LLM), 컴퓨터 비전(CCTV 분석), 예측 모델(주차/에너지) 탑재 +- **API Gateway**: 모바일 앱, 웹사이트, 키오스크 등 다양한 채널에 AI 기능 공급 + +## 5. 기대 효과 +- 방문객 만족도 제고 및 체류 시간 증대 +- 운영 비용 절감 및 인력 운용 효율화 +- 전시 데이터 자산화를 통한 새로운 비즈니스 모델 창출 diff --git a/stitch_kintex_ai_system_architect/kintex_nexus/DESIGN.md b/stitch_kintex_ai_system_architect/kintex_nexus/DESIGN.md new file mode 100644 index 0000000..aaa1144 --- /dev/null +++ b/stitch_kintex_ai_system_architect/kintex_nexus/DESIGN.md @@ -0,0 +1,181 @@ +--- +name: Kintex Nexus +colors: + surface: '#f8f9fa' + surface-dim: '#d9dadb' + surface-bright: '#f8f9fa' + surface-container-lowest: '#ffffff' + surface-container-low: '#f3f4f5' + surface-container: '#edeeef' + surface-container-high: '#e7e8e9' + surface-container-highest: '#e1e3e4' + on-surface: '#191c1d' + on-surface-variant: '#424751' + inverse-surface: '#2e3132' + inverse-on-surface: '#f0f1f2' + outline: '#727782' + outline-variant: '#c2c6d3' + surface-tint: '#115fac' + primary: '#00427d' + on-primary: '#ffffff' + primary-container: '#0059a6' + on-primary-container: '#b6d1ff' + inverse-primary: '#a6c8ff' + secondary: '#39608d' + on-secondary: '#ffffff' + secondary-container: '#a6ccff' + on-secondary-container: '#2e5682' + tertiary: '#8a0002' + on-tertiary: '#ffffff' + tertiary-container: '#b60004' + on-tertiary-container: '#ffc1b8' + error: '#ba1a1a' + on-error: '#ffffff' + error-container: '#ffdad6' + on-error-container: '#93000a' + primary-fixed: '#d5e3ff' + primary-fixed-dim: '#a6c8ff' + on-primary-fixed: '#001c3b' + on-primary-fixed-variant: '#004786' + secondary-fixed: '#d2e4ff' + secondary-fixed-dim: '#a3c9fc' + on-secondary-fixed: '#001c37' + on-secondary-fixed-variant: '#1e4974' + tertiary-fixed: '#ffdad5' + tertiary-fixed-dim: '#ffb4a9' + on-tertiary-fixed: '#410000' + on-tertiary-fixed-variant: '#930002' + background: '#f8f9fa' + on-background: '#191c1d' + surface-variant: '#e1e3e4' + surface-border: '#E5E7EB' + status-active: '#10B981' + status-pending: '#F59E0B' + table-header: '#F1F5F9' +typography: + headline-lg: + fontFamily: Hanken Grotesk + fontSize: 30px + fontWeight: '700' + lineHeight: 38px + letterSpacing: -0.02em + headline-lg-mobile: + fontFamily: Hanken Grotesk + fontSize: 24px + fontWeight: '700' + lineHeight: 32px + headline-md: + fontFamily: Hanken Grotesk + fontSize: 20px + fontWeight: '600' + lineHeight: 28px + body-lg: + fontFamily: Hanken Grotesk + fontSize: 16px + fontWeight: '400' + lineHeight: 24px + body-md: + fontFamily: Hanken Grotesk + fontSize: 14px + fontWeight: '400' + lineHeight: 20px + body-sm: + fontFamily: Hanken Grotesk + fontSize: 13px + fontWeight: '400' + lineHeight: 18px + label-md: + fontFamily: Hanken Grotesk + fontSize: 12px + fontWeight: '600' + lineHeight: 16px + letterSpacing: 0.05em + mono-data: + fontFamily: jetbrainsMono + fontSize: 13px + fontWeight: '400' + lineHeight: 18px +rounded: + sm: 0.125rem + DEFAULT: 0.25rem + md: 0.375rem + lg: 0.5rem + xl: 0.75rem + full: 9999px +spacing: + container-max: 1440px + margin-desktop: 32px + margin-mobile: 16px + gutter: 24px + stack-sm: 8px + stack-md: 16px + stack-lg: 24px +--- + +## Brand & Style + +The design system is engineered for the high-density requirements of exhibition management and administrative oversight. It targets professional operators and event organizers who require a high degree of "information scent" and clarity. + +The aesthetic follows a **Corporate / Modern** movement, prioritizing structural integrity and functional density over decorative flourishes. It utilizes a balanced combination of high-density data visualization and clear, hierarchical navigation. The UI evokes a sense of reliability and institutional authority, reflecting the physical scale of the KINTEX venue. The layout is systematic, utilizing a clean "dashboard-first" philosophy where every pixel serves a purpose in decision-making and logistics management. + +## Colors + +The palette is anchored by **Corporate Blue (#0059A6)**, representing the established brand identity and used for primary actions, navigation headers, and brand-critical elements. A **Secondary Blue (#6389B8)** acts as a supportive hue for data visualization and secondary interactive states, bridging the gap between brand identity and UI utility. + +**Tertiary Red (#E32219)** is reserved strictly for high-urgency alerts, error states, and critical "Delete" or "Cancel" actions to ensure it maintains its semantic impact. The neutral foundation relies on **Light Gray (#F8F9FA)** for background surfaces to reduce eye strain during long working sessions, with darker grays used for structural borders and high-contrast text. + +## Typography + +This design system uses **Hanken Grotesk** for its exceptional legibility in dense administrative interfaces. It provides a sharp, contemporary feel that aligns with the "Pretendard" aesthetic requested while offering superior geometric balance for international stakeholders. + +- **Headlines:** Use Bold weights for section titles to establish a strong visual anchor. +- **Body:** Standard body text is set at 14px (md) to maximize information density without compromising readability. +- **Data Sets:** For numerical values, ID strings, or technical logs within tables, the **JetBrains Mono** font (mono-data) is recommended to ensure clear distinction between characters and aligned columns. +- **Labels:** Small, uppercase labels with increased letter spacing are used for table headers and category tags to differentiate them from interactive content. + +## Layout & Spacing + +The layout utilizes a **Fixed-Fluid Hybrid Grid**. The main sidebar navigation is fixed (240px), while the content area expands to a maximum of 1440px to ensure data tables don't become excessively wide and difficult to scan horizontally. + +A **base-8 spacing system** is strictly enforced to maintain rhythmic consistency. +- **Desktop:** 12-column grid with 24px gutters. +- **Tablet:** 8-column grid with 20px gutters. +- **Mobile:** 4-column grid with 16px margins. + +Content should reflow into single-column stacks on mobile devices. For complex data tables, horizontal scrolling is the preferred pattern over hidden columns to ensure all administrative data remains accessible. + +## Elevation & Depth + +To maintain a "Professional & Functional" aesthetic, this design system avoids heavy shadows. Depth is primarily conveyed through **Tonal Layers** and **Low-Contrast Outlines**. + +- **Level 0 (Base):** Light Gray background (#F8F9FA). +- **Level 1 (Cards/Containers):** White background with a 1px border (#E5E7EB). No shadow. +- **Level 2 (Modals/Dropdowns):** White background with a subtle, tight ambient shadow (Blur 8px, Y 4px, Opacity 5%) to indicate temporary interaction layers. +- **Interactive Elements:** Buttons and inputs use a flat design with a 1px solid stroke. Primary buttons use a solid fill to pop against the outlined secondary elements. + +## Shapes + +The design system employs a **Soft (0.25rem)** roundedness level. This subtle rounding softens the industrial nature of the dashboard while maintaining a professional, structured appearance. + +- **Inputs and Buttons:** 4px (0.25rem) radius. +- **Cards and Containers:** 8px (0.5rem) radius. +- **Status Tags:** Fully rounded (pill) to clearly distinguish them from interactive buttons or input fields. + +## Components + +### Data Tables +Tables are the heart of the system. Use a "Zebra Stripe" pattern (alternate rows in #F9FAFB) for long datasets. Headers must be "Sticky" during scroll and styled with a light gray background and `label-md` typography. + +### Analytics Charts +Use a minimalist approach. Grid lines should be faint (#F3F4F6). Primary data series should use Corporate Blue (#0059A6), with secondary series in #6389B8 and #94A3B8. Avoid 3D effects. + +### Status Cards +Exhibition status cards should feature a prominent "Current State" indicator (e.g., "Active," "Completed," "Scheduled") using semantic background tints and dark text for accessibility. + +### Buttons +- **Primary:** Solid #0059A6 with white text. +- **Secondary:** White background with #E5E7EB border and #374151 text. +- **Destructive:** Solid #E32219 for critical admin actions. + +### Administrative Controls +Toggle switches should be used for binary states (e.g., "Public Visibility"). Checkboxes are preferred for multi-select actions in tables. Input fields should have a distinct focus state using a 2px Corporate Blue border. \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/layout_comparison_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/layout_comparison_kintex_ai_system/code.html new file mode 100644 index 0000000..f615df3 --- /dev/null +++ b/stitch_kintex_ai_system_architect/layout_comparison_kintex_ai_system/code.html @@ -0,0 +1,329 @@ + + + + + +AI 배치안 비교 - KINTEX AI + + + + + + + + + + +
+ +
+
+Exhibition Studio + +
+
+
+ + +
+
+D-31 + +
+
+ +
+
+ +
+
+

AI 배치안 비교

+

+info + 조건: 목표 510부스 · 프리미엄 15% · 무대 1개소 +

+
+ +
+ +
+ + + + + + +
+ +
+ +
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/login_workspace_selection_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/login_workspace_selection_kintex_ai_system/code.html new file mode 100644 index 0000000..4919eee --- /dev/null +++ b/stitch_kintex_ai_system_architect/login_workspace_selection_kintex_ai_system/code.html @@ -0,0 +1,451 @@ + + + + + +KINTEX AI 전시관리 - 로그인 + + + + + + + + +
+ + + +
+
+ +
+KINTEX Logo +
+
+

로그인

+

KINTEX 전시 관리 시스템에 오신 것을 환영합니다.

+
+
+
+ + +
+
+
+ +
+ +
+
+ +비밀번호 찾기 +
+ +
+
+
+또는 +
+
+ + +
+
+

© 2024 KINTEX. All rights reserved.

+
+
+
+ +
+ + + +
+ +
+ +
+ + +
+ +
+
+D-31 + +
+
+ + +
+
+User Profile +
+
+
+ +
+
+
+
+

My Projects

+

Manage your upcoming exhibitions and floor plans.

+
+ +
+ +
+ +
+
+
+
+
+
+D-31 +
+spark +AI Optimized +
+
+
+
+
+

2026 스마트팩토리 코리아

+

+calendar_today + 2026.10.15 - 10.18 +

+
+
+storefront 142 Booths +Open Studio arrow_forward +
+
+
+ +
+
+
+
+
+
+D-120 +
+In Review +
+
+
+
+
+

Global AI Expo 2026

+

+calendar_today + 2026.12.01 - 12.04 +

+
+
+storefront 86 Booths +Open Studio arrow_forward +
+
+
+ +
+
+add +
+

Create New Project

+

Start a new exhibition floor plan with AI assistance.

+
+
+
+
+
+
+ + \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/manager_approval_queue_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/manager_approval_queue_kintex_ai_system/code.html new file mode 100644 index 0000000..4086d38 --- /dev/null +++ b/stitch_kintex_ai_system_architect/manager_approval_queue_kintex_ai_system/code.html @@ -0,0 +1,300 @@ + + + + + +KINTEX AI - Approval Queue + + + + + + + + + + +
+ +
+
+
+

도면 및 서류 검수 대기열

+
+ + + +
+
+
+
+search + +
+ +
+
+
+
+검수 대기 +23 +
+
+오늘 마감 +5 +
+
+warning +AI 차단 플래그 +4 +
+
+
+ +
+ +
+
+

제출 서류 목록 (홀7)

+ +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
행사/부스서류 유형제출자제출일마감AI 사전심사상태액션
+
스마트팩토리 코리아
+
A-102
+
장치 도면(주)공간디자인07.10D-6 +
+warning + 차단 1 +
+
검토 대기 + +
+
스마트팩토리 코리아
+
B-201
+
유틸리티 위치표시도미래테크(주)07.11D-14 +
+check + 통과 +
+
검토 대기 + +
+
+
+
+ + +
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/manager_field_inspection_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/manager_field_inspection_kintex_ai_system/code.html new file mode 100644 index 0000000..efd3e1b --- /dev/null +++ b/stitch_kintex_ai_system_architect/manager_field_inspection_kintex_ai_system/code.html @@ -0,0 +1,345 @@ + + + + + +현장 검수 - KINTEX + + + + + + + + + + + +
+ +
+
+ +
+

현장 검수 · 부스 A-102

+홀7 · KINTEX +
+
+도면 썸네일 +
+ +
+ +
+ +
+

도면 vs 현장 비교

+
+auto_awesome +AI 사전심사 플래그 3건 +
+
+ +
+ +
+승인 도면 +승인 도면 +
+ +
+
+compare_arrows +
+
+ +
+현장 사진 +현장 사진 +
+
+ +
+
+
+
+
+
+ +
+

검수 항목 (4)

+ +
+
+장치물 높이 (제한 4m) +
+ + +
+
+
+ +
+
+방염 라벨 부착 +
+ + +
+
+
+ +
+
+
+ + 통로 침범 여부 + warning + +통로 0.3m 침범 확인 +
+
+ + +
+
+
+위반 사진 + +
+
+ +
+
+소음 규정 준수 +
+ + +
+
+
+
+
+ +
+ + +
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/organizer_dashboard_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/organizer_dashboard_kintex_ai_system/code.html new file mode 100644 index 0000000..7aad024 --- /dev/null +++ b/stitch_kintex_ai_system_architect/organizer_dashboard_kintex_ai_system/code.html @@ -0,0 +1,529 @@ + + + + + +KINTEX AI 전시관리 - Dashboard + + + + + + + + + + + +
+ +
+
+Exhibition Studio +
+search + +
+
+ +
+ + + + +
+person +
+
+
+ +
+ +
+
+

2026 스마트팩토리 코리아

+

+location_on 킨텍스 제2전시장 홀7 + | +calendar_today 2026.08.11–08.14 +

+
+
+timer +
+개장까지 +D-31 +
+
+
+ +
+
+ +
+ +
+
+ +
+
완료됨
+
+check +
+

D-150 홀 배정

+
+배정 완료 +100% +
+
+ +
+
완료됨
+
+check +
+

D-30 사전협의

+
+협의 완료 +100% +
+
+ +
+
+warning D-6 남음 +
+
+
+
+
+

D-25 유틸리티 마감

+
+
+신청 현황 +74% 진행 +
+
+ +
+
+
+
+

D-7 신고서류

+
+제출 현황 +3/7 완료 +
+
+ +
+
+flag +
+

D-0 개장

+
+준비중 +
+
+
+
+
+ +
+ +
+
+
+참가업체 +groups +
+
+
+128 +/ 160 +
+
+
+
+
+
+ +
+
+
+ +auto_awesome 배치 확정률 + +architecture +
+
+
+92% +
+

AI 최적화 완료

+
+
+ +
+
+
+유틸리티 신청 +power +
+
+
+74% +
+

마감 임박

+
+
+ +
+
+
+규정 위반 +gavel +
+
+
+5 + +
+ + 상세보기 arrow_forward + +
+
+
+ +
+ +
+
+

+table_chart 참가업체 현황 +

+
+ + +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
부스번호업체명설계 상태유틸리티예상 사진
A-101삼성전자 (스마트팩토리 사업부) + + 승인 + +전기(30kW), LAN +삼성전자 예상 부스 디자인 렌더링 +
A-102LG CNS + +auto_awesome AI 제안 + +전기(20kW), 압축공기 +LG CNS AI 제안 부스 배치도 +
B-205 + 현대위아 error + + + 반려 (높이 초과) + +전기(50kW), 용수 +
미제출
+
C-311두산로보틱스 + + 작성중 + +- +
작성중
+
A-105LS ELECTRIC + + 승인 + +전기(40kW) +
+image +
+
+
+
+ +
+ +
+
+
+ +
+auto_awesome AI 생성 +
+
+
+

홀 전경 조감

+

최종 렌더링 - 2시간 전 업데이트

+
+ +
+
+ +
+
+

+history 최근 활동 +

+
+
+ +
+
+gavel +
+
+

B-205 (현대위아) 설계 도면이 안전 규정(높이 초과)으로 자동 반려되었습니다.

+10분 전 +
+
+ +
+
+auto_awesome +
+
+

AI 최적화 모듈이 잔여 부스(32개)에 대한 동선 최적화 배치를 생성했습니다.

+1시간 전 +
+
+ +
+
+check +
+
+

A-101 (삼성전자) 유틸리티 신청서가 승인되었습니다.

+3시간 전 +
+
+ +
+
+upload_file +
+
+

C-311 (두산로보틱스) 1차 서류를 제출했습니다.

+5시간 전 +
+
+
+
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/precision_enterprise_ai/DESIGN.md b/stitch_kintex_ai_system_architect/precision_enterprise_ai/DESIGN.md new file mode 100644 index 0000000..3193c85 --- /dev/null +++ b/stitch_kintex_ai_system_architect/precision_enterprise_ai/DESIGN.md @@ -0,0 +1,164 @@ +--- +name: Precision Enterprise AI +colors: + surface: '#f9f9ff' + surface-dim: '#d2daf0' + surface-bright: '#f9f9ff' + surface-container-lowest: '#ffffff' + surface-container-low: '#f1f3ff' + surface-container: '#e9edff' + surface-container-high: '#e0e8ff' + surface-container-highest: '#dbe2f9' + on-surface: '#141b2c' + on-surface-variant: '#414751' + inverse-surface: '#293041' + inverse-on-surface: '#edf0ff' + outline: '#717782' + outline-variant: '#c1c7d3' + surface-tint: '#0060a9' + primary: '#004e8b' + on-primary: '#ffffff' + primary-container: '#0066b3' + on-primary-container: '#d2e3ff' + inverse-primary: '#a2c9ff' + secondary: '#5427e6' + on-secondary: '#ffffff' + secondary-container: '#6d4aff' + on-secondary-container: '#f3edff' + tertiary: '#00583b' + on-tertiary: '#ffffff' + tertiary-container: '#00734e' + on-tertiary-container: '#8ef7c3' + error: '#ba1a1a' + on-error: '#ffffff' + error-container: '#ffdad6' + on-error-container: '#93000a' + primary-fixed: '#d3e4ff' + primary-fixed-dim: '#a2c9ff' + on-primary-fixed: '#001c38' + on-primary-fixed-variant: '#004881' + secondary-fixed: '#e5deff' + secondary-fixed-dim: '#c9bfff' + on-secondary-fixed: '#1b0063' + on-secondary-fixed-variant: '#4500d8' + tertiary-fixed: '#8ef7c4' + tertiary-fixed-dim: '#72daa9' + on-tertiary-fixed: '#002113' + on-tertiary-fixed-variant: '#005236' + background: '#f9f9ff' + on-background: '#141b2c' + surface-variant: '#dbe2f9' +typography: + display-lg: + fontFamily: Inter + fontSize: 36px + fontWeight: '700' + lineHeight: 44px + letterSpacing: -0.02em + display-lg-mobile: + fontFamily: Inter + fontSize: 28px + fontWeight: '700' + lineHeight: 36px + headline-md: + fontFamily: Inter + fontSize: 24px + fontWeight: '600' + lineHeight: 32px + title-sm: + fontFamily: Inter + fontSize: 18px + fontWeight: '600' + lineHeight: 28px + body-base: + fontFamily: Inter + fontSize: 14px + fontWeight: '400' + lineHeight: 20px + body-sm: + fontFamily: Inter + fontSize: 13px + fontWeight: '400' + lineHeight: 18px + label-md: + fontFamily: Geist + fontSize: 12px + fontWeight: '600' + lineHeight: 16px + letterSpacing: 0.02em + label-xs: + fontFamily: Geist + fontSize: 11px + fontWeight: '500' + lineHeight: 14px +rounded: + sm: 0.125rem + DEFAULT: 0.25rem + md: 0.375rem + lg: 0.5rem + xl: 0.75rem + full: 9999px +spacing: + base: 4px + container-padding: 24px + gutter: 16px + stack-sm: 8px + stack-md: 16px + stack-lg: 24px +--- + +## Brand & Style +This design system is engineered for a high-stakes B2B enterprise environment, specifically tailored for exhibition management. The brand personality is rooted in **reliability, precision, and institutional authority**, reflecting the scale of the KINTEX infrastructure. + +The design style follows a **Corporate / Modern** aesthetic with a focus on data density and functional clarity. It prioritizes information hierarchy to support rapid decision-making in complex workflows. The UI utilizes a structured grid, high-contrast typography, and purposeful use of color to distinguish between human-managed data and AI-generated suggestions. The emotional response should be one of "controlled efficiency"—where the user feels empowered by the tool's intelligence rather than overwhelmed by its complexity. + +## Colors +The palette is dominated by **KINTEX Blue (#0066B3)**, establishing a professional and trustworthy foundation. A specialized **AI Accent (Purple #6D4AFF)** is introduced specifically to highlight features where the system provides drafts, suggestions, or automated logic. + +- **Primary Tier**: Used for core actions and active states. +- **AI Tier**: Reserved for generative elements and automated labels. +- **Canvas Tier**: A deep charcoal surface (#1C2536) is utilized for the "Editor Canvas" to provide a high-contrast workspace for layout planning and spatial management, separating the "work" area from the "management" UI. +- **Neutrals**: A sophisticated range of grays from #F9FAFB (backgrounds) to #101828 (primary text) ensures deep legibility and clean separation of UI layers. + +## Typography +This design system utilizes **Inter** as the primary typeface for its exceptional legibility in high-density data environments, serving as a modern surrogate for Pretendard. **Geist** is used for labels and monospaced technical data to reinforce the "AI/Systems" feel. + +The typographic scale is optimized for SaaS: +- **High Density**: The base body size is set to **14px** to allow more data to be visible on the screen simultaneously. +- **Weight Contrast**: Bold weights (600/700) are used strictly for headings and critical status indicators to guide the eye quickly. +- **Technical Precision**: Labels and captions use a slightly tighter tracking and smaller scale (11px-12px) for metadata that supports primary content. + +## Layout & Spacing +The layout follows a **Fluid Grid** model with a 4px baseline shift to ensure consistent alignment. + +- **Desktop**: 12-column grid with 16px gutters and 24px outer margins. +- **Information Density**: Padding in data tables and property panels is kept tight (8px to 12px) to maximize content visibility without sacrificing touch/click targets. +- **Editor Canvas**: Operates on a dedicated 8px or 16px snap-to-grid system for precise placement of exhibition booths and assets. +- **Reflow**: On tablet devices, the side navigation collapses into an icon-only rail, while the 12-column grid transitions to an 8-column layout. + +## Elevation & Depth +The system uses **Tonal Layers** rather than heavy shadows to maintain a clean, professional workspace. + +- **Level 0 (Base)**: Background surface (#F9FAFB). +- **Level 1 (Cards/Sections)**: White surface with a thin 1px border (#E4E7EC). No shadow. +- **Level 2 (Modals/Popovers)**: White surface with a soft, neutral ambient shadow (Y: 4px, Blur: 12px, 10% opacity) to provide focus. +- **The Editor Surface**: Uses a "Reverse Elevation" strategy where the canvas is the lowest level (dark background), and tools/panels float above it with subtle glassmorphism effects (10px backdrop blur) to maintain context of the underlying layout. + +## Shapes +A **Soft (0.25rem)** roundedness is applied throughout the system to balance professional rigor with modern software aesthetics. + +- **Small Components**: Checkboxes, inputs, and small buttons use the 4px (0.25rem) radius. +- **Large Components**: Cards and modals scale up to 8px (0.5rem) to soften the overall interface. +- **AI Elements**: Components specifically related to AI (Drafts, Suggestions) may utilize a slightly more organic feel, but must stay within the system's 8px maximum limit to maintain visual cohesion. + +## Components +- **StatusBadge**: Follows a strict semantic progression: Gray (Draft) -> Blue (In Review) -> Purple (AI Optimized) -> Green (Approved) -> Red (Violation/Conflict). +- **DdayChip**: A compact, high-contrast tag used in lists to show time-sensitive deadlines (e.g., "D-15"). Uses a bold background and white text. +- **AI Labels**: Elements generated or drafted by the system are marked with a Purple (#6D4AFF) hairline outline and a small sparkle icon prefix. +- **ViolationFlag**: High-visibility red indicator (#D92D20) used in the canvas to mark booth placement errors or safety regulation breaches. +- **Input Fields**: Minimal styling with a 1px border. On focus, the border transitions to KINTEX Blue with a soft 2px outer glow. +- **Buttons**: + - **Primary**: Solid KINTEX Blue. + - **Secondary**: Outlined Blue or Gray. + - **AI Action**: Solid Purple with a subtle gradient to indicate "Generative" capability. +- **Cards**: Use a white background, 1px border, and no shadow. The header of the card should have a 4px padding-left accent color matching its status. \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/review_details_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/review_details_kintex_ai_system/code.html new file mode 100644 index 0000000..b72a995 --- /dev/null +++ b/stitch_kintex_ai_system_architect/review_details_kintex_ai_system/code.html @@ -0,0 +1,350 @@ + + + + + +KINTEX AI - 도면 검토 + + + + + + + + + + +
+ +
+
+ +
+

장치 도면 검토

+
+버전: v2 +제출자: (주)공간디자인 +일자: 07.10 +
+
+
+
+ +
+
+ +
+ +
+ +
+ +
+ + + +
+ +
+ +AI 위반 오버레이 + +
+
+ +
+ +
+ +
+ + +
+
1
+
+
+
+
2
+
+
+
+
3
+
+
+
+
+ +
+ + + +
+
+ + +
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/utility_order_summary_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/utility_order_summary_kintex_ai_system/code.html new file mode 100644 index 0000000..2dce2b8 --- /dev/null +++ b/stitch_kintex_ai_system_architect/utility_order_summary_kintex_ai_system/code.html @@ -0,0 +1,366 @@ + + + + + +유틸리티 신청 확인 - KINTEX AI + + + + + + + + + + +
+ +
+
+ +

유틸리티 신청

+
+ +
+ +
+
+check +
+배선 설계 +
+
+ +
+
+ 2 +
+신청 확인 +
+
+ +
+
+ 3 +
+제출 완료 +
+
+ +
+
+ +
+
+ +
+ +
+
+
+

유틸리티 시공 위치표시도

+ + +auto_awesome + 자동 생성 + +
+

+info + 수기 작도를 대체하는 공식 제출 서식입니다. +

+
+ +
+ +
+ +
+ +
+

2024 KINTEX 메가쇼

+
부스 유틸리티 배치도
+
+ +
+ + + + +전기 5kW + + +LAN + +
+ +
+
+ +
+부스 번호: A-104 +생성일시: 2024-10-24 14:30 KST +verified AI Verified +
+
+
+
+ +
+ +
+
+

신청 내역

+D-25 +
+
+ +
+
+
+
+전기 (24시간) 5kW +
+₩ 275,000 +
+
+
+
+분전반 (차단기 포함) +
+₩ 100,000 +
+
+
+
+전용선 인터넷 (LAN) +
+₩ 150,000 +
+
+
+
+급배수 (싱크대 연결용) +
+₩ 150,000 +
+ +
+총 결제 예정 금액 (VAT 포함) +₩ 675,000 +
+
+ +
+schedule +
+

공급 시점 안내

+

모든 유틸리티는 장치 마지막 날 오후 2시 이후부터 순차적으로 공급 및 테스트가 진행됩니다.

+
+
+ +
+

신청자 정보

+
+
+

참가업체명

+

(주)테크솔루션즈

+
+
+

부스 번호

+

A-104 (독립부스)

+
+
+

담당자 연락처

+

김전시 과장 / 010-1234-5678 / dev@techsolutions.com

+
+
+
+
+
+ +
+
+ + +
+ +
+
+
+
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/utility_wiring_view_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/utility_wiring_view_kintex_ai_system/code.html new file mode 100644 index 0000000..1421e73 --- /dev/null +++ b/stitch_kintex_ai_system_architect/utility_wiring_view_kintex_ai_system/code.html @@ -0,0 +1,445 @@ + + + + + +부스 유틸리티 배선 플래너 - KINTEX AI + + + + + + + + + + + +
+ +
+ +
+warning +유틸리티 신청 마감 D-6 — 인터넷 회선은 현장 추가 신청 불가 +
+
+
+ +
+

부스 A-102 · 홀7

+

유틸리티 배선 플래너

+
+
+ +
+ + + +
+
+
+ +
+ + + +
+ +
+
+ + +
+ +
+
+
범례
+
+
+
+전기 (220V) +
+
+
+네트워크 (LAN) +
+
+
+급배수 +
+
+
+
+
+
+바닥 트렌치 +
+
+
+
+ +
+ + + + + + + + +부스 A-102 + + + + + + + + + + + + + + + + + + + + + + + + +
+ +가정 트렌치 좌표 적용됨 +
+
+
+ + +
+
+ \ No newline at end of file diff --git a/stitch_kintex_ai_system_architect/visualization_gallery_kintex_ai_system/code.html b/stitch_kintex_ai_system_architect/visualization_gallery_kintex_ai_system/code.html new file mode 100644 index 0000000..500997b --- /dev/null +++ b/stitch_kintex_ai_system_architect/visualization_gallery_kintex_ai_system/code.html @@ -0,0 +1,469 @@ + + + + + +Exhibition Studio - AI Render Gallery + + + + + + + + + + + +
+ +
+
+Exhibition Studio + +
+
+ +
+ + +
+User Profile +
+
+
+
+ +
+ +
+
+
+

+ AI 렌더링 갤러리 + auto_awesome +

+

부스 디자인 및 배선 레이아웃의 AI 생성 예상 이미지입니다.

+
+
+ +
+
+ +
+info +

AI 생성 이미지는 계약·심사 서류에 사용할 수 없습니다 — 시공 기준은 공식 도면입니다.

+
+ +
+ + + + + + + +
+
+ +
+ +
+ + +
+ +auto_awesome + S1 정면 + + + 설계 v2 + +
+ +
+AI 생성 예상 이미지 +
+
+S1 Front View +
+
+
+ +생성 완료 +
+07.11 +
+
+ +
+
+ +auto_awesome + S2 야간 + + + 설계 v2 + +
+
+AI 생성 예상 이미지 +
+
+S2 Night View +
+
+
+ +생성 완료 +
+07.11 +
+
+ +
+
+
+ + S3 통로 + +
+
+model_training +
+AI 렌더링 중... +약 15초 남음 +
+ +
+
+
+
+
+ +
+
+ +auto_awesome + S6 배선 + + + 설계 v1 + +
+
+S6 Wiring Diagram +
+
+
+ +생성 완료 +
+07.10 +
+
+ +
+
+ + S4 내부 + +
+
+
+error_outline +
+렌더링 실패 +

도면 데이터 복잡도로 인해 시간 초과가 발생했습니다.

+ +
+
+ +
+
+ +auto_awesome + S7 홀 전경 + + + 설계 v2 + +
+
+AI 생성 예상 이미지 +
+
+S7 Hall Overview +
+
+
+ +생성 완료 +
+07.11 +
+
+
+
+
+ \ No newline at end of file