- add visual fit classifier, router, retry, and failure routing modules - add composition planner and catalog-driven mapper - add Phase Z pipeline orchestration and architecture docs
13 KiB
Frame Integration Map — 32 Figma Frame ↔ Phase Z Zone 통합 매핑
핵심 방향 (2026-04-28 정정)
Figma frame 은 슬라이드에 원본 그대로 꽂는 게 아니라, 디자인 레퍼런스 / 구조 패턴 / 슬롯 힌트로 본다. 최종 결과는 항상 현재 slide-body 의 Zone 안에 맞게 재구성한다.
- 원본이 full-slide 디자인이어도 → Zone 안 맞게 축약 / 재배치 / 슬롯화해서 사용
- 복합 슬라이드여도 → Zone 안에서는 일부 패턴만 참고해 재구성
→ 분류는 "원본 크기" 가 아니라 "Zone 에 어떻게 적용할지" 기준으로 한다.
라벨 정의
Zone 적용 방식 (zone_application)
| 값 | 의미 |
|---|---|
zone_direct |
Zone 안에 거의 그대로 적용 가능 (구조 / 사이즈 변환 최소) |
zone_adapt |
구조는 맞지만 Zone 크기에 맞게 재구성 필요 |
zone_extract |
전체 frame 중 일부 패턴만 추출해서 Zone 에 사용 |
reference_only |
직접 구조로 쓰기보다 디자인 톤 / 아이디어만 참고 |
reject |
Phase Z 에서 사용하지 않음 |
Zone 적합성 (zone_fit)
| 값 | 의미 |
|---|---|
high |
Zone 에 바로 맞추기 쉬움 (단순 리스트 / 표 등) |
medium |
조정하면 가능 (3 단 카드 / 다이어그램 등) |
low |
많이 재구성해야 함 (복합 구조 / 분할 패널) |
reference |
참고용 |
검토 상태 (review_status)
| 값 | 의미 |
|---|---|
auto_estimated |
코드가 layout 패턴으로 추정. 사용자 검토 필요 |
user_confirmed |
사용자 검토 후 확정 |
needs_review |
자동 추정에 의문 — 사람이 Figma 캔버스 직접 확인 필요 |
1차 — 32 Frame Zone 적용 분류
⚠️
legacy 스타일 출처(참고)컬럼 의미기존
templates/blocks/는 Phase Z 의 실제 조립 재료가 아님 (삭제 / 폐기 방향). 이 컬럼은 frame ↔ 블록 매핑이 아니라, frame 의 디자인 / 시각 언어를 만들 때 참고할 수 있는 스타일 출처 (색감, 여백, 폰트 위계, 표 스타일, 카드 스타일, pill / badge, SVG / CSS 구현 힌트) 만 가리킨다.Phase Z 의 실제 실행 기준은 새 frame / zone catalog. 정밀화는
PHASE-Z-STYLE-SOURCES.md(예정) 에서 별도 진행.
| Frame | Figma ID | 패턴 | Zone 적합성 | Zone 적용 방식 | 검토 상태 | legacy 스타일 출처(참고) | 비고 |
|---|---|---|---|---|---|---|---|
| 01 | 1171281172 |
circular-nodes-6 |
medium |
zone_adapt |
auto_estimated |
templates/blocks/visuals/ (다이어그램) |
S/W 개발 방향 순환도. 6 노드 — Zone 사이즈에 맞춰 시각 재구성 |
| 02 | 1171281173 |
bullet-cards-4-plus-center |
low |
zone_extract |
auto_estimated |
(복합 — 일부 패턴 추출) | 4 카드 + 중앙 강조. Zone 에서는 4 카드 부분만 추출하거나 중앙만 강조로 사용 |
| 03 | 1171281174 |
list-numbered-4 |
high |
zone_direct |
auto_estimated |
templates/blocks/cards/ 또는 list 류 |
4 항목 번호 리스트 — 단순 구조, Zone 직접 적용 |
| 04 | 1171281175 |
quadrilateral-relations |
medium |
zone_extract |
user_confirmed |
(관계도 — 기존 venn / cycle 로 부족 가능) | 4 actors + 관계도 + hierarchy 단계 결합된 복합형. 큰 Zone 에서는 zone_adapt 가능, 기본은 actor / hierarchy 패턴 추출 |
| 05 | 1171281176 |
side-card-with-list |
medium |
zone_extract |
auto_estimated |
(좌우 분할 — 일부 추출) | 좌측 카드 + 우측 리스트. Zone 안에서 좌·우 패턴 추출 |
| 06 | 1171281177 |
full-page-map-banner |
reference |
reference_only |
user_confirmed |
(콘텐츠 슬롯형 X — 참고용) | 지도 / 마커 / 현황 시각자료 중심. 일반 텍스트 Zone 구조로 직접 사용 X. 지도형 콘텐츠가 있을 때 디자인 참고 |
| 07 | 1171281178 |
2col-paired-list |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ 또는 페어드 |
2 컬럼 페어드 리스트 — Zone 사이즈 맞춰 표 재구성 |
| 08 | 1171281179 |
3-section-framework |
medium |
zone_extract |
auto_estimated |
(3 섹션 — 일부 추출) | 효율적 정보 관리 (What/How/When). 3 섹션 패턴 추출 |
| 09 | 1171281180 |
list-stacked-vertical |
high |
zone_direct |
auto_estimated |
templates/blocks/cards/ 또는 list 류 |
5 항목 세로 리스트 — Zone 직접 적용 |
| 10 | 1171281181 |
radial-diagram-5 |
medium |
zone_adapt |
auto_estimated |
templates/blocks/visuals/ |
5 way 방사형 다이어그램 — Zone 시각 재구성 |
| 11 | 1171281182 |
cards-3-category |
medium |
zone_extract |
auto_estimated |
(3 카드 — 패턴 추출) | 시공단계 BIM 활용 — 3 카드 패턴 추출 |
| 12 | 1171281189 |
cycle-3way-intersection |
medium |
zone_adapt |
auto_estimated |
templates/blocks/visuals/venn-diagram.html |
3 way 벤다이어그램. Zone 사이즈 맞춰 SVG 재구성 |
| 13 | 1171281190 |
3-column |
medium |
zone_extract |
auto_estimated |
(3 단 — 패턴 추출) | 필수조건 (pillar 3). Zone 안에 3 단 패턴 추출. 02-2.2 매칭 실패 정답 frame (3차 대상) |
| 14 | 1171281191 |
persona-3col |
medium |
zone_extract |
auto_estimated |
templates/blocks/cards/card-text-grid.html (참고) |
주체별 기대효과. Zone 안에서 3 카드 패턴 추출 |
| 15 | 1171281192 |
policy-4card-plus-list |
low |
zone_extract |
auto_estimated |
(복합 — 일부 추출) | 4 카드 + 부속 리스트. Zone 안에서 4 카드만 추출하거나 리스트만 사용 |
| 16 | 1171281193 |
quadrant-4 |
medium |
zone_extract |
auto_estimated |
(4 사분면 — 패턴 추출) | BIM 수행 이슈 4사분면. 4 사분면 패턴 추출 |
| 17 | 1171281194 |
paired-rows-2x2 |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ |
2x2 페어드 행 — Zone 표 재구성 |
| 18 | 1171281195 |
compare-rows |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/compare-3col-badge.html (참고) |
BIM·DX 비교. 매칭 시스템 검증된 대표 frame. Zone 안 표 재구성 |
| 19 | 1171281197 |
cards-3-compare |
medium |
zone_extract |
auto_estimated |
(3 단 비교 — 패턴 추출) | 설계방식 왜곡 — 3 비교 패턴 추출 |
| 20 | 1171281198 |
cards-3-header |
medium |
zone_extract |
auto_estimated |
(3 헤더형 — 패턴 추출) | DX 는 S/W 가 필수 — 3 헤더 패턴 추출 |
| 21 | 1171281201 |
split-panel-diagram |
low |
zone_extract |
auto_estimated |
(분할 패널 — 패턴 추출) | Solution Engn. S/W. 분할 패널 패턴 일부 추출 |
| 22 | 1171281202 |
split-panel-numbered |
low |
zone_extract |
auto_estimated |
(분할 패널 + 번호 — 패턴 추출) | Model 특화 Engn. S/W. 분할 + 번호 패턴 추출 |
| 23 | 1171281203 |
table-2col |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ |
Application S/W 의 구분. table family 중복 — variant 통합 검토 |
| 24 | 1171281204 |
table-3col |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ |
Engn. S/W 구성과 특징. table family 중복 — variant 통합 검토 |
| 25 | 1171281205 |
left-categories-right-logos |
medium |
zone_extract |
auto_estimated |
(좌우 분할 — 패턴 추출) | 상용 Engn. S/W. 좌우 분할 패턴 추출 |
| 26 | 1171281206 |
cards-4-grid |
medium |
zone_extract |
auto_estimated |
(4 카드 — 패턴 추출) | 상용 S/W 의존 4 대 문제. 4 카드 그리드 추출 |
| 27 | 1171281208 |
central-split-synthesis |
low |
zone_extract |
auto_estimated |
(중앙 합성 — 일부 추출) | 건설산업 고부가가치화. 중앙 + 양쪽 패턴 일부 추출 |
| 28 | 1171281209 |
title-plus-3-emphasis |
medium |
zone_extract |
auto_estimated |
(제목 + 3 강조 — 패턴 추출) | 현존 상용 S/W 의 현실. 제목 + 3 카드 패턴 추출 |
| 29 | 1171281210 |
banner-top-2col-bottom |
low |
zone_extract |
auto_estimated |
(banner + 2col 복합 — 패턴 추출) | Process/Product 혁신 (AS-IS/TO-BE). Zone 안에서 banner + 2col 패턴만 추출 |
| 30 | 1171281211 |
table-3col |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ |
산업별 현황. table family 중복 — variant 통합 검토 |
| 31 | 1171281212 |
table-3col |
high |
zone_adapt |
auto_estimated |
templates/blocks/tables/ |
산업별 특성과 발전방향. table family 중복 — variant 통합 검토 |
| 32 | 1171281213 |
central-5-goals |
low |
zone_extract |
auto_estimated |
(5 목표 복합 — 일부 추출) | 정책 달성. 중앙 5 목표 패턴 일부 추출 |
자동 추정 룰
layout 패턴 → Zone 적용 방식
| 패턴 / family | Zone 적용 방식 | Zone 적합성 | 근거 |
|---|---|---|---|
list-* (단순 리스트) |
zone_direct |
high |
구조 단순 — Zone 안 그대로 |
compare-rows / table-*col / paired-rows-* (표 / 페어드) |
zone_adapt |
high |
표 구조 — Zone 사이즈 맞춰 재구성 |
cycle-* / circular-* / radial-* / quadrilateral-* (시각 다이어그램) |
zone_adapt |
medium |
시각 디자인 — Zone 사이즈 맞춰 SVG 재구성 |
cards-3-* / persona-3col / 3-column / cards-4-grid / quadrant-4 / 3-section-* (3·4 단 카드 / 칼럼) |
zone_extract |
medium |
패턴 일부 추출 (카드 / 칼럼) |
side-* / left-*-right-* / title-plus-* (좌우 / 제목+카드) |
zone_extract |
medium |
부분 패턴 추출 |
banner-top-*-bottom / bullet-cards-*-plus-center / policy-*-plus-list (복합) |
zone_extract |
low |
복합 구조 — Zone 에서는 일부만 추출 |
split-panel-* / central-* (분할 / 중앙 합성) |
zone_extract |
low |
새 시각 패턴 — 일부 추출 |
full-page-map-* (지도 / 배너) |
reference_only |
reference |
콘텐츠 슬롯형 X — 디자인 참고만 |
분포 요약
Zone 적용 방식
| 적용 방식 | 개수 | Frame |
|---|---|---|
zone_direct |
2 | 03, 09 |
zone_adapt |
11 | 01, 04, 07, 10, 12, 17, 18, 23, 24, 30, 31 |
zone_extract |
18 | 02, 05, 08, 11, 13, 14, 15, 16, 19, 20, 21, 22, 25, 26, 27, 28, 29, 32 |
reference_only |
1 | 06 |
reject |
0 | — |
합계 검증 : 2 + 11 + 18 + 1 + 0 = 32 ✓
Zone 적합성
| 적합성 | 개수 | Frame |
|---|---|---|
high |
9 | 03, 07, 09, 17, 18, 23, 24, 30, 31 |
medium |
15 | 01, 04, 05, 08, 10, 11, 12, 13, 14, 16, 19, 20, 25, 26, 28 |
low |
7 | 02, 15, 21, 22, 27, 29, 32 |
reference |
1 | 06 |
합계 검증 : 9 + 15 + 7 + 1 = 32 ✓
검토 상태
| review_status | 개수 | Frame |
|---|---|---|
auto_estimated |
30 | (04, 06 제외 모두) |
needs_review |
0 | (04, 06 사용자 확정 완료) |
user_confirmed |
2 | 04 (zone_extract 확정), 06 (reference_only 확정) |
핵심 메시지
모든 frame 은 최종적으로 Zone 에 맞게 들어간다. 원본이 full-slide 인지 아닌지는 참고 정보일 뿐, 최종 사용 단위는 Zone 이다.
- 사용자가 의미한 "needs_split" = 실제 의미는
zone_extract또는zone_adapt- frame 은 디자인 레퍼런스 / 구조 패턴 / 슬롯 힌트
- Phase Z output 은 항상 Zone 에 맞는 재구성 결과
다음 단계
✅ 완료 (1 차)
- 32 frame 자동 추정 표 작성
- Frame 04, 06 사용자 확정 (
user_confirmed) - 컬럼명 정정 :
legacy 대응 블록(참고, 미검증)→legacy 스타일 출처(참고)
✅ 완료 (2 차, 2026-04-28) — Phase Z Frame Style Inventory 작성
산출물 : PHASE-Z-FRAME-STYLE-INVENTORY.md
- Source Policy : 메인 (
figma_to_html_agent/blocks/32 frame) / 토큰 (templates/styles/tokens/) / legacy (templates/blocks/structures/) - Frame Inventory 32 행 (변환 14 + 미변환 18 보일러플레이트)
- Token Inventory 18 행 (
covered7 /gap_candidate5 /hierarchy_mapping_only3 /hold_recheck_after_conversion3) - Legacy Reference 6 행 (모두
delete_after_extract후보)
⚠️ inventory = 추출 / 검증 단계. 실제 token 파일 생성 / 변경 / catalog 설계 / templates/blocks 삭제 등 실행은 별도 승인 단계.
후속 작업
- 3차 — Frame 14 anchor_sets 재라벨링 (02-2.2 매칭 실패 교정 — 매칭 성능 교정 작업, 별도 진행)
- 추가 — table family (23/24/30/31) variant 통합 설계 (Phase Z catalog 작성 시)
- 확정 처리 — 2 차 조사 결과 후 high confidence frame 부터
user_confirmed일괄 처리
부록 — 제외 / 특수 항목
1171281171 은 texts.md 만 존재하고 index.html / analysis.md 가 없어 Phase Z frame / style inventory 메인 대상에서 제외한다. 정체는 미확인.