add: figma_to_html_agent/blocks/ + 변환 도구 docs 갱신
전체 401 files (397 추가 + 4 수정), 14304 insertions.
추가:
- figma_to_html_agent/blocks/ — Figma 변환 결과 (32 frame, ~79MB).
각 frame folder = {analysis.md, flat.md, texts.md, index.html, assets/,
_renders/, _render.py, RELATIONSHIPS.md / STATUS.md / classification.md
(일부 frame)}.
Phase Z 의 *figma source layer* — runtime 에서 직접 사용 X, contract /
partial / builder adapter (미래 axis A) 의 source.
- figma_to_html_agent/DISCUSSION-SUMMARY-20260411.md — 변환 설계 회의 기록.
- figma_to_html_agent/HARNESS.md — 변환 검증 harness.
- figma_to_html_agent/scripts/fetch_figma_screenshots.py — Figma 스크린샷 자동 수집.
수정:
- figma_to_html_agent/PROCESS-CONTROL.md / PROCESS.md / RULES.md —
변환 프로세스 / 룰 갱신 (R8/R9 lock 강화 등).
- figma_to_html_agent/blocks_index.md — 32 frame 인덱스 갱신.
Phase Z 영향 0 (figma_to_html_agent/blocks/ 가 V4 catalog +
templates/phase_z2/families adapter 의 source — runtime 에서 직접 import X).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
58
figma_to_html_agent/blocks/1171281201/analysis.md
Normal file
58
figma_to_html_agent/blocks/1171281201/analysis.md
Normal file
@@ -0,0 +1,58 @@
|
||||
# Frame 1171281201 — Solution Engn. S/W
|
||||
|
||||
## 내용 설명
|
||||
|
||||
Solution Engineering S/W의 구성 요소를 좌우 split panel 다이어그램과
|
||||
라벨로 표현하는 개념도. 협업·맞춤형·User 중심·시공 결론으로 이어지는
|
||||
솔루션 엔지니어링의 흐름과 개념을 도식화. 솔루션 엔지니어링 개념도·
|
||||
구성 요소 다이어그램·좌우 split 구조 개념 설명에 적합.
|
||||
단순 비교·시간 순서·4개 이상 병렬 나열에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
Solution, Engineering, Engn, S/W, 협업, 맞춤형, User, 시공
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **solution_engn_sw**: Solution, Engineering, Engn, S/W
|
||||
- **solution_concepts**: 협업, 맞춤형, User, 시공
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: diagram
|
||||
- **layout**: split-panel-diagram
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 4 / min 3 / max 5
|
||||
- **slots** (4개, required 4개): title, left_panel, right_panel, flow_labels
|
||||
- **source title**: Solution Engn. S/W
|
||||
- **original layout**: split-panel-diagram
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 솔루션 엔지니어링 개념도
|
||||
- 좌우 split 구조 개념 설명
|
||||
- 구성 요소 + 흐름 다이어그램
|
||||
|
||||
### not_suits
|
||||
- 시간 순서 단계
|
||||
- 단순 2개 비교
|
||||
- 단일 개념 정의
|
||||
- 4개 이상 병렬 나열
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **split**: False
|
||||
- **merge**: False
|
||||
- **infer_missing_slot**: False
|
||||
- **rewrite_label**: True
|
||||
- **rewrite_body**: True
|
||||
|
||||
## 메타
|
||||
|
||||
- schema_version: template-fit-v1 mirror
|
||||
- source_of_truth: structure_ontology.yaml + keyword_base.yaml
|
||||
- structure_content_original_tagged_by: claude-opus-4-7 (2026-04-21)
|
||||
- keyword_base_sync_at: 2026-04-22
|
||||
- anchor_sets_cleaned_at: 2026-04-22
|
||||
@@ -0,0 +1,17 @@
|
||||
# Frame 1171281201 — Solution Engn. S/W
|
||||
|
||||
## 구조
|
||||
- **layout**: split-panel-diagram
|
||||
- **detail**: 타이틀("Solution Engn. S/W") + 좌우 split panel 다이어그램 (라벨 포함 순환/매트릭스)
|
||||
|
||||
## 내용
|
||||
Solution Engineering S/W — 협업·맞춤형·User 중심·시공 결론으로 이어지는 솔루션 엔지니어링 다이어그램.
|
||||
|
||||
## 후보 키워드
|
||||
Solution, SolutionEngineering, Engn.S/W, EngineeringSW, 협업, User, 맞춤형, 시공, 결론, split-panel, 다이어그램
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 133 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 611 KiB |
19
figma_to_html_agent/blocks/1171281201/flat.md
Normal file
19
figma_to_html_agent/blocks/1171281201/flat.md
Normal file
@@ -0,0 +1,19 @@
|
||||
# Frame 1171281201 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 1889 × 824 px (node 145:8310)
|
||||
> 패턴: split-panel-diagram (좌: 다이어그램 이미지, 우: 번호 항목)
|
||||
> Scale: 1280 / 1889 = 0.67761
|
||||
|
||||
## 구조
|
||||
|
||||
1171281202와 유사 구조. 좌:이미지 기반 다이어그램, 우:4개 번호 항목, 하단 결론 바.
|
||||
|
||||
## 에셋 (14개)
|
||||
|
||||
모두 이미지 유지 (다이어그램 요소, 번호 뱃지, 행 바, 화살표, 결론 바 등)
|
||||
|
||||
## 변형 가능 축
|
||||
|
||||
- diagram_image (required)
|
||||
- right_items[N=3~6] (required)
|
||||
- conclusion_text (optional)
|
||||
197
figma_to_html_agent/blocks/1171281201/index.html
Normal file
197
figma_to_html_agent/blocks/1171281201/index.html
Normal file
@@ -0,0 +1,197 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>Solution Engn. S/W (Frame 1171281201)</title>
|
||||
<!--
|
||||
Frame: 145:8310, 1889×824 px
|
||||
Scale: 1280 / 1889 = 0.67761
|
||||
패턴: split-panel-diagram
|
||||
구조: R17 (좌:absolute 이미지 / 우:flex column) + R19 zoom
|
||||
1171281202와 동일 패턴
|
||||
-->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;900&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
* { margin:0; padding:0; box-sizing:border-box; }
|
||||
body {
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
background: #e8ecf0;
|
||||
display: flex; justify-content: center; align-items: center;
|
||||
min-height: 100vh; word-break: keep-all;
|
||||
}
|
||||
.slide {
|
||||
width: 1280px;
|
||||
background: #fff; position: relative;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,.15);
|
||||
}
|
||||
.block { width: 1280px; position: relative; overflow: hidden; }
|
||||
.inner {
|
||||
width: 1889px;
|
||||
height: 824px; /* 원본 Figma 프레임 높이 (min-height → height 고정) */
|
||||
zoom: 0.67761; /* R19 */
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
/* 좌측 (이미지 다이어그램, absolute) */
|
||||
.left-panel {
|
||||
flex: none;
|
||||
width: 1100px;
|
||||
position: relative;
|
||||
overflow: hidden; /* diagram bg(1199px)가 panel(1100px) 밖으로 넘치는 것 차단 */
|
||||
}
|
||||
.left-panel .abs { position: absolute; }
|
||||
.left-panel .abs img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.left-panel .lbl {
|
||||
position: absolute; transform: translate(-50%, -50%);
|
||||
font-weight: 700; font-size: 35px; line-height: 50px;
|
||||
color: #fff; text-align: center;
|
||||
text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.left-panel .lbl-dark {
|
||||
color: #073b46; font-size: 50px;
|
||||
}
|
||||
|
||||
/* 우측 (flex column, R17) */
|
||||
.right-panel {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 25px;
|
||||
padding: 78px 0 20px 22px;
|
||||
}
|
||||
.num-row {
|
||||
display: flex; align-items: center;
|
||||
}
|
||||
.num-row .badge { flex: none; width: 88px; height: 93px; z-index: 2; }
|
||||
.num-row .badge img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.num-row .bar-area { flex: 1; position: relative; margin-left: -40px; }
|
||||
.num-row .bar-bg { width: 100%; height: 97px; overflow: hidden; }
|
||||
.num-row .bar-bg img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.num-row .bar-text {
|
||||
position: absolute; left: 80px; top: 50%; transform: translateY(-50%);
|
||||
font-weight: 500; font-size: 45px; line-height: 60px;
|
||||
color: #11231d; text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
}
|
||||
.num-row .arrow { flex: none; width: 48px; height: 45px; margin-left: 5px; }
|
||||
.num-row .arrow img { width: 100%; height: 100%; transform: rotate(180deg); }
|
||||
|
||||
/* 결론 바 (전체 폭) */
|
||||
.conclusion-bar {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 109px;
|
||||
}
|
||||
.conclusion-bar .bar-left { flex: none; width: 191px; height: 109px; }
|
||||
.conclusion-bar .bar-left img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.conclusion-bar .bar-center { flex: 1; height: 107px; overflow: hidden; }
|
||||
.conclusion-bar .bar-center img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.conclusion-bar .bar-right { flex: none; width: 192px; height: 109px; }
|
||||
.conclusion-bar .bar-right img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.conclusion-bar .bar-text {
|
||||
position: absolute; left: 112px; top: 50%; transform: translateY(-50%);
|
||||
font-size: 0; line-height: 0;
|
||||
text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- 좌측: 다이어그램 -->
|
||||
<div class="left-panel">
|
||||
<!-- 타이틀 -->
|
||||
<div class="abs" style="left:61px; top:13px; width:38.05px; height:40px;"><img src="assets/bd3796e13b417d32322b3cd6d3962f892c52ec9b.png" alt=""></div>
|
||||
<div style="position:absolute; left:112px; top:24px; transform:translateY(-50%); font-size:0; line-height:0;">
|
||||
<span style="font-weight:900; font-size:70px; line-height:55px; background:linear-gradient(rgb(204,82,0),rgb(136,55,0)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;">Solution </span>
|
||||
<span style="font-weight:900; font-size:50px; line-height:55px; background:linear-gradient(#296b55,#000); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;">Engn. S/W</span>
|
||||
</div>
|
||||
<div class="abs" style="left:66.52px; top:45px; width:354.01px; height:36px;"><img src="assets/30a42d915fae64b2ac76c21c0b742c17a2604b9d.png" alt=""></div>
|
||||
|
||||
<!-- 다이어그램 배경 -->
|
||||
<div class="abs" style="left:0; top:96px; width:1199px; height:636px;"><img src="assets/ffb006a4a6b1e9a89bec9243f5751841d49d03fb.png" alt=""></div>
|
||||
|
||||
<!-- 중앙 오버레이 -->
|
||||
<div class="abs" style="left:285px; top:376px; width:630px; height:310px; overflow:hidden;">
|
||||
<img src="assets/88a805bbac947d4557c9f642ed3eca9e24b5e018.png" alt="" style="width:100%; height:203.23%; object-fit:cover;">
|
||||
</div>
|
||||
<div class="abs" style="left:413px; top:543px; width:374px; height:144px; overflow:hidden;">
|
||||
<img src="assets/9ff4d23761d3af448e52e197ef353d016e5da891.png" alt="" style="position:absolute; left:-3.59%; width:283.88%; height:100%;">
|
||||
</div>
|
||||
|
||||
<!-- 다이어그램 라벨 -->
|
||||
<div class="lbl lbl-dark" style="left:602.5px; top:608px; width:355px;">Solution<br>Engn. S/W</div>
|
||||
<div class="lbl" style="left:148.5px; top:614px; width:175px;">Model<br>Checker</div>
|
||||
<div class="lbl" style="left:188.5px; top:459px;">WatchBIM</div>
|
||||
<div class="lbl" style="left:304.5px; top:337px;">Domainer</div>
|
||||
<div class="lbl" style="left:1046.5px; top:608px; font-size:0;"><span style="font-size:30px;">B</span><span style="font-size:40px;">CM</span><span style="font-size:30px;">F</span></div>
|
||||
<div class="lbl" style="left:1003.5px; top:456px;">Zainer</div>
|
||||
<div class="lbl" style="left:895.5px; top:335px;">Twin Highway</div>
|
||||
<div class="lbl" style="left:405.5px; top:247px;">Platform Solutions</div>
|
||||
<div class="lbl" style="left:599.5px; top:189.5px; width:249px;">Construction Conference<br>Platform</div>
|
||||
<div class="lbl" style="left:759px; top:261px; width:274px;">공정계획</div>
|
||||
</div>
|
||||
|
||||
<!-- 우측: 번호 항목 (flex column, R17) -->
|
||||
<div class="right-panel">
|
||||
<div class="num-row">
|
||||
<div class="badge"><img src="assets/42dca7c1ca42ba8520aa274fd4471bd054dfe36b.png" alt=""></div>
|
||||
<div class="bar-area">
|
||||
<div class="bar-bg"><img src="assets/6c4cc6c01d98a38c747e1748bb49dec957a68e88.png" alt=""></div>
|
||||
<div class="bar-text">쉽고, 편리한 User 중심</div>
|
||||
</div>
|
||||
<div class="arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<div class="num-row">
|
||||
<div class="badge"><img src="assets/9d86013a10b048eede6cceb2012f7958dfaf616c.png" alt=""></div>
|
||||
<div class="bar-area">
|
||||
<div class="bar-bg"><img src="assets/6c4cc6c01d98a38c747e1748bb49dec957a68e88.png" alt=""></div>
|
||||
<div class="bar-text">협업 및 의사소통 강화</div>
|
||||
</div>
|
||||
<div class="arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<div class="num-row">
|
||||
<div class="badge"><img src="assets/470d76de62f4864e6c42b25bcf7446e2aaef981a.png" alt=""></div>
|
||||
<div class="bar-area">
|
||||
<div class="bar-bg"><img src="assets/6c4cc6c01d98a38c747e1748bb49dec957a68e88.png" alt=""></div>
|
||||
<div class="bar-text">Project별 맞춤형 생산</div>
|
||||
</div>
|
||||
<div class="arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<div class="num-row">
|
||||
<div class="badge"><img src="assets/7e83d2e4d7df471367df19708e2628010d586ed2.png" alt=""></div>
|
||||
<div class="bar-area">
|
||||
<div class="bar-bg"><img src="assets/6c4cc6c01d98a38c747e1748bb49dec957a68e88.png" alt=""></div>
|
||||
<div class="bar-text">시공 현장상황 반영 가능</div>
|
||||
</div>
|
||||
<div class="arrow"><img src="assets/7e7eb79fab4063fb496110af54e23e073145ec72.png" alt=""></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 결론 바 (전체 폭) -->
|
||||
<div class="conclusion-bar">
|
||||
<div class="bar-left"><img src="assets/790f895e55ada424dfbb0acec5a002d9f1fce88e.png" alt=""></div>
|
||||
<div class="bar-center"><img src="assets/3061aabdcf0f21f1791940b6d2d74a7b991ce746.png" alt=""></div>
|
||||
<div class="bar-right"><img src="assets/ee88228486a77b2af6c001209d3fbf862a9fbdbb.png" alt=""></div>
|
||||
<div class="bar-text">
|
||||
<span style="font-weight:700; font-size:47px; line-height:60px; color:#fff;">하나의 S/W에서 협업, 정보확인, 현장상황 반영이 가능한</span>
|
||||
<span style="font-weight:700; font-size:55px; line-height:60px; color:yellow;"> Solution Engn. S/W 필요</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
25
figma_to_html_agent/blocks/1171281201/texts.md
Normal file
25
figma_to_html_agent/blocks/1171281201/texts.md
Normal file
@@ -0,0 +1,25 @@
|
||||
# Frame 1171281201 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
## 타이틀
|
||||
Solution Engn. S/W
|
||||
|
||||
## 다이어그램 라벨
|
||||
Model Checker
|
||||
WatchBIM
|
||||
Domainer
|
||||
BCMF
|
||||
Zainer
|
||||
Twin Highway
|
||||
Platform Solutions
|
||||
Construction Conference Platform
|
||||
공정계획
|
||||
Solution Engn. S/W
|
||||
|
||||
## 우측 항목
|
||||
쉽고, 편리한 User 중심
|
||||
협업 및 의사소통 강화
|
||||
Project별 맞춤형 생산
|
||||
시공 현장상황 반영 가능
|
||||
|
||||
## 결론
|
||||
하나의 S/W에서 협업, 정보확인, 현장상황 반영이 가능한 Solution Engn. S/W 필요
|
||||
Reference in New Issue
Block a user