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>
1457
figma_to_html_agent/blocks/1171281171/texts.md
Normal file
63
figma_to_html_agent/blocks/1171281172/analysis.md
Normal file
@@ -0,0 +1,63 @@
|
||||
# Frame 1171281172 — S/W 개발 방향 순환도
|
||||
|
||||
## 내용 설명
|
||||
|
||||
S/W 개발 방향을 6개 노드(기술기반·디지털전환·품질향상·S/W 한계·
|
||||
개발목표·융합)의 순환/방사형 다이어그램으로 표현하는 디자인.
|
||||
기술기반 중요성, 디지털전환 직관지 역할, 품질향상과 호환성,
|
||||
기존 S/W 한계 인식, 개발목표 설정, 융합 필요성을 6개 노드로
|
||||
배치해 S/W 개발의 다면적 방향을 시각화. 6개 병렬 개념 순환도
|
||||
·S/W 개발 방향 다면 시각화에 적합. 3/4/5개 이하 항목·주체별
|
||||
나열·시간 순서·2개 비교·단일 개념 심층에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
S/W개발, 개발방향, 개발목표, 기술기반, 디지털전환, 품질향상, S/W한계, 융합, 호환성, 직관지
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **sw_development**: S/W개발, 개발방향, 개발목표
|
||||
- **six_core_concepts**: 기술기반, 디지털전환, 품질향상, S/W한계, 융합, 호환성
|
||||
- **directional_concepts**: 직관지
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: diagram
|
||||
- **layout**: circular-nodes-6
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 6 / min 6 / max 6
|
||||
- **slots** (7개, required 7개): title, node_1, node_2, node_3, node_4, node_5, node_6
|
||||
- **source title**: S/W 개발 방향 순환도
|
||||
- **original layout**: circular-nodes
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- S/W 개발 방향 순환도
|
||||
- 6개 병렬 개념 시각화
|
||||
- 다면적 방향성 다이어그램
|
||||
|
||||
### not_suits
|
||||
- 3개 또는 4개 이하 항목
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 시간 순서
|
||||
- 2개 비교
|
||||
- 단일 개념 심층
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281172 — S/W 개발 방향 순환도
|
||||
|
||||
## 구조
|
||||
- **layout**: circular-nodes
|
||||
- **detail**: 6개 노드 라벨(기술기반·디지털전환·품질향상·S/W한계·개발목표·융합)이 순환/방사형으로 배치된 다이어그램
|
||||
|
||||
## 내용
|
||||
S/W 개발 방향 순환도 — 기술기반 중요성, 디지털전환 직관지 역할, 품질향상과 호환성, 기존 S/W 한계 인식, 개발목표 설정, 융합 필요성.
|
||||
|
||||
## 후보 키워드
|
||||
S/W개발, 개발방향, 순환도, 기술기반, 디지털전환, 직관지, 품질향상, 호환성, S/W한계, 개발목표, 융합, 다이어그램
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
|
After Width: | Height: | Size: 137 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 77 KiB |
|
After Width: | Height: | Size: 144 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 1.7 MiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 54 KiB |
27
figma_to_html_agent/blocks/1171281172/flat.md
Normal file
@@ -0,0 +1,27 @@
|
||||
# Frame 1171281172 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 1579 × 981 px (node 145:8352)
|
||||
> 패턴: circular-nodes-6 (6개 원형 노드 다이어그램)
|
||||
> Scale: 1280 / 1579 = 0.81064
|
||||
|
||||
## 구조
|
||||
|
||||
2D 공간에 6개 원형 노드 + 중앙 이미지 + 배경 + 연결 이미지.
|
||||
absolute 배치 필수 (2D 시각 다이어그램).
|
||||
|
||||
## 노드 6개 (각각 원형 배경 + 내부 아이콘 + 라벨)
|
||||
|
||||
| 노드 | 라벨 | center 좌표 |
|
||||
|------|------|------------|
|
||||
| 145:8370 | 기술기반 중요성 | (180, 436) |
|
||||
| 145:8374 | 디지털전환 직관지 역할 | (319, 837) |
|
||||
| 145:8378 | 품질향상 & 호환성 | (896, 811) |
|
||||
| 145:8382 | 기존 S/W 한계 인식 | (1394, 573) |
|
||||
| 145:8386 | S/W 개발목표 설정 | (1293, 146) |
|
||||
| 145:8390 | 융합의 필요성 | (707, 147) |
|
||||
|
||||
## 에셋 (9개, 모두 이미지)
|
||||
|
||||
image 4009: 노드 배경 원 (×6 동일)
|
||||
image 4010: 노드 내부 아이콘 (×6 동일)
|
||||
기타: 배경, 중앙 이미지, 연결선 등
|
||||
130
figma_to_html_agent/blocks/1171281172/index.html
Normal file
@@ -0,0 +1,130 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>S/W 개발 방향 다이어그램 (Frame 1171281172)</title>
|
||||
<!--
|
||||
Frame: 145:8352, 1579×981 px
|
||||
Scale: 1280 / 1579 = 0.81064
|
||||
패턴: circular-nodes-6
|
||||
구조: 2D 다이어그램 → absolute + R19 zoom
|
||||
텍스트 라벨: design_context center 좌표 + translate(-50%,-50%)
|
||||
-->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@700&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;
|
||||
}
|
||||
.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: 1579px; height: 981px;
|
||||
zoom: 0.81064; /* R19 */
|
||||
position: relative;
|
||||
}
|
||||
.abs { position: absolute; }
|
||||
.abs img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.node-label {
|
||||
position: absolute;
|
||||
transform: translate(-50%, -50%);
|
||||
font-weight: 700; font-size: 45px; line-height: 60px;
|
||||
color: #fff; text-align: center;
|
||||
text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
word-break: keep-all;
|
||||
}
|
||||
/* 회전 래퍼 */
|
||||
.rot-wrap {
|
||||
position: absolute; display: flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.rot-wrap img { display: block; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- 배경 -->
|
||||
<div class="rot-wrap" style="left:0; top:37.26px; width:1579.22px; height:910.34px;">
|
||||
<div style="flex:none; transform:rotate(-8.84deg);"><img src="assets/0b6599f832b0f69b2038ead1ba6d95cdcc42c4cf.png" style="width:1490.97px; height:689.31px;"></div>
|
||||
</div>
|
||||
<div class="rot-wrap" style="left:158.1px; top:144px; width:1237.22px; height:713.19px;">
|
||||
<div style="flex:none; transform:rotate(-8.84deg);"><img src="assets/93b81ffe48e6fca68e58cef7a84def27cf91469e.png" style="width:1168.08px; height:540.03px; opacity:0.5;"></div>
|
||||
</div>
|
||||
|
||||
<!-- 중앙 이미지 -->
|
||||
<div class="abs" style="left:490px; top:262px; width:622px; height:437px;"><img src="assets/a902e39ab83c931afd5c93afcab26780b7d330b9.png"></div>
|
||||
<div class="abs" style="left:557px; top:323px; width:488px; height:287px;"><img src="assets/75bcffb34242270e352ef1b44dea1a9b6f3f4b7c.png"></div>
|
||||
|
||||
<!-- 장식 원 (동일 이미지 ×6) -->
|
||||
<div class="abs" style="left:40.32px; top:294.18px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
<div class="abs" style="left:179.73px; top:698.58px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
<div class="abs" style="left:568px; top:5px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
<div class="abs" style="left:1150.97px; top:5px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
<div class="abs" style="left:1253.51px; top:432.44px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
<div class="abs" style="left:756.95px; top:670.93px; width:278.81px; height:278.81px;"><img src="assets/c6aa15ac498406ca8f65ac71b1585a13002cd194.png"></div>
|
||||
|
||||
<!-- 연결선 이미지들 -->
|
||||
<div class="abs" style="left:331.81px; top:236.58px; width:261.53px; height:142.86px;"><img src="assets/a33ed237bbe2afff43a5bc9100be50c2331b6005.png"></div>
|
||||
<div class="rot-wrap" style="left:867.24px; top:46.26px; width:297.47px; height:240.63px;">
|
||||
<div style="flex:none; transform:rotate(25.2deg);"><img src="assets/a33ed237bbe2afff43a5bc9100be50c2331b6005.png" style="width:261.53px; height:142.86px;"></div>
|
||||
</div>
|
||||
<div class="rot-wrap" style="left:993.13px; top:587.98px; width:273.91px; height:167.03px;">
|
||||
<div style="flex:none; transform:rotate(-174.56deg);"><img src="assets/a33ed237bbe2afff43a5bc9100be50c2331b6005.png" style="width:261.53px; height:142.86px;"></div>
|
||||
</div>
|
||||
<div class="rot-wrap" style="left:462px; top:698.58px; width:294.72px; height:224.14px;">
|
||||
<div style="flex:none; transform:rotate(-159.87deg);"><img src="assets/a33ed237bbe2afff43a5bc9100be50c2331b6005.png" style="width:261.53px; height:142.86px;"></div>
|
||||
</div>
|
||||
<div class="rot-wrap" style="left:85.26px; top:587.98px; width:112.78px; height:196.81px;">
|
||||
<div style="flex:none; transform:rotate(-10.33deg);"><img src="assets/c21d9171275fc89f4db34d42d455fa41a006b348.png" style="width:80.85px; height:185.32px;"></div>
|
||||
</div>
|
||||
<div class="rot-wrap" style="left:1403.29px; top:246.32px; width:81.83px; height:185.74px;">
|
||||
<div style="flex:none; transform:rotate(-179.69deg);"><img src="assets/c21d9171275fc89f4db34d42d455fa41a006b348.png" style="width:80.85px; height:185.32px;"></div>
|
||||
</div>
|
||||
|
||||
<!-- 노드 배경 + 아이콘 + 라벨 ×6 -->
|
||||
<!-- 1: 기술기반 중요성 -->
|
||||
<div class="abs" style="left:35px; top:290px; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:75px; top:332px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:180.03px; top:436.21px;">기술기반<br>중요성</div>
|
||||
|
||||
<!-- 2: 디지털전환 직관지 역할 -->
|
||||
<div class="abs" style="left:174px; top:691px; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:214px; top:733px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:319.03px; top:837.21px;">디지털전환<br>직관지 역할</div>
|
||||
|
||||
<!-- 3: 품질향상 & 호환성 -->
|
||||
<div class="abs" style="left:751px; top:665px; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:791px; top:707px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:896.03px; top:811.21px; line-height:45px;">품질향상<br>&<br>호환성</div>
|
||||
|
||||
<!-- 4: 기존 S/W 한계 인식 -->
|
||||
<div class="abs" style="left:1249px; top:427px; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:1289px; top:469px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:1394.03px; top:573.21px;">기존 S/W<br>한계 인식</div>
|
||||
|
||||
<!-- 5: S/W 개발목표 설정 -->
|
||||
<div class="abs" style="left:1148px; top:0; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:1188px; top:42px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:1293.03px; top:146.21px;">S/W<br>개발목표<br>설정</div>
|
||||
|
||||
<!-- 6: 융합의 필요성 -->
|
||||
<div class="abs" style="left:562px; top:1px; width:290px; height:290px;"><img src="assets/311e27c78b94633cbcdbdebf4f4382b3944947c0.png"></div>
|
||||
<div class="abs" style="left:602px; top:43px; width:208px; height:208px;"><img src="assets/63887534bb17277ead4cfd833ab7ce939d9324d0.png"></div>
|
||||
<div class="node-label" style="left:707.03px; top:147.21px;">융합의<br>필요성</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
10
figma_to_html_agent/blocks/1171281172/texts.md
Normal file
@@ -0,0 +1,10 @@
|
||||
# Frame 1171281172 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
## 노드 라벨
|
||||
개발 패러다임
|
||||
기술기반 중요성
|
||||
디지털전환 직관지 역할
|
||||
품질향상 & 호환성
|
||||
기존 S/W 한계 인식
|
||||
S/W 개발목표 설정
|
||||
융합의 필요성
|
||||
63
figma_to_html_agent/blocks/1171281173/analysis.md
Normal file
@@ -0,0 +1,63 @@
|
||||
# Frame 1171281173 — Engineering S/W 개발 (Domain knowledge 기반)
|
||||
|
||||
## 내용 설명
|
||||
|
||||
Engineering S/W 개발을 위한 기술기반을 4가지 관점(Open Source 혁명·
|
||||
AI 발전·추론 기반 AI·코딩 기반 S/W)의 원형 라벨로 제시하는 디자인.
|
||||
중앙 강조 메시지 + 하단 설명으로 Domain knowledge(토목공학 지식)가
|
||||
기술에 반영되어야 함을 역설. 4가지 기술 트렌드 관점·Engineering S/W
|
||||
개발 기술기반·Open Source/AI 중심 기술 생태계 설명에 적합. 3개
|
||||
이하·5개 이상 항목·주체별 나열·시간 순서·필수요건 나열(기술/사람/
|
||||
자연)·2개 비교에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
OpenSource, AI, 추론기반AI, 코딩기반SW, DomainKnowledge, 토목공학, 지식기반, 기술기반, Engineering, EngineeringSW, S/W개발
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **tech_foundations**: OpenSource, AI, 추론기반AI, 코딩기반SW
|
||||
- **domain_knowledge**: DomainKnowledge, 토목공학, 지식기반, 기술기반
|
||||
- **engn_sw_dev**: Engineering, EngineeringSW, S/W개발
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: cards
|
||||
- **layout**: bullet-cards-4-plus-center
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 4 / min 4 / max 4
|
||||
- **slots** (7개, required 6개): title, pillar_1_label, pillar_2_label, pillar_3_label, pillar_4_label, center_message, description
|
||||
- **source title**: Engineering S/W 개발 (Domain knowledge 기반)
|
||||
- **original layout**: bullet-cards
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 4가지 기술 트렌드 관점
|
||||
- Engineering S/W 개발 기술기반
|
||||
- Open Source/AI 중심 기술 생태계
|
||||
|
||||
### not_suits
|
||||
- 3개 이하 항목
|
||||
- 5개 이상 항목
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 시간 순서
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
- 2개 비교
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281173 — Engineering S/W 개발 (Domain knowledge 기반)
|
||||
|
||||
## 구조
|
||||
- **layout**: bullet-cards
|
||||
- **detail**: 상단 4개 원형 라벨(Open Source 혁명, AI 발전, 추론 기반 AI, 코딩 기반 S/W) + 중앙 강조 + 하단 설명
|
||||
|
||||
## 내용
|
||||
Domain knowledge(토목공학 지식)이 반영될 수 있는 기술기반 — Engineering S/W 개발을 위한 Open Source·AI·추론·코딩 관점 정리.
|
||||
|
||||
## 후보 키워드
|
||||
Engineering, EngineeringSW, Domain knowledge, 토목공학, 지식기반, OpenSource, AI, 추론기반AI, 코딩기반SW, 기술기반, S/W개발
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
47
figma_to_html_agent/blocks/1171281173/texts.md
Normal file
@@ -0,0 +1,47 @@
|
||||
# Frame 1171281173 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출. nodeId: 182:2870
|
||||
|
||||
## 타이틀
|
||||
|
||||
Domain knowledge(토목공학 지식)이 반영될 수 있는 기술기반
|
||||
|
||||
## 서브타이틀
|
||||
|
||||
Engineering S/W 개발
|
||||
|
||||
## 원형 라벨 (상단 좌측 2개)
|
||||
|
||||
Open Source 혁명
|
||||
|
||||
AI 비약적 발전
|
||||
|
||||
## 원형 라벨 텍스트 (상단 오버레이)
|
||||
|
||||
AI
|
||||
|
||||
## 원형 라벨 (상단 우측 2개)
|
||||
|
||||
추론 기반 AI
|
||||
|
||||
코딩 기반 S/W
|
||||
|
||||
## 중앙 좌측 강조
|
||||
|
||||
시대적 변화
|
||||
|
||||
## 중앙 우측 강조
|
||||
|
||||
자료 중요성
|
||||
|
||||
## 하단 라벨 (좌측)
|
||||
|
||||
H/W 성능개선, S/W 고급화
|
||||
|
||||
## 하단 라벨 (우측)
|
||||
|
||||
S/W 개발 시 많은 시간 필요
|
||||
|
||||
## 하단 결론 바
|
||||
|
||||
정확한 지식기반 설계 메뉴얼
|
||||
42
figma_to_html_agent/blocks/1171281174/_render.py
Normal file
@@ -0,0 +1,42 @@
|
||||
from selenium import webdriver
|
||||
from selenium.webdriver.chrome.options import Options
|
||||
from PIL import Image
|
||||
import os, time
|
||||
|
||||
here = os.path.dirname(os.path.abspath(__file__))
|
||||
renders = os.path.join(here, '_renders')
|
||||
os.makedirs(renders, exist_ok=True)
|
||||
|
||||
opts = Options()
|
||||
opts.add_argument('--headless=new')
|
||||
opts.add_argument('--hide-scrollbars')
|
||||
opts.add_argument('--force-device-scale-factor=1')
|
||||
opts.add_argument('--window-size=1600,900')
|
||||
d = webdriver.Chrome(options=opts)
|
||||
|
||||
p = os.path.join(here, 'index.html').replace(os.sep, '/')
|
||||
d.get('file:///' + p)
|
||||
time.sleep(2.0)
|
||||
full_png = os.path.join(renders, '_full.png')
|
||||
d.save_screenshot(full_png)
|
||||
|
||||
r = d.execute_script(
|
||||
'const r=document.querySelector(".slide").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('slide bounds:', r)
|
||||
Image.open(full_png).crop(
|
||||
(int(r[0]), int(r[1]), int(r[0]+r[2]), int(r[1]+r[3]))
|
||||
).save(os.path.join(renders, 'slide.png'))
|
||||
|
||||
b = d.execute_script(
|
||||
'const r=document.querySelector(".block").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('block bounds:', b)
|
||||
Image.open(full_png).crop(
|
||||
(int(b[0]), int(b[1]), int(b[0]+b[2]), int(b[1]+b[3]))
|
||||
).save(os.path.join(renders, 'block.png'))
|
||||
|
||||
d.quit()
|
||||
print('OK')
|
||||
BIN
figma_to_html_agent/blocks/1171281174/_renders/_full.png
Normal file
|
After Width: | Height: | Size: 501 KiB |
BIN
figma_to_html_agent/blocks/1171281174/_renders/block.png
Normal file
|
After Width: | Height: | Size: 484 KiB |
BIN
figma_to_html_agent/blocks/1171281174/_renders/block_2x.png
Normal file
|
After Width: | Height: | Size: 1.5 MiB |
BIN
figma_to_html_agent/blocks/1171281174/_renders/slide.png
Normal file
|
After Width: | Height: | Size: 487 KiB |
62
figma_to_html_agent/blocks/1171281174/analysis.md
Normal file
@@ -0,0 +1,62 @@
|
||||
# Frame 1171281174 — 국외 BIM 수행 현황
|
||||
|
||||
## 내용 설명
|
||||
|
||||
국외 BIM 및 설계 업무 수행의 4가지 주요 특징을 번호별 리스트로
|
||||
제시하는 디자인. 항목: Claim 최소화 오류예방, 설계 업무 Data 정리
|
||||
필수, 기술업무 Manual 작성, 데이터 통합 및 관리. 국외 선진 사례
|
||||
특성 나열·자체 기술력 기반 수행 특징 정리·번호별 항목 4개 병렬
|
||||
제시에 적합. 3개 이하·5개 이상 항목·주체별 나열·2개 비교·시간
|
||||
순서 단계(step1→step2)·필수요건 나열에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
국외, BIM수행, Claim최소화, 오류예방, 설계Data, Manual, 기술업무, 데이터통합, 관리
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **overseas_bim**: 국외, BIM수행
|
||||
- **bim_practices**: Claim최소화, 오류예방, 설계Data, Manual, 기술업무, 데이터통합
|
||||
- **management**: 관리, 기술업무
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: list
|
||||
- **layout**: list-numbered-4
|
||||
- **axis**: vertical
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 4 / min 4 / max 4
|
||||
- **slots** (5개, required 5개): title, item_1, item_2, item_3, item_4
|
||||
- **source title**: 국외 BIM 수행 현황
|
||||
- **original layout**: list-numbered
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 국외 선진 사례 특성 4항목
|
||||
- 자체 기술력 기반 수행 특징
|
||||
- 번호별 4 병렬 리스트
|
||||
|
||||
### not_suits
|
||||
- 3개 이하 항목
|
||||
- 5개 이상 항목
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 2개 비교
|
||||
- 시간 순서 단계
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281174 — 국외 BIM 수행 현황
|
||||
|
||||
## 구조
|
||||
- **layout**: list-numbered
|
||||
- **detail**: 타이틀("국외") + 번호별 4개 항목 리스트(01~04)
|
||||
|
||||
## 내용
|
||||
국외 BIM/설계 업무 수행 특징 — Claim 최소화, 설계 업무 Data 정리 필수, 기술업무 Manual 작성, 데이터 통합 및 관리.
|
||||
|
||||
## 후보 키워드
|
||||
국외, BIM수행, Claim최소화, 오류예방, 설계Data, Manual, 기술업무, 데이터통합, 관리, 자체기술력
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
BIN
figma_to_html_agent/blocks/1171281174/assets/arrow_chain.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/badge_01.png
Normal file
|
After Width: | Height: | Size: 5.4 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/badge_02.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/badge_03.png
Normal file
|
After Width: | Height: | Size: 6.0 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/badge_04.png
Normal file
|
After Width: | Height: | Size: 5.8 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/globe.png
Normal file
|
After Width: | Height: | Size: 170 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/header_pill.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/pin_icon.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/scene.png
Normal file
|
After Width: | Height: | Size: 4.3 MiB |
BIN
figma_to_html_agent/blocks/1171281174/assets/text_bubble.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
80
figma_to_html_agent/blocks/1171281174/flat.md
Normal file
@@ -0,0 +1,80 @@
|
||||
# Frame 1171281174 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 1728 × 657 px (node 182:2810, file 9S6LsQyO6zlRxtiqZccOUM, page 29:373)
|
||||
> 패턴: scene-with-numbered-list-4 (좌:장면 이미지+글로브, 우:번호 4개 + brown pill 텍스트 버블)
|
||||
> Scale: 1280 / 1728 = **0.74074** → 슬라이드 안 1280 × 486.7 px 차지
|
||||
|
||||
## 구조 (bottom-up)
|
||||
|
||||
```
|
||||
Frame 182:2810 "Frame 1171281174" (1728 × 657)
|
||||
├─ rounded-rect 182:2811 "image 3939" (0, 0) 447×133 ← header_pill.png (브라운 pill 배경)
|
||||
├─ TEXT 182:2812 "국외" center=(223.5, 68), top-left=(46, 23) 355×90 — 60px Bold 흰색, tracking -1.8, line-height 90
|
||||
├─ rounded-rect 182:2813 "image 3940" (0, 19) 75×88 ← pin_icon.png (pin/marker 아이콘)
|
||||
│
|
||||
├─ rounded-rect 182:2825 "image 3949" (53, 139) 815×465 ← scene.png (건설 현장 합성 이미지, opacity 0.7, radius 27)
|
||||
├─ rounded-rect 182:2826 "image 3951" (718, 159) 127×126 ← globe.png (구 모양 아이콘, border 3 white, radius 132.5, opacity 0.8)
|
||||
├─ rounded-rect 182:2828 "image 3957" (825, 86) 115×571 ← arrow_chain.png (수직 화살표 체인, 4개 노드를 연결)
|
||||
│
|
||||
├─ rounded-rect 182:2814 "image 3953" (954, 136) 760×97 ← text_bubble.png (브라운 둥근 막대)
|
||||
├─ rounded-rect 182:2815 "image 3954" (954, 266) 760×97 ← text_bubble.png (재사용)
|
||||
├─ rounded-rect 182:2816 "image 3955" (954, 407) 760×97 ← text_bubble.png (재사용)
|
||||
├─ rounded-rect 182:2817 "image 3956" (954, 543) 760×97 ← text_bubble.png (재사용)
|
||||
│
|
||||
├─ TEXT 182:2818 "오류에 의한 Claim 최소화" (1033, 149) 695×60 — 45px Medium #11231D, leading 60, text-shadow
|
||||
├─ TEXT 182:2819 "설계 업무 시 사업 Data 정리 필수" (1033, 285) 695×60
|
||||
├─ TEXT 182:2820 "자체적인 기술업무 Manual 작성" (1033, 421) 695×60
|
||||
├─ TEXT 182:2821 "데이터 통합 및 관리" (1033, 562) 695×60
|
||||
│
|
||||
├─ rounded-rect 182:2822 "01 2" (906, 117) 89×93 ← badge_01.png (번호 1 + 우측 화살표)
|
||||
├─ rounded-rect 182:2823 "02 2" (906, 238) 89×93 ← badge_02.png
|
||||
├─ rounded-rect 182:2824 "03 2" (906, 376) 89×93 ← badge_03.png
|
||||
└─ rounded-rect 182:2827 "04 1" (906, 509) 89×93 ← badge_04.png (이름 suffix만 다름)
|
||||
```
|
||||
|
||||
## 에셋 (10개)
|
||||
|
||||
| 파일 | 의미 | 크기 | 사용 횟수 |
|
||||
|------|------|------|---------|
|
||||
| `assets/header_pill.png` | 좌상단 브라운 pill 헤더 배경 | 447×133 | 1 |
|
||||
| `assets/pin_icon.png` | pin/marker 아이콘 (헤더 위 겹침) | 75×88 | 1 |
|
||||
| `assets/scene.png` | 건설 현장 합성 메인 이미지 (4.5MB) | 815×465 | 1 (opacity 0.7) |
|
||||
| `assets/globe.png` | 구 모양 원형 아이콘 (장면 위) | 127×126 | 1 (opacity 0.8, white border) |
|
||||
| `assets/arrow_chain.png` | 수직 화살표 체인 (장면→번호 연결) | 115×571 | 1 |
|
||||
| `assets/text_bubble.png` | 브라운 둥근 막대 배경 | 760×97 | **4** (재사용) |
|
||||
| `assets/badge_01.png` | 번호 1 (chevron 우측 화살표 포함) | 89×93 | 1 |
|
||||
| `assets/badge_02.png` | 번호 2 | 89×93 | 1 |
|
||||
| `assets/badge_03.png` | 번호 3 | 89×93 | 1 |
|
||||
| `assets/badge_04.png` | 번호 4 (Figma 이름 suffix `_1` 다름, 비주얼 동일) | 89×93 | 1 |
|
||||
|
||||
## 이상 탐지 결과
|
||||
|
||||
| 검사 | 결과 |
|
||||
|------|------|
|
||||
| 회전 단일문자 | 없음 |
|
||||
| 좁은 박스 세로 텍스트 | 없음 |
|
||||
| 중복 노드 (동일 좌표 + 동일 내용) | 없음. text_bubble은 동일 src 4× 재사용 — 정상 |
|
||||
| Vector 좌표 metadata vs design_context 불일치 | 일치 |
|
||||
| 회전 적용 (bbox vs render 차이) | 없음 (모두 정사각형 또는 가로 배치) |
|
||||
| z-order 비정상 | scene(이미지 3949)가 badges 01-03 다음 순서로 그려짐 → 시각 영향 없음 (위치 비겹침) |
|
||||
|
||||
## 변형 가능 축
|
||||
|
||||
- **list_items[N=4] (required)** — 번호 4개 항목, cardinality=4 고정 (analysis.md)
|
||||
- `text` (required, 한 줄, 45px 분량)
|
||||
- `header_pill` (required) — 좌상단 카테고리 헤더 ("국외" 외 다른 텍스트 가능)
|
||||
- `header_pin` (optional) — pin 아이콘
|
||||
- `scene_image` (optional) — 메인 합성 이미지. 없으면 박스 자리만 차지하거나 단색 fill
|
||||
- `globe_overlay` (optional) — 원형 오버레이 아이콘
|
||||
- `arrow_chain` (required) — 장면과 리스트 연결하는 수직 체인
|
||||
- `numbered_badges[N=list_items.length]` (required) — 번호별 PNG 배지
|
||||
|
||||
## Sub-patterns
|
||||
|
||||
- `scene-photo-with-circle-overlay` — 큰 합성 이미지 + 원형 아이콘 오버레이 (R16 비슷한 프레임 배치 패턴)
|
||||
- `numbered-pill-list` — 번호 배지 + 옆 pill 텍스트 막대 N개 (1171281180 stacked-arrow-list와 다름: 여기는 평행 배열, 1171281180은 계단)
|
||||
|
||||
## 임시 보정 (1:1, 템플릿화 시 재고려)
|
||||
|
||||
- 번호 배지를 PNG로 유지 (CSS 변환 시 1171281174의 chevron 모양 + 번호 폰트 동시 재현 필요 → 향후 svg/ 폴더로 정리)
|
||||
- text_bubble을 PNG로 유지 (CSS gradient/border-radius로 변환 가능 → 프로모션 시 CSS화 후보)
|
||||
205
figma_to_html_agent/blocks/1171281174/index.html
Normal file
@@ -0,0 +1,205 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>국외 BIM 수행 현황 (Frame 1171281174)</title>
|
||||
<!--
|
||||
Frame: 182:2810, 1728 × 657 px (Frame 1171281174)
|
||||
Source: file 9S6LsQyO6zlRxtiqZccOUM, page 29:373
|
||||
Scale: 1280 / 1728 = 0.74074 (zoom on .inner per R19)
|
||||
패턴: scene-with-numbered-list-4
|
||||
구조: 좌(헤더 pill + scene + 글로브) / 우(수직 화살표 체인 + 번호 배지 4개 + 텍스트 버블)
|
||||
-->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<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; height: 720px;
|
||||
background: #fff;
|
||||
position: relative; overflow: hidden;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,.15);
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.block {
|
||||
width: 1280px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.inner {
|
||||
width: 1728px; height: 657px;
|
||||
position: relative;
|
||||
zoom: 0.74074;
|
||||
}
|
||||
|
||||
/* ① 메인 장면 이미지 (배경) */
|
||||
.scene {
|
||||
position: absolute;
|
||||
left: 53px; top: 139px;
|
||||
width: 815px; height: 465px;
|
||||
border-radius: 27px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.scene img {
|
||||
width: 100%; height: 100%;
|
||||
object-fit: cover;
|
||||
opacity: 0.7;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* ② 글로브 오버레이 (원형, 흰 테두리) */
|
||||
.globe {
|
||||
position: absolute;
|
||||
left: 718px; top: 159px;
|
||||
width: 127px; height: 126px;
|
||||
border: 3px solid white;
|
||||
border-radius: 132.5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.globe img {
|
||||
width: 100%; height: 100%;
|
||||
object-fit: cover;
|
||||
opacity: 0.8;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* ③ 좌상단 헤더 pill */
|
||||
.header-pill {
|
||||
position: absolute;
|
||||
left: 0; top: 0;
|
||||
width: 447px; height: 133.005px;
|
||||
}
|
||||
.header-pill img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
|
||||
/* ④ pin 아이콘 (헤더 위에 겹침) */
|
||||
.pin {
|
||||
position: absolute;
|
||||
left: 0; top: 19px;
|
||||
width: 75px; height: 87.662px;
|
||||
}
|
||||
.pin img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
|
||||
/* ⑤ "국외" 타이틀 텍스트 */
|
||||
.title-text {
|
||||
position: absolute;
|
||||
left: 46px; top: 23px;
|
||||
width: 355px; height: 90px;
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 60px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
letter-spacing: -1.8px;
|
||||
line-height: 90px;
|
||||
text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
/* ⑥ 수직 화살표 체인 (장면 → 리스트) */
|
||||
.arrow-chain {
|
||||
position: absolute;
|
||||
left: 825px; top: 86px;
|
||||
width: 115px; height: 571px;
|
||||
}
|
||||
.arrow-chain img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
|
||||
/* ⑦ 텍스트 버블 4개 (브라운 pill 배경) */
|
||||
.bubble {
|
||||
position: absolute;
|
||||
left: 954px;
|
||||
width: 760px; height: 97px;
|
||||
}
|
||||
.bubble img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.bubble--1 { top: 136px; }
|
||||
.bubble--2 { top: 266px; }
|
||||
.bubble--3 { top: 407px; }
|
||||
.bubble--4 { top: 543px; }
|
||||
|
||||
/* ⑧ 텍스트 라벨 4개 */
|
||||
.label {
|
||||
position: absolute;
|
||||
left: 1033px;
|
||||
width: 695px; height: 60px;
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 45px;
|
||||
color: #11231D;
|
||||
text-shadow: 0 0 4px rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.label > p { margin: 0; line-height: 60px; }
|
||||
.label--1 { top: 149px; } /* center_y=179, h=60 → top=149 */
|
||||
.label--2 { top: 285px; }
|
||||
.label--3 { top: 421px; }
|
||||
.label--4 { top: 562px; }
|
||||
|
||||
/* ⑨ 번호 배지 4개 */
|
||||
.badge {
|
||||
position: absolute;
|
||||
left: 906px;
|
||||
width: 89px; height: 93px;
|
||||
}
|
||||
.badge img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.badge--1 { top: 117px; }
|
||||
.badge--2 { top: 238px; }
|
||||
.badge--3 { top: 376px; }
|
||||
.badge--4 { top: 509px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- ① 장면 이미지 (배경, opacity 0.7) -->
|
||||
<div class="scene"><img src="assets/scene.png" alt=""></div>
|
||||
|
||||
<!-- ② 글로브 오버레이 -->
|
||||
<div class="globe"><img src="assets/globe.png" alt=""></div>
|
||||
|
||||
<!-- ③ 좌상단 헤더 pill -->
|
||||
<div class="header-pill"><img src="assets/header_pill.png" alt=""></div>
|
||||
|
||||
<!-- ④ pin 아이콘 -->
|
||||
<div class="pin"><img src="assets/pin_icon.png" alt=""></div>
|
||||
|
||||
<!-- ⑤ "국외" 타이틀 -->
|
||||
<div class="title-text">국외</div>
|
||||
|
||||
<!-- ⑥ 수직 화살표 체인 -->
|
||||
<div class="arrow-chain"><img src="assets/arrow_chain.png" alt=""></div>
|
||||
|
||||
<!-- ⑦ 텍스트 버블 4개 -->
|
||||
<div class="bubble bubble--1"><img src="assets/text_bubble.png" alt=""></div>
|
||||
<div class="bubble bubble--2"><img src="assets/text_bubble.png" alt=""></div>
|
||||
<div class="bubble bubble--3"><img src="assets/text_bubble.png" alt=""></div>
|
||||
<div class="bubble bubble--4"><img src="assets/text_bubble.png" alt=""></div>
|
||||
|
||||
<!-- ⑧ 텍스트 라벨 4개 -->
|
||||
<div class="label label--1"><p>오류에 의한 Claim 최소화</p></div>
|
||||
<div class="label label--2"><p>설계 업무 시 사업 Data 정리 필수</p></div>
|
||||
<div class="label label--3"><p>자체적인 기술업무 Manual 작성</p></div>
|
||||
<div class="label label--4"><p>데이터 통합 및 관리</p></div>
|
||||
|
||||
<!-- ⑨ 번호 배지 4개 -->
|
||||
<div class="badge badge--1"><img src="assets/badge_01.png" alt="1"></div>
|
||||
<div class="badge badge--2"><img src="assets/badge_02.png" alt="2"></div>
|
||||
<div class="badge badge--3"><img src="assets/badge_03.png" alt="3"></div>
|
||||
<div class="badge badge--4"><img src="assets/badge_04.png" alt="4"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
25
figma_to_html_agent/blocks/1171281174/texts.md
Normal file
@@ -0,0 +1,25 @@
|
||||
# Frame 1171281174 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출. nodeId: 182:2810
|
||||
|
||||
## 타이틀
|
||||
|
||||
국외
|
||||
|
||||
## 본문 (번호별 항목)
|
||||
|
||||
### 01
|
||||
|
||||
오류에 의한 Claim 최소화
|
||||
|
||||
### 02
|
||||
|
||||
설계 업무 시 사업 Data 정리 필수
|
||||
|
||||
### 03
|
||||
|
||||
자체적인 기술업무 Manual 작성
|
||||
|
||||
### 04
|
||||
|
||||
데이터 통합 및 관리
|
||||
62
figma_to_html_agent/blocks/1171281175/analysis.md
Normal file
@@ -0,0 +1,62 @@
|
||||
# Frame 1171281175 — 국내 BIM 수행 관계도
|
||||
|
||||
## 내용 설명
|
||||
|
||||
국내 BIM 수행 주체 간 관계를 중앙 4각 관계도로 표현하는 다이어그램.
|
||||
건설관리사·설계사·시공사·정부기관(발주처) 4주체 사이의 지침·규정·
|
||||
기술 형식 관계를 라벨과 연결선으로 배치. 4개 주체·기관·이해당사자
|
||||
간 관계 구조 설명·국내 BIM 생태계 관계 구도 제시에 적합.
|
||||
3개 이하 주체·5개 이상 항목·주체별 효과 나열(table 형태)·시간 순서
|
||||
·단일 주체 심층·필수요건 나열에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
건설관리사, 설계사, 시공사, 정부기관, 발주처, 지침, 규정, 기술형식, BIM수행, 국내
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **bim_actors**: 건설관리사, 설계사, 시공사, 정부기관, 발주처
|
||||
- **regulation_relations**: 지침, 규정, 기술형식, BIM수행
|
||||
- **domestic_relations**: 국내
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: diagram
|
||||
- **layout**: quadrilateral-relations
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: hierarchy
|
||||
- **cardinality**: ideal 4 / min 4 / max 4
|
||||
- **slots** (6개, required 5개): title, actor_1, actor_2, actor_3, actor_4, relations
|
||||
- **source title**: 국내 BIM 수행 관계도
|
||||
- **original layout**: diagram-labels
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 4주체 간 관계 구조
|
||||
- 국내 BIM 생태계 관계 구도
|
||||
- 이해당사자 관계도
|
||||
|
||||
### not_suits
|
||||
- 3개 이하 주체
|
||||
- 5개 이상 항목
|
||||
- 주체별 기대효과 나열 (table)
|
||||
- 시간 순서
|
||||
- 단일 주체 심층
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281175 — 국내 BIM 수행 관계도
|
||||
|
||||
## 구조
|
||||
- **layout**: diagram-labels
|
||||
- **detail**: 타이틀("국내") + 중앙 4각 관계도 (건설관리사·설계사·시공사·정부기관 관계)
|
||||
|
||||
## 내용
|
||||
국내 BIM 수행 주체 간 관계 다이어그램 — 건설관리사·설계사·시공사·정부기관(발주처)의 지침·규정·기술 형식 관계.
|
||||
|
||||
## 후보 키워드
|
||||
국내, BIM수행, 건설관리사, 설계사, 시공사, 정부기관, 발주처, 지침, 규정, 기술형식, 4각관계도, 주체별관계
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
52
figma_to_html_agent/blocks/1171281175/texts.md
Normal file
@@ -0,0 +1,52 @@
|
||||
# Frame 1171281175 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출. nodeId: 182:2829
|
||||
|
||||
## 타이틀
|
||||
|
||||
국내
|
||||
|
||||
## 다이어그램 라벨 (중앙 4각 관계도)
|
||||
|
||||
건설관리사
|
||||
|
||||
설계사
|
||||
|
||||
시공사
|
||||
|
||||
정부기관&발주처
|
||||
|
||||
## 다이어그램 강조 라벨 (빨간색)
|
||||
|
||||
지침
|
||||
|
||||
형식적
|
||||
|
||||
규정
|
||||
|
||||
설계기술
|
||||
|
||||
발전X
|
||||
|
||||
## 본문 (번호별 항목)
|
||||
|
||||
### 01
|
||||
|
||||
엔지니어링사 -> 정부에 지침 요구
|
||||
|
||||
- 정부주도 성과품 -> 기술수준 저하
|
||||
- 보안/지식재산권 없이 성과품 공유
|
||||
|
||||
### 02
|
||||
|
||||
형식적 규정 수행 및 기술발전 저해
|
||||
|
||||
- 과거 수행 방식 답습
|
||||
- 형식적인 규정 및 절차 증가
|
||||
|
||||
### 03
|
||||
|
||||
부족한 인력, 짧은 설계기간, 빠른 경제발전
|
||||
|
||||
- 차관사업(IBRD, ADB) -> 빠른 발전
|
||||
- 기본적인 Data 정리 / Manual 작성 부재
|
||||
63
figma_to_html_agent/blocks/1171281176/analysis.md
Normal file
@@ -0,0 +1,63 @@
|
||||
# Frame 1171281176 — 보상현황·민원 관리 (시각화 활용)
|
||||
|
||||
## 내용 설명
|
||||
|
||||
보상현황·민원 관리에서 시각화 도구를 어떻게 활용하는지를 좌측
|
||||
사이드 다크 배경 타이틀 + 우측 불릿 리스트 본문 구조로 제시하는
|
||||
디자인. 종합평면도/용지도 기반 토지·물건 현황 시각화, 보상서류/
|
||||
사진/영상 필지별 정보 시각화, 위치기반 시각화로 민원 상세 분석
|
||||
내용 나열. Frame 06(full-page-map)과 동일 주제지만 list 형식으로
|
||||
세부 시각화 도구 나열. 시각화 도구·방법 나열형 설명·보상현황
|
||||
민원관리 실무 도구 정리에 적합. 표/카드/다이어그램 나열·주체별
|
||||
나열·비교 구조·단일 주제 심층에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
보상현황, 민원관리, 시각화, 종합평면도, 용지도, 토지현황, 물건현황, 필지별, 보상서류
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **compensation_visualization**: 보상현황, 민원관리, 시각화
|
||||
- **land_property_data**: 종합평면도, 용지도, 토지현황, 물건현황, 필지별, 보상서류
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: cards
|
||||
- **layout**: side-card-with-list
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 3 / min 3 / max 5
|
||||
- **slots** (4개, required 4개): title, item_1, item_2, item_3
|
||||
- **source title**: 보상현황·민원 관리 (시각화 활용)
|
||||
- **original layout**: side-card
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 시각화 도구·방법 나열
|
||||
- 보상현황 민원관리 실무 도구 정리
|
||||
- 토지/물건 현황 시각화 리스트
|
||||
|
||||
### not_suits
|
||||
- 표/카드 형식 항목 나열
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 비교 구조 (대조)
|
||||
- 단일 주제 심층
|
||||
- 2개 비교
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **split**: True
|
||||
- **merge**: True
|
||||
- **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 1171281176 — 보상현황·민원 관리 (시각화 활용)
|
||||
|
||||
## 구조
|
||||
- **layout**: side-card
|
||||
- **detail**: 좌측 사이드 다크 배경 타이틀("보상현황·민원 관리") + 우측 불릿 리스트 본문
|
||||
|
||||
## 내용
|
||||
보상현황·민원 관리 시각화 활용 — 종합평면도·용지도 기반 토지/물건 현황 시각화, 보상서류/사진/영상 필지별 정보 시각화, 위치기반 시각화로 민원 상세 분석.
|
||||
|
||||
## 후보 키워드
|
||||
보상현황, 민원관리, 시각화, 종합평면도, 용지도, 토지현황, 물건현황, 보상서류, 필지별, 위치기반시각화, 민원분석
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
13
figma_to_html_agent/blocks/1171281176/texts.md
Normal file
@@ -0,0 +1,13 @@
|
||||
# Frame 1171281176 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출. nodeId: 182:3046
|
||||
|
||||
## 사이드 타이틀 (좌측 다크 배경)
|
||||
|
||||
보상현황·민원 관리
|
||||
|
||||
## 본문 (불릿 리스트)
|
||||
|
||||
- 종합평면도, 용지도를 사용한 토지 및 물건 현황 시각화
|
||||
- 보상서류, 사진 및 영상 등 필지별 보상 현황 정보 시각화
|
||||
- 위치기반 시각화를 활용하여 민원에 대한 상세 분석 가능
|
||||
61
figma_to_html_agent/blocks/1171281177/analysis.md
Normal file
@@ -0,0 +1,61 @@
|
||||
# Frame 1171281177 — 보상현황·민원 관리
|
||||
|
||||
## 내용 설명
|
||||
|
||||
보상현황과 민원 관리를 위한 위치 기반 시공 리스크 맵을 풀페이지로
|
||||
제시하는 디자인. 상단 배너 타이틀 + 풀페이지 맵 시각화로 시공
|
||||
리스크 사업 영역을 지리 정보 위에 표시. 위치 기반 리스크 시각화·
|
||||
보상현황/민원관리 맵·사업 맵 기반 정보 제공에 적합.
|
||||
표/카드/다이어그램 형식의 항목 나열·주체별 나열·시간 순서·
|
||||
단일 개념 정의·다면 비교에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
보상현황, 민원관리, 보상, 민원, 시공리스크, 위치기반
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **compensation_complaint**: 보상현황, 민원관리, 보상, 민원
|
||||
- **site_risk_map**: 시공리스크, 위치기반
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: map
|
||||
- **layout**: full-page-map-banner
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: definition
|
||||
- **cardinality**: ideal 1 / min 1 / max 1
|
||||
- **slots** (2개, required 2개): banner_title, map_area
|
||||
- **source title**: 보상현황·민원 관리
|
||||
- **original layout**: full-page-map
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 위치 기반 리스크 시각화
|
||||
- 보상현황/민원관리 맵
|
||||
- 사업 맵 기반 정보
|
||||
|
||||
### not_suits
|
||||
- 표 형식 항목 나열
|
||||
- 카드 형식 나열
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 시간 순서
|
||||
- 2개 이상 비교
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **split**: False
|
||||
- **merge**: False
|
||||
- **infer_missing_slot**: False
|
||||
- **rewrite_label**: True
|
||||
- **rewrite_body**: False
|
||||
|
||||
## 메타
|
||||
|
||||
- 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 1171281177 — 보상현황·민원 관리 (맵 기반)
|
||||
|
||||
## 구조
|
||||
- **layout**: full-page-map
|
||||
- **detail**: 상단 배너 타이틀("보상현황·민원 관리") + 풀페이지 맵 시각화 (시공 리스크 사업 맵)
|
||||
|
||||
## 내용
|
||||
보상현황·민원 관리 맵 기반 — 시공 리스크와 사업 맵을 풀페이지로 시각화.
|
||||
|
||||
## 후보 키워드
|
||||
보상현황, 민원관리, 맵, 시공리스크, 사업맵, 풀페이지시각화, 상단배너, 위치기반
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
29
figma_to_html_agent/blocks/1171281177/texts.md
Normal file
@@ -0,0 +1,29 @@
|
||||
# Frame 1171281177 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출. nodeId: 182:3053
|
||||
|
||||
## 타이틀 (상단 배너)
|
||||
|
||||
보상현황·민원 관리
|
||||
|
||||
## 서브타이틀
|
||||
|
||||
시공단계 토지 및 지장물에 대한 보상 현황과 다양한 민원 관리 업무 지원
|
||||
|
||||
## 본문 (불릿 항목)
|
||||
|
||||
- 종합 평면도와 용지도를 사용하여 토지 및 물건 현황, 필지별 보상현황 정보 시각화
|
||||
|
||||
- 시공현장에서 발생하는 보상 민원, 요구 민원, 불편 민원 등 유형별 발생 현황 및 처리결과 표출
|
||||
|
||||
## 하단 결론 바
|
||||
|
||||
사업 리스크의 조기 파악 및 선제 대응 가능
|
||||
|
||||
## 민원 태그 (지도 위 라벨)
|
||||
|
||||
이동 데크 추가 요청
|
||||
|
||||
토지보상 재결 승복 이후 재민원
|
||||
|
||||
배수 문제 발생
|
||||
66
figma_to_html_agent/blocks/1171281178/analysis.md
Normal file
@@ -0,0 +1,66 @@
|
||||
# Frame 1171281178 — System 구성 (H/W + S/W BIGRoom)
|
||||
|
||||
## 내용 설명
|
||||
|
||||
BIGRoom 시스템의 구성 요소를 좌측 H/W (Server·Network·회의시스템·
|
||||
CCTV·Drone·Sensor) + 우측 S/W (C.C.P·WatchBIM·Domainer)의 2열
|
||||
페어드 리스트로 제시하는 디자인. IT 인프라와 소프트웨어를 나란히
|
||||
배치해 하나의 통합 시스템 구성 요소를 보여줌. 이 디자인은 개념
|
||||
비교(예: BIM vs DX)나 과정/결과 대조(Frame 29)가 아니라, 하나의
|
||||
시스템을 H/W·S/W 두 축으로 분해하는 구성 관점. BIGRoom H/W+S/W
|
||||
시스템 구성·IT 인프라 + S/W 분해 설명에 적합. BIM vs DX 다면
|
||||
비교·과정/결과 2분할·주체별 나열·3개 이상 비교·시간 순서·단일
|
||||
구성요소 심층에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
BIGRoom, System, H/W, Server, Network, 회의시스템, CCTV, Drone, Sensor, 센서, IoT, S/W, CCP, WatchBIM, Domainer
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **bigroom_system**: BIGRoom, System
|
||||
- **hw_components**: H/W, Server, Network, 회의시스템, CCTV, Drone, Sensor, 센서, IoT
|
||||
- **sw_components**: S/W, CCP, WatchBIM, Domainer
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: compare
|
||||
- **layout**: 2col-paired-list
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: compare
|
||||
- **cardinality**: ideal 2 / min 2 / max 2
|
||||
- **slots** (5개, required 5개): title, col_a_label, col_a_items, col_b_label, col_b_items
|
||||
- **source title**: System 구성 (H/W + S/W BIGRoom)
|
||||
- **original layout**: 2col-paired
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- BIGRoom H/W+S/W 시스템 구성
|
||||
- IT 인프라 + S/W 분해 설명
|
||||
- 하나의 시스템을 2축으로 분해
|
||||
|
||||
### not_suits
|
||||
- BIM vs DX 직접 대조
|
||||
- 과정/결과 2분할 (Frame 29 주제)
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 3개 이상 비교
|
||||
- 시간 순서
|
||||
- 단일 구성요소 심층
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **split**: False
|
||||
- **merge**: True
|
||||
- **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 1171281178 — System 구성 (H/W + S/W BIGRoom)
|
||||
|
||||
## 구조
|
||||
- **layout**: 2col-paired
|
||||
- **detail**: H/W 항목(Server·Network·회의시스템·CCTV·Drone·Sensor)과 S/W 항목(C.C.P·WatchBIM·Domainer) 2열 페어드 리스트
|
||||
|
||||
## 내용
|
||||
BIGRoom 시스템 구성 — H/W(Server·Network·회의·CCTV·Drone·Sensor) + S/W(C.C.P·WatchBIM·Domainer) 상세 설명.
|
||||
|
||||
## 후보 키워드
|
||||
System, BIGRoom, H/W, S/W, Server, Network, 회의시스템, CCTV, Drone, Sensor, 센서, IoT, CCP, WatchBIM, Domainer, 시공관리, 공사단계, 용지보상, 구성
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
@@ -0,0 +1,3 @@
|
||||
<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 335.165 87.74" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="Rectangle 42079" d="M0 0H259.349C278.04 0 295.171 10.4254 303.759 27.0272L312.472 43.87L335.165 87.74H0V0Z" fill="var(--fill-0, #D16013)"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 335 B |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 40 KiB |
|
After Width: | Height: | Size: 375 KiB |
|
After Width: | Height: | Size: 482 KiB |
|
After Width: | Height: | Size: 45 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
@@ -0,0 +1,5 @@
|
||||
<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 406.561 6.0001" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="Group 3697">
|
||||
<line id="Line 1003" x1="9.20848e-08" y1="3" x2="406.561" y2="3.0001" stroke="var(--stroke-0, white)" stroke-width="6"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 332 B |
|
After Width: | Height: | Size: 886 B |
@@ -0,0 +1,3 @@
|
||||
<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 335.165 87.74" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="Rectangle 42078" d="M0 0H259.349C278.04 0 295.171 10.4254 303.759 27.0272L312.472 43.87L335.165 87.74H0V0Z" fill="var(--fill-0, #838486)"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 335 B |
|
After Width: | Height: | Size: 226 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
18
figma_to_html_agent/blocks/1171281178/flat.md
Normal file
@@ -0,0 +1,18 @@
|
||||
# Frame 1171281178 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 2446 × 1943 px (node 145:8394)
|
||||
> 패턴: system-config-hw-sw (H/W + S/W 시스템 구성도)
|
||||
> Scale: 1280 / 2446 = 0.52331
|
||||
|
||||
## 구조
|
||||
|
||||
좌: H/W 항목 7개 (Display, Server & Storage, Network, 회의시스템, CCTV, Dron Broadcasting, Sensor)
|
||||
우: S/W 항목 6개 (C.C.P, WatchBIM, Domainer, BCMF, Twin Highway, B.E.Ps)
|
||||
중앙: System 구성 원 (BIG Room)
|
||||
하단: Ground 이미지
|
||||
|
||||
2D 복합 레이아웃 → absolute + zoom
|
||||
|
||||
## 에셋 (16개)
|
||||
|
||||
배경, 패널, 중앙 원, 장식 아이콘, 헤더 바 SVG 등. 모두 이미지 유지.
|
||||
184
figma_to_html_agent/blocks/1171281178/index.html
Normal file
@@ -0,0 +1,184 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>System 구성 H/W + S/W (Frame 1171281178)</title>
|
||||
<!--
|
||||
Frame: 145:8394, 2446×1943 px
|
||||
Scale: 1280 / 2446 = 0.52331
|
||||
패턴: system-config-hw-sw
|
||||
구조: 2D 복합 레이아웃 → absolute + R19 zoom
|
||||
좌: H/W 7항목, 우: S/W 6항목, 중앙: BIG Room
|
||||
-->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&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: 2446px; height: 1943px;
|
||||
zoom: 0.52331; /* R19 */
|
||||
position: relative;
|
||||
}
|
||||
.abs { position: absolute; }
|
||||
.abs img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
|
||||
/* 라벨 바 (CSS gradient) */
|
||||
.hw-bar {
|
||||
position: absolute; height: 52.44px;
|
||||
background: linear-gradient(to right, rgba(255,255,255,0.5), #adb0af);
|
||||
border-radius: 0 40px 40px 0;
|
||||
}
|
||||
.sw-bar {
|
||||
position: absolute; height: 48.41px;
|
||||
background: linear-gradient(to right, #fbefe8, #f8ae7c);
|
||||
border-radius: 0 40px 40px 0;
|
||||
}
|
||||
.bar-label {
|
||||
position: absolute; transform: translateY(-50%);
|
||||
font-weight: 700; font-size: 40px; line-height: normal;
|
||||
color: #000; display: flex; align-items: center; gap: 10px;
|
||||
}
|
||||
.bar-label img { width: 28px; height: 29px; flex: none; }
|
||||
.body-text {
|
||||
position: absolute;
|
||||
font-weight: 500; font-size: 38px; line-height: 60px;
|
||||
color: #000;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- 배경 -->
|
||||
<div class="abs" style="left:0; top:1577px; width:2446px; height:366px;"><img src="assets/b2accb7d555f4db0c2d35d1569011429edde1ade.png"></div>
|
||||
<div class="abs" style="left:52.73px; top:77.65px; width:1144.49px; height:1819.35px;"><img src="assets/26130bd845450735906360cb922f58e3793148b7.png"></div>
|
||||
<div class="abs" style="left:54.7px; top:87.74px; width:1142.52px; height:395.33px;"><img src="assets/d13b0ac6c9a0ff5028859102f433367cab26a98b.png"></div>
|
||||
<div class="abs" style="left:1264.25px; top:92.78px; width:1118.86px; height:1803.21px;"><img src="assets/48d066e78784843a146e436d0edea28d91c9d007.png"></div>
|
||||
<div class="abs" style="left:1264.25px; top:1509.85px; width:1118.86px; height:387.27px;"><img src="assets/151f041f6b2a897a0c3a57343474ded6aa2c720c.png"></div>
|
||||
<div style="position:absolute; left:1260.31px; top:87.74px; width:1130.69px; height:391.3px; display:flex; align-items:center; justify-content:center;">
|
||||
<div style="flex:none; transform:scaleY(-1);"><img src="assets/151f041f6b2a897a0c3a57343474ded6aa2c720c.png" style="width:1130.69px; height:391.3px;"></div>
|
||||
</div>
|
||||
<div class="abs" style="left:44.84px; top:1497.75px; width:1152.38px; height:399.37px;"><img src="assets/5c11126f4fafa3898129693842b176646a6cdec8.png"></div>
|
||||
|
||||
<!-- H/W 헤더 -->
|
||||
<div class="abs" style="left:54.7px; top:1.01px; width:335.17px; height:87.74px;"><img src="assets/8b24ef76bacdfbd53e7ec3c4f029190aacbd722e.svg"></div>
|
||||
<div style="position:absolute; left:196.65px; top:45.89px; transform:translate(-50%,-50%); font-weight:700; font-size:50px; color:#fff; text-align:center;">H/W</div>
|
||||
|
||||
<!-- S/W 헤더 -->
|
||||
<div style="position:absolute; left:2055.83px; top:0; width:335.17px; height:87.74px; display:flex; align-items:center; justify-content:center;">
|
||||
<div style="flex:none; transform:scaleY(-1) rotate(180deg);"><img src="assets/06d5951cfd9fc1902012bae433505eb88e04151b.svg" style="width:335.17px; height:87.74px;"></div>
|
||||
</div>
|
||||
<div style="position:absolute; left:2240.17px; top:43.87px; transform:translate(-50%,-50%); font-weight:700; font-size:50px; color:#fff; text-align:center;">S/W</div>
|
||||
|
||||
<!-- 중앙 원 -->
|
||||
<div class="abs" style="left:883.74px; top:632.33px; width:671.18px; height:684.78px;"><img src="assets/922ee6f4bea1434652ffc08f962086052286b6c5.png"></div>
|
||||
<div style="position:absolute; left:1217.79px; top:921.76px; transform:translate(-50%,-50%); text-align:center; font-weight:700; font-size:0; color:#fff;">
|
||||
<p style="font-size:70px; line-height:normal; color:yellow;">System</p>
|
||||
<p style="font-size:60px; line-height:normal;">구성</p>
|
||||
</div>
|
||||
<div style="position:absolute; left:1226.23px; top:1107.92px; transform:translate(-50%,-50%); font-weight:700; font-size:50px; color:#fff; text-align:center;">BIG Room</div>
|
||||
|
||||
<!-- ═══ H/W 항목 ═══ -->
|
||||
|
||||
<!-- Display -->
|
||||
<div class="hw-bar" style="left:83.29px; top:129.09px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:151.78px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Display</div>
|
||||
<div class="body-text" style="left:123.73px; top:189.6px; width:1098.3px;">범위가 넓고 긴 형태의 인프라 시설 규모에 적합한 대형 사이니지를 적용하여 벡터기반 도면, 3D정보 모델을 높은 정밀도로 표출</div>
|
||||
|
||||
<!-- Server & Storage -->
|
||||
<div class="hw-bar" style="left:83.29px; top:361.05px; width:425.95px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:383.74px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Server & Strorage</div>
|
||||
<div class="body-text" style="left:123.73px; top:414.5px; width:1042.45px;">방대한 건설현장 데이터를 안전하게 저장하고 관리, 시공 및 공정, 기성 등 데이터베이스화 하여 실시간 접근 및 효율적인 정보공유와 관리 지원</div>
|
||||
|
||||
<!-- Network -->
|
||||
<div class="hw-bar" style="left:74.42px; top:642.42px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:667.13px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Network</div>
|
||||
<div class="body-text" style="left:123.73px; top:682.76px; width:1170.22px;">네트워크 서비스를 통한 실시간 데이터 수집 및 연계, 위치기반 안전관리, SaaS 기반 실시간 데이터 공유와 관리 가능</div>
|
||||
|
||||
<!-- 회의시스템 -->
|
||||
<div class="hw-bar" style="left:74.42px; top:916.73px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:943.46px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">회의시스템</div>
|
||||
<div class="body-text" style="left:123.73px; top:982.29px; width:884.49px;">공사 현장, 개별 공구별 사무실, 사업단 회의시스템을 구축하여 신속한 의사결정을 바탕으로 업무효율성 증대</div>
|
||||
|
||||
<!-- CCTV -->
|
||||
<div class="hw-bar" style="left:74.42px; top:1177.94px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:1201.64px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">CCTV</div>
|
||||
<div class="body-text" style="left:123.73px; top:1237.44px; width:967.95px;">각 현장에 설치된 실시간 CCTV와 연계하여 공사 진행과정과 위험 요소를 지속적으로 모니터링하여 사고를 사전에 예방</div>
|
||||
|
||||
<!-- Dron Broadcasting -->
|
||||
<div class="hw-bar" style="left:74.42px; top:1425.02px; width:502.57px;"></div>
|
||||
<div class="bar-label" style="left:84px; top:1446.7px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Dron Broadcasting</div>
|
||||
<div class="body-text" style="left:123.73px; top:1485.53px; width:1098.3px;">드론을 활용하여 건설 현장을 촬영하고 구조물의 상태를 실시간으로 확인 함으로써 공사의 품질을 높이며 안전한 작업 환경 조성</div>
|
||||
|
||||
<!-- Sensor -->
|
||||
<div class="hw-bar" style="left:74.42px; top:1670.09px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:83.29px; top:1694.79px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Sensor</div>
|
||||
<!-- Sensor body: hw-bar bottom=1722.53 + 8px = 1731 (translateY(-50%) 제거) -->
|
||||
<div class="body-text" style="left:123.73px; top:1731px; width:1067.52px;">현장에 IoT 위치기반 센서를 설치하여 사전에 균열, 진동, 기울기의 변화 등 위험요소를 실시간으로 확인하고 문제 발생 시 화면 표출</div>
|
||||
|
||||
<!-- ═══ S/W 항목 ═══ -->
|
||||
|
||||
<!-- C.C.P -->
|
||||
<div class="sw-bar" style="left:1283.03px; top:129.09px; width:325.31px;"></div>
|
||||
<div class="bar-label" style="left:1287.91px; top:151.78px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">C.C.P</div>
|
||||
<!-- C.C.P body: sw-bar bottom=177.5 + 8px = 186 (translateY(-50%) 제거) -->
|
||||
<div class="body-text" style="left:1341.14px; top:186px; width:1021.58px;">사업의 기본정보 및 공사진행과 관련된 모든 자료를 취합, 검증, 확인, 협업하는 효율적인 공사단계 프로세스 협업 및 관리 솔루션</div>
|
||||
|
||||
<!-- WatchBIM -->
|
||||
<div class="sw-bar" style="left:1283.97px; top:374.16px; width:366.7px;"></div>
|
||||
<div class="bar-label" style="left:1294.81px; top:398.86px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">WatchBIM</div>
|
||||
<div class="body-text" style="left:1351.02px; top:436.68px; width:1011.65px;">공사중 단계별 건설과정을 설계모델의 시각화와 공정시뮬레이션을 통해 현장 공사진행사항을 직관적으로 확인 및 검증</div>
|
||||
|
||||
<!-- Domainer -->
|
||||
<div class="sw-bar" style="left:1447.61px; top:650.49px; width:365.72px;"></div>
|
||||
<div class="bar-label" style="left:1446.62px; top:672.17px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Domainer</div>
|
||||
<div class="body-text" style="left:1503.82px; top:715.03px; width:834.14px;">시공단계에서 민원 및 용지보상과 관련한 업무를 수행하는 솔루션으로 지번검색, 계약사항, 일정관리, 성과품, 협의자료 생성 등의 업무를 수행</div>
|
||||
|
||||
<!-- BCMF -->
|
||||
<div class="sw-bar" style="left:1536.33px; top:1003.46px; width:263.74px;"></div>
|
||||
<div class="bar-label" style="left:1536.33px; top:1025.15px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png"><span style="font-size:0;"><span style="font-size:30px;">B</span><span style="font-size:40px;">CM</span><span style="font-size:30px;">F</span></span></div>
|
||||
<!-- BCMF body: sw-bar bottom=1051.87 + 8px = 1060 (translateY(-50%) 제거) -->
|
||||
<div class="body-text" style="left:1579.7px; top:1060px; width:786.66px;">건설 현장의 공사, 품질, 안전, 사업관리 등의 업무를 효율적으로 수행할 수 있는 BIM기반 현장 맞춤형 건설사업관리 솔루션</div>
|
||||
|
||||
<!-- Twin Highway -->
|
||||
<div class="sw-bar" style="left:1297.77px; top:1350.39px; width:471.2px;"></div>
|
||||
<div class="bar-label" style="left:1283.97px; top:1371.06px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png">Twin Highway</div>
|
||||
<!-- Twin Highway body: sw-bar bottom=1398.8 + 8px = 1407 (translateY(-50%) 제거) -->
|
||||
<div class="body-text" style="left:1342.13px; top:1407px; width:1030.45px;">준공 후 가상세계의 정보모델을 실시간 데이터와 연결하여 다양한 시뮬레이션을 통해 효율적인 시설물 관리 및 운영전략 수립 지원</div>
|
||||
|
||||
<!-- B.E.Ps <참고> -->
|
||||
<div class="sw-bar" style="left:1297.77px; top:1647.9px; width:352.91px;"></div>
|
||||
<div class="bar-label" style="left:1283.97px; top:1668.57px;"><img src="assets/7e260569216fd75f7df60441a94a25763e7f24c8.png"><span style="font-size:0;"><span style="font-size:40px;">B.E.P</span><span style="font-size:30px;">s <참고></span></span></div>
|
||||
<!-- B.E.Ps body: sw-bar bottom=1696.31 + 8px = 1705 (translateY(-50%) 제거) -->
|
||||
<div class="body-text" style="left:1343.14px; top:1705px; width:1039.89px;">건설산업의 디지털전환을 위한 개념 및 BIM 수행을 위한 방법, 예시, 사례들을 모아놓은 사내용 시공 BIM 수행 메뉴얼 및 학습 시스템</div>
|
||||
|
||||
<!-- 장식 이미지들 -->
|
||||
<div class="abs" style="left:338.61px; top:802.77px; width:118.29px; height:121.02px;"><img src="assets/f6d6c38d03350b0b72b994f44c10d41ac1ae67e0.png"></div>
|
||||
<div class="abs" style="left:34px; top:513.33px; width:98.58px; height:100.85px;"><img src="assets/f6d6c38d03350b0b72b994f44c10d41ac1ae67e0.png"></div>
|
||||
<div class="abs" style="left:577.16px; top:345.92px; width:47.32px; height:48.41px;"><img src="assets/501526da860c6430caa4bb133a8d6bd3ba1580f2.png"></div>
|
||||
<div class="abs" style="left:973.45px; top:1461.33px; width:98.58px; height:100.85px;"><img src="assets/f6d6c38d03350b0b72b994f44c10d41ac1ae67e0.png"></div>
|
||||
<div class="abs" style="left:1560.97px; top:732.18px; width:124.21px; height:127.07px;"><img src="assets/6a5c82585b829bba6812fb47fc12a2e3f419e62d.png"></div>
|
||||
<div class="abs" style="left:1936.55px; top:1225.34px; width:54.22px; height:55.47px;"><img src="assets/1e43a4acb2f3f368932da59f33a8793ba8b95fc7.png"></div>
|
||||
<div class="abs" style="left:776.29px; top:1323.16px; width:83.79px; height:85.72px;"><img src="assets/5f14763f6097e3a734ac3375813a675d341ae1f3.png"></div>
|
||||
<div class="abs" style="left:348.46px; top:1619.66px; width:98.58px; height:100.85px;"><img src="assets/f6d6c38d03350b0b72b994f44c10d41ac1ae67e0.png"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
35
figma_to_html_agent/blocks/1171281178/texts.md
Normal file
@@ -0,0 +1,35 @@
|
||||
# Frame 1171281178 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
## H/W 항목
|
||||
Display
|
||||
범위가 넓고 긴 형태의 인프라 시설 규모에 적합한 대형 사이니지를 적용하여 벡터기반 도면, 3D정보 모델을 높은 정밀도로 표출
|
||||
Server & Strorage
|
||||
방대한 건설현장 데이터를 안전하게 저장하고 관리, 시공 및 공정, 기성 등 데이터베이스화 하여 실시간 접근 및 효율적인 정보공유와 관리 지원
|
||||
Network
|
||||
네트워크 서비스를 통한 실시간 데이터 수집 및 연계, 위치기반 안전관리, SaaS 기반 실시간 데이터 공유와 관리 가능
|
||||
회의시스템
|
||||
공사 현장, 개별 공구별 사무실, 사업단 회의시스템을 구축하여 신속한 의사결정을 바탕으로 업무효율성 증대
|
||||
CCTV
|
||||
각 현장에 설치된 실시간 CCTV와 연계하여 공사 진행과정과 위험 요소를 지속적으로 모니터링하여 사고를 사전에 예방
|
||||
Dron Broadcasting
|
||||
드론을 활용하여 건설 현장을 촬영하고 구조물의 상태를 실시간으로 확인 함으로써 공사의 품질을 높이며 안전한 작업 환경 조성
|
||||
Sensor
|
||||
현장에 IoT 위치기반 센서를 설치하여 사전에 균열, 진동, 기울기의 변화 등 위험요소를 실시간으로 확인하고 문제 발생 시 화면 표출
|
||||
|
||||
## S/W 항목
|
||||
C.C.P
|
||||
사업의 기본정보 및 공사진행과 관련된 모든 자료를 취합, 검증, 확인, 협업하는 효율적인 공사단계 프로세스 협업 및 관리 솔루션
|
||||
WatchBIM
|
||||
공사중 단계별 건설과정을 설계모델의 시각화와 공정시뮬레이션을 통해 현장 공사진행사항을 직관적으로 확인 및 검증
|
||||
Domainer
|
||||
시공단계에서 민원 및 용지보상과 관련한 업무를 수행하는 솔루션으로 지번검색, 계약사항, 일정관리, 성과품, 협의자료 생성 등의 업무를 수행
|
||||
BCMF
|
||||
건설 현장의 공사, 품질, 안전, 사업관리 등의 업무를 효율적으로 수행할 수 있는 BIM기반 현장 맞춤형 건설사업관리 솔루션
|
||||
Twin Highway
|
||||
준공 후 가상세계의 정보모델을 실시간 데이터와 연결하여 다양한 시뮬레이션을 통해 효율적인 시설물 관리 및 운영전략 수립 지원
|
||||
B.E.Ps <참고>
|
||||
건설산업의 디지털전환을 위한 개념 및 BIM 수행을 위한 방법, 예시, 사례들을 모아놓은 사내용 시공 BIM 수행 메뉴얼 및 학습 시스템
|
||||
|
||||
## 중앙
|
||||
System 구성
|
||||
BIG Room
|
||||
42
figma_to_html_agent/blocks/1171281179/_render.py
Normal file
@@ -0,0 +1,42 @@
|
||||
from selenium import webdriver
|
||||
from selenium.webdriver.chrome.options import Options
|
||||
from PIL import Image
|
||||
import os, time
|
||||
|
||||
here = os.path.dirname(os.path.abspath(__file__))
|
||||
renders = os.path.join(here, '_renders')
|
||||
os.makedirs(renders, exist_ok=True)
|
||||
|
||||
opts = Options()
|
||||
opts.add_argument('--headless=new')
|
||||
opts.add_argument('--hide-scrollbars')
|
||||
opts.add_argument('--force-device-scale-factor=1')
|
||||
opts.add_argument('--window-size=1600,900')
|
||||
d = webdriver.Chrome(options=opts)
|
||||
|
||||
p = os.path.join(here, 'index.html').replace(os.sep, '/')
|
||||
d.get('file:///' + p)
|
||||
time.sleep(2.0)
|
||||
full_png = os.path.join(renders, '_full.png')
|
||||
d.save_screenshot(full_png)
|
||||
|
||||
r = d.execute_script(
|
||||
'const r=document.querySelector(".slide").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('slide bounds:', r)
|
||||
Image.open(full_png).crop(
|
||||
(int(r[0]), int(r[1]), int(r[0]+r[2]), int(r[1]+r[3]))
|
||||
).save(os.path.join(renders, 'slide.png'))
|
||||
|
||||
b = d.execute_script(
|
||||
'const r=document.querySelector(".block").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('block bounds:', b)
|
||||
Image.open(full_png).crop(
|
||||
(int(b[0]), int(b[1]), int(b[0]+b[2]), int(b[1]+b[3]))
|
||||
).save(os.path.join(renders, 'block.png'))
|
||||
|
||||
d.quit()
|
||||
print('OK')
|
||||
BIN
figma_to_html_agent/blocks/1171281179/_renders/_full.png
Normal file
|
After Width: | Height: | Size: 244 KiB |
BIN
figma_to_html_agent/blocks/1171281179/_renders/block.png
Normal file
|
After Width: | Height: | Size: 235 KiB |
BIN
figma_to_html_agent/blocks/1171281179/_renders/slide.png
Normal file
|
After Width: | Height: | Size: 238 KiB |
BIN
figma_to_html_agent/blocks/1171281179/_renders/slide_2x.png
Normal file
|
After Width: | Height: | Size: 1.0 MiB |
62
figma_to_html_agent/blocks/1171281179/analysis.md
Normal file
@@ -0,0 +1,62 @@
|
||||
# Frame 1171281179 — 효율적인 정보의 관리와 활용 (What/How/When)
|
||||
|
||||
## 내용 설명
|
||||
|
||||
효율적인 정보의 관리와 활용을 What(무슨 정보)·How(어떻게 관리)·
|
||||
When(언제 활용) 3가지 관점으로 정리하는 프레임워크 디자인. 3개
|
||||
섹션을 가로/세로로 분할해 각 관점별 내용을 병렬 제시. 정보
|
||||
관리/활용 프레임워크 3관점·What/How/When 방법론·효율성 체계
|
||||
정리에 적합. 주체별 나열·필수요건 나열(기술/사람/자연)·2개
|
||||
비교·4개 이상 항목·시간 순서 단계·단일 관점 심층에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
What, How, 무슨정보, 정보관리, 정보활용, 효율성
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **what_how_when**: What, How, 무슨정보 _[min_hits=2, cap=0.75, exempt_if≥0.5]_
|
||||
- note: What/How/When은 범용 영어 의문사. 둘 이상 등장해도 이 템플릿 주제라 단정 불가. 정보관리·프레임워크 맥락 방증 필요.
|
||||
- **info_management**: 정보관리, 정보활용, 효율성
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: cards
|
||||
- **layout**: 3-section-framework
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 3 / min 3 / max 3
|
||||
- **slots** (7개, required 7개): title, what_label, what_body, how_label, how_body, when_label, when_body
|
||||
- **source title**: 효율적인 정보의 관리와 활용 (What/How/When)
|
||||
- **original layout**: 3-section
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- What/How/When 3관점 프레임워크
|
||||
- 정보 관리/활용 체계 정리
|
||||
- 3관점 병렬 제시
|
||||
|
||||
### 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 1171281179 — 효율적인 정보 관리·활용 (What/How/When)
|
||||
|
||||
## 구조
|
||||
- **layout**: 3-section
|
||||
- **detail**: 타이틀("효율적인 정보의 관리와 활용") + 3개 섹션(What·How·When) 가로/세로 분할
|
||||
|
||||
## 내용
|
||||
효율적인 정보의 관리와 활용 프레임워크 — What(무슨 정보) · How(어떻게 관리) · When(언제 활용) 3관점.
|
||||
|
||||
## 후보 키워드
|
||||
정보관리, 정보활용, What, How, When, 3섹션, 효율성, 프레임워크, 무슨정보, 어떻게관리, 언제활용
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
BIN
figma_to_html_agent/blocks/1171281179/assets/card_decor.png
Normal file
|
After Width: | Height: | Size: 1.7 MiB |
BIN
figma_to_html_agent/blocks/1171281179/assets/title_icon.png
Normal file
|
After Width: | Height: | Size: 109 KiB |
99
figma_to_html_agent/blocks/1171281179/flat.md
Normal file
@@ -0,0 +1,99 @@
|
||||
# Frame 1171281179 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 1207 × 861 px (node 182:3024, file 9S6LsQyO6zlRxtiqZccOUM, page 29:373)
|
||||
> 패턴: framework-3section-label-body (좌 라벨 / 우 카드 본문, 3 섹션)
|
||||
> Scale: **min(1280/1207, 720/861) = 720/861 = 0.83624** (height fit, 1009×720 block in 1280×720 slide)
|
||||
|
||||
## 구조 (bottom-up)
|
||||
|
||||
```
|
||||
Frame 182:3024 "Frame 1171281179" (1207 × 861)
|
||||
└─ Group 182:3025 "Group 1171285821" (0, 0) 1207×861
|
||||
│
|
||||
├─ ① 헤더 (title row, 0, 0) 1166×94
|
||||
│ └─ 항목 frame 182:3027: flex gap=15, items-center
|
||||
│ ├─ icon 50×61 (green circle, 50×50 image inside) — title_icon.png
|
||||
│ └─ TEXT 182:3030 "효율적인 정보의 관리와 활용"
|
||||
│ - "효율적인 " 50px Bold, gradient 180° (#296B55 → #123328)
|
||||
│ - "정보의 관리와 활용" 65px Bold, gradient 180° (#000 → #883700)
|
||||
│ - text-shadow: 0 0 4px #322C1E
|
||||
│
|
||||
├─ ② 좌측 브라운 라벨 (3개, 282×230, rgba(50,31,9,0.8), rounded right corners r=20)
|
||||
│ ├─ 182:3033 "What" label (18, 124) — drop-shadow 0 4 2 rgba(0,0,0,0.25)
|
||||
│ │ "무슨 정보" 40px Bold white + "What" 53px Bold #FFE100 (yellow)
|
||||
│ ├─ 182:3035 "HOW" label (18, 378) — drop-shadow 동일
|
||||
│ │ "어떻게 연계" 40px + "HOW" 53px #FFE100
|
||||
│ └─ 182:3031 "WHEN" label (18, 631) — drop-shadow 없음
|
||||
│ "언제 사용" 40px + "WHEN" 53px #FFE100
|
||||
│
|
||||
├─ ③ 우측 흰 카드 (3개, 877~879×230, white bg, 3px border #A5BBB4, rounded right r=20)
|
||||
│ ├─ 182:3037 (315, 124) 877×230 ← What 카드
|
||||
│ ├─ 182:3039 (315, 378) 877×230 ← HOW 카드
|
||||
│ └─ 182:3038 (313, 631) 879×230 ← WHEN 카드
|
||||
│
|
||||
├─ ④ 우측 카드 장식 이미지 (3개, 383×177, rounded-bl r=17, 동일 src 재사용)
|
||||
│ ├─ 182:3040 image 5624 (804, 176) — card_decor.png
|
||||
│ ├─ 182:3041 image 5625 (805, 428) — 동일
|
||||
│ └─ 182:3042 image 5626 (803, 680) — 동일
|
||||
│
|
||||
├─ ⑤ 본문 텍스트 (3 섹션)
|
||||
│ ├─ 182:3043 What 본문 (321, 143) 880×193 — 35px Medium black + 40px Bold #CC5200 강조
|
||||
│ │ • 수량, CBS 내역, 단가, 공사일정, 자원 투입계획 등 [계획 정보]
|
||||
│ │ • 일일 작업수량, 실제 투입 자원 등 [공사 실행 정보]
|
||||
│ │ • 품질/안전/환경 등 점검일지, 체크리스트, 사진 등 [공사 결과]
|
||||
│ │
|
||||
│ ├─ 182:3045 HOW 본문 (319, 396) 888×194
|
||||
│ │ • 3D 형상 [산출속성과 연계]하여 S/W를 통해 정의
|
||||
│ │ • 객체별 품질 검사 기준 등은 [시방규정과 연계]하여 S/W로 정의
|
||||
│ │ • 객체별 필요정보를 Text기반 형식으로 [사용자가 입력]
|
||||
│ │
|
||||
│ └─ 182:3044 WHEN 본문 (319, 653) 868×177
|
||||
│ • [착수 전] 공정계획, 시공계획 등 계획 수립
|
||||
│ • [개별 공사 전] 시공상세도를 기반으로 한 작업 내용 확인
|
||||
│ • [개별 공사 후] 실적 관리, 공사관련 문서 작성, 업무 보고
|
||||
│
|
||||
└─ ⑥ image 3341 placeholder (656, 517) 536×311 opacity 85
|
||||
— design_context에 src 미포함. WHEN 카드 영역 내 정체 불명 placeholder.
|
||||
— 시각 영향 없으므로 생략.
|
||||
```
|
||||
|
||||
## 에셋 (2개 + 1 missing)
|
||||
|
||||
| 파일 | 의미 | 크기 | 사용 |
|
||||
|------|------|------|------|
|
||||
| `assets/title_icon.png` | 타이틀 좌측 녹색 원형 아이콘 (1171281194에서도 사용) | 50×50 | 1× |
|
||||
| `assets/card_decor.png` | 카드 우측 장식 이미지 (3D 헥사곤/패턴) | 383×177 | **3×** (재사용) |
|
||||
| (image 3341) | metadata에는 있으나 design_context 미제공 | 536×311 | 생략 |
|
||||
|
||||
## 이상 탐지 결과
|
||||
|
||||
| 검사 | 결과 |
|
||||
|------|------|
|
||||
| 회전 단일문자 | 없음 |
|
||||
| 좁은 박스 세로 텍스트 | 없음 |
|
||||
| 중복 노드 | card_decor 동일 src 3× 재사용 — 정상 |
|
||||
| Vector 좌표 metadata vs design_context | 일치 |
|
||||
| **이상한 회전 nesting** | 좌측 라벨 3개 모두 `rotate-180` 래퍼 + 내부 컨텐츠도 `rotate-180` → 시각적으로 identity. Figma 자동 레이아웃 export 부산물. CSS에서는 회전 생략하고 `border-top-right-radius/bottom-right-radius: 20px`만 적용. |
|
||||
| **이상한 image transform** | 카드 장식 3개 모두 `-scale-y-100` + `rotate-180` → 시각적으로 identity. CSS에서 transform 생략. |
|
||||
| metadata에 있으나 design_context 미제공 | image 3341 (placeholder) — 무시 |
|
||||
|
||||
## 변형 가능 축
|
||||
|
||||
- **sections[N=3] (required)** — cardinality 3 고정 (analysis.md), label + body 페어 3쌍
|
||||
- `label_kr` (required, 40px) — "무슨 정보" / "어떻게 연계" / "언제 사용"
|
||||
- `label_en` (required, 53px yellow) — "What" / "HOW" / "WHEN"
|
||||
- `body_bullets[N=3]` (required) — 본문 불릿 (35px black + 40px Bold #CC5200 강조)
|
||||
- `title` (required) — "효율적인 정보의 관리와 활용" 형태, 두 부분 폰트 사이즈 다름 (50/65)
|
||||
- `title_icon` (required) — 녹색 원형 아이콘
|
||||
- `card_decor` (optional) — 카드 우측 장식 이미지. 없으면 흰 카드만
|
||||
|
||||
## Sub-patterns
|
||||
|
||||
- `label-body-rounded-right-pair` — 좌(브라운 라벨, rounded right) / 우(흰 카드, rounded right + border) 페어
|
||||
- `bullet-list-with-highlight` — 불릿 리스트에서 핵심어 색상/폰트 강조 (#CC5200, +5px)
|
||||
- `gradient-bg-clip-text-title` — 멀티 폰트 사이즈 + 멀티 색 그라디언트 텍스트 헤더 (1171281194의 title-row와 비슷)
|
||||
|
||||
## 임시 보정 (1:1, 템플릿화 시 재고려)
|
||||
|
||||
- 좌측 라벨의 `drop-shadow`는 What/HOW만 적용, WHEN에는 미적용 — Figma에서 의도된 차이일 수 있음 (검토 필요). 우선 보존.
|
||||
- 본문 tracking 값(letter-spacing) 마이크로 조정 (-1.75 ~ -2.8px). 템플릿에서는 자연 wrap에 맡김 권장.
|
||||
237
figma_to_html_agent/blocks/1171281179/index.html
Normal file
@@ -0,0 +1,237 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>효율적인 정보의 관리와 활용 (Frame 1171281179)</title>
|
||||
<!--
|
||||
Frame: 182:3024, 1207 × 861 px (Frame 1171281179)
|
||||
Source: file 9S6LsQyO6zlRxtiqZccOUM, page 29:373
|
||||
Scale: min(1280/1207, 720/861) = 720/861 = 0.83624 (height fit)
|
||||
Block in slide: 1009 × 720 (centered horizontally, white margin sides)
|
||||
패턴: framework-3section-label-body
|
||||
구조: 헤더 (icon + title) / 좌 브라운 라벨 ×3 / 우 흰 카드 ×3 (불릿 본문 + 우측 장식 이미지)
|
||||
-->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<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; height: 720px;
|
||||
background: #fff;
|
||||
position: relative; overflow: hidden;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,.15);
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.block {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.inner {
|
||||
width: 1207px; height: 861px;
|
||||
position: relative;
|
||||
zoom: 0.83624;
|
||||
}
|
||||
|
||||
/* ① 헤더 (title row) */
|
||||
.title-row {
|
||||
position: absolute;
|
||||
left: 0; top: 0;
|
||||
width: 1166px; height: 94px;
|
||||
display: flex; align-items: center; gap: 15px;
|
||||
}
|
||||
.title-icon {
|
||||
flex: none;
|
||||
width: 50px; height: 61px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.title-icon img {
|
||||
width: 50px; height: 50px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
.title-text {
|
||||
flex: none;
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 700;
|
||||
white-space: pre;
|
||||
text-shadow: 0 0 4px #322C1E;
|
||||
line-height: 1;
|
||||
}
|
||||
.title-text .part-1 {
|
||||
font-size: 50px;
|
||||
background-image: linear-gradient(180deg, #296B55 0%, #123328 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
.title-text .part-2 {
|
||||
font-size: 65px;
|
||||
background-image: linear-gradient(180deg, rgb(0,0,0) 0%, rgb(136,55,0) 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
/* ② 좌측 브라운 라벨 (3개) */
|
||||
.label-box {
|
||||
position: absolute;
|
||||
left: 18px;
|
||||
width: 282px; height: 230px;
|
||||
background: rgba(50, 31, 9, 0.8);
|
||||
border-top-right-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
display: flex; flex-direction: column;
|
||||
align-items: center; justify-content: center;
|
||||
padding: 9px 22px;
|
||||
}
|
||||
.label-box--shadow {
|
||||
filter: drop-shadow(0 4px 2px rgba(0,0,0,0.25));
|
||||
}
|
||||
.label-box .kr {
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 40px;
|
||||
color: white;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
text-shadow: 0 4px 4px rgba(0,0,0,0.25);
|
||||
}
|
||||
.label-box .en {
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 53px;
|
||||
color: #FFE100;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
text-shadow: 0 4px 4px rgba(0,0,0,0.25);
|
||||
}
|
||||
.label--what { top: 124px; }
|
||||
.label--how { top: 378px; }
|
||||
.label--when { top: 631px; }
|
||||
|
||||
/* ③ 우측 흰 카드 (3개) */
|
||||
.card-box {
|
||||
position: absolute;
|
||||
height: 230px;
|
||||
background: white;
|
||||
border: 3px solid #A5BBB4;
|
||||
border-top-right-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
}
|
||||
.card-box--what { left: 315px; top: 124px; width: 877px; }
|
||||
.card-box--how { left: 315px; top: 378px; width: 877px; }
|
||||
.card-box--when { left: 313px; top: 631px; width: 879px; }
|
||||
|
||||
/* ④ 카드 우측 장식 이미지 (3개, 같은 src) */
|
||||
.card-decor {
|
||||
position: absolute;
|
||||
width: 383px; height: 177px;
|
||||
border-bottom-left-radius: 17px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.card-decor img {
|
||||
width: 100%; height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
.card-decor--what { left: 804px; top: 176px; }
|
||||
.card-decor--how { left: 805px; top: 428px; }
|
||||
.card-decor--when { left: 803px; top: 680px; }
|
||||
|
||||
/* ⑤ 본문 텍스트 (3 섹션 공통) */
|
||||
.body-text {
|
||||
position: absolute;
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
font-weight: 500;
|
||||
color: black;
|
||||
}
|
||||
.body-text p { margin: 0; line-height: 65px; }
|
||||
.body-text .bullet { font-size: 35px; line-height: 65px; letter-spacing: 0; }
|
||||
.body-text .text { font-size: 35px; line-height: 65px; letter-spacing: -2px; }
|
||||
.body-text .accent {
|
||||
font-weight: 700;
|
||||
font-size: 40px;
|
||||
line-height: 65px;
|
||||
color: #CC5200;
|
||||
letter-spacing: -2.2px;
|
||||
}
|
||||
|
||||
.body-text--what { left: 321px; top: 143px; width: 880px; height: 193px; }
|
||||
.body-text--how { left: 319px; top: 396px; width: 888px; height: 194px; }
|
||||
.body-text--when { left: 319px; top: 653px; width: 868px; height: 177px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- ① 헤더 -->
|
||||
<div class="title-row">
|
||||
<div class="title-icon"><img src="assets/title_icon.png" alt=""></div>
|
||||
<div class="title-text"><span class="part-1">효율적인 </span><span class="part-2">정보의 관리와 활용</span></div>
|
||||
</div>
|
||||
|
||||
<!-- ② 좌측 브라운 라벨 ×3 -->
|
||||
<div class="label-box label-box--shadow label--what">
|
||||
<div class="kr">무슨 정보</div>
|
||||
<div class="en">What</div>
|
||||
</div>
|
||||
<div class="label-box label-box--shadow label--how">
|
||||
<div class="kr">어떻게 연계</div>
|
||||
<div class="en">HOW</div>
|
||||
</div>
|
||||
<div class="label-box label--when">
|
||||
<div class="kr">언제 사용</div>
|
||||
<div class="en">WHEN</div>
|
||||
</div>
|
||||
|
||||
<!-- ③ 우측 흰 카드 ×3 (배경) -->
|
||||
<div class="card-box card-box--what"></div>
|
||||
<div class="card-box card-box--how"></div>
|
||||
<div class="card-box card-box--when"></div>
|
||||
|
||||
<!-- ④ 카드 우측 장식 이미지 -->
|
||||
<div class="card-decor card-decor--what"><img src="assets/card_decor.png" alt=""></div>
|
||||
<div class="card-decor card-decor--how"><img src="assets/card_decor.png" alt=""></div>
|
||||
<div class="card-decor card-decor--when"><img src="assets/card_decor.png" alt=""></div>
|
||||
|
||||
<!-- ⑤ 본문 텍스트 — What -->
|
||||
<div class="body-text body-text--what">
|
||||
<p><span class="bullet">‧</span><span class="text">수량, CBS 내역, 단가, 공사일정, 자원 투입계획 등 </span><span class="accent">계획 정보</span></p>
|
||||
<p><span class="bullet">‧</span><span class="text">일일 작업수량, 실제 투입 자원 등 </span><span class="accent">공사 실행 정보</span></p>
|
||||
<p><span class="bullet">‧</span><span class="text">품질/안전/환경 등 점검일지, 체크리스트, 사진 등 </span><span class="accent">공사 결과</span></p>
|
||||
</div>
|
||||
|
||||
<!-- ⑤ 본문 텍스트 — HOW -->
|
||||
<div class="body-text body-text--how">
|
||||
<p><span class="bullet">‧</span><span class="text">3D 형상 </span><span class="accent">산출속성과 연계</span><span class="text">하여 S/W를 통해 정의</span></p>
|
||||
<p><span class="bullet">‧</span><span class="text">객체별 품질 검사 기준 등은 </span><span class="accent">시방규정과 연계</span><span class="text">하여 S/W로 정의</span></p>
|
||||
<p><span class="bullet">‧</span><span class="text">객체별 필요정보를 Text기반 형식으로 </span><span class="accent">사용자가 입력</span></p>
|
||||
</div>
|
||||
|
||||
<!-- ⑤ 본문 텍스트 — WHEN -->
|
||||
<div class="body-text body-text--when">
|
||||
<p><span class="bullet">‧</span><span class="accent">착수 전</span><span class="text"> 공정계획, 시공계획 등 계획 수립</span></p>
|
||||
<p><span class="bullet">‧</span><span class="accent">개별 공사 전</span><span class="text"> 시공상세도를 기반으로 한 작업 내용 확인</span></p>
|
||||
<p><span class="bullet">‧</span><span class="accent">개별 공사 후</span><span class="text"> 실적 관리, 공사관련 문서 작성, 업무 보고</span></p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
33
figma_to_html_agent/blocks/1171281179/texts.md
Normal file
@@ -0,0 +1,33 @@
|
||||
# Frame 1171281179 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출.
|
||||
|
||||
## 타이틀
|
||||
효율적인 정보의 관리와 활용
|
||||
|
||||
## 섹션1 — 무슨 정보 (What)
|
||||
무슨 정보
|
||||
What
|
||||
|
||||
### 본문
|
||||
- 수량, CBS 내역, 단가, 공사일정, 자원 투입계획 등 **계획 정보**
|
||||
- 일일 작업수량, 실제 투입 자원 등 **공사 실행 정보**
|
||||
- 품질/안전/환경 등 점검일지, 체크리스트, 사진 등 **공사 결과**
|
||||
|
||||
## 섹션2 — 어떻게 연계 (HOW)
|
||||
어떻게 연계
|
||||
HOW
|
||||
|
||||
### 본문
|
||||
- 3D 형상 **산출속성과 연계**하여 S/W를 통해 정의
|
||||
- 객체별 품질 검사 기준 등은 **시방규정과 연계**하여 S/W로 정의
|
||||
- 객체별 필요정보를 Text기반 형식으로 **사용자가 입력**
|
||||
|
||||
## 섹션3 — 언제 사용 (WHEN)
|
||||
언제 사용
|
||||
WHEN
|
||||
|
||||
### 본문
|
||||
- **착수 전** 공정계획, 시공계획 등 계획 수립
|
||||
- **개별 공사 전** 시공상세도를 기반으로 한 작업 내용 확인
|
||||
- **개별 공사 후** 실적 관리, 공사관련 문서 작성, 업무 보고
|
||||
BIN
figma_to_html_agent/blocks/1171281180/_renders/flex.png
Normal file
|
After Width: | Height: | Size: 129 KiB |
BIN
figma_to_html_agent/blocks/1171281180/_renders/slide_flex.png
Normal file
|
After Width: | Height: | Size: 122 KiB |
62
figma_to_html_agent/blocks/1171281180/analysis.md
Normal file
@@ -0,0 +1,62 @@
|
||||
# Frame 1171281180 — 시공 전 모델 기반 시공상세 정보물
|
||||
|
||||
## 내용 설명
|
||||
|
||||
시공 전 모델 기반 시공상세 정보물을 활용한 시공계획 작성 지원
|
||||
내용을 세로 스택 리스트로 제시하는 디자인. 타이틀 + 세로 라벨 +
|
||||
여러 항목(정보물·모델·시뮬레이션·도면·성과물)을 수직으로 나열.
|
||||
시공 전 계획 단계 정보물 나열·3D 모델 기반 시공 산출물 목록·
|
||||
시공계획 작성 지원 도구 정리에 적합. 주체별 나열·비교 구조·
|
||||
2개 대조·3개 이하 항목·시간 순서 단계·필수요건 나열에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
시공전모델, 시공상세정보물, 시공계획, 계획작성, 정보물, 모델, 시뮬레이션, 도면, 성과물, 3D모델, 지원
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **pre_construction**: 시공전모델, 시공상세정보물, 시공계획, 계획작성
|
||||
- **deliverables**: 정보물, 모델, 시뮬레이션, 도면, 성과물, 3D모델
|
||||
- **support_context**: 지원
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: list
|
||||
- **layout**: list-stacked-vertical
|
||||
- **axis**: vertical
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 5 / min 4 / max 6
|
||||
- **slots** (3개, required 3개): title, side_label, items
|
||||
- **source title**: 시공 전 모델 기반 시공상세 정보물
|
||||
- **original layout**: list-stacked
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 시공 전 계획 단계 정보물 나열
|
||||
- 3D 모델 기반 시공 산출물 목록
|
||||
- 시공계획 도구 정리
|
||||
|
||||
### not_suits
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 비교 구조 (대조)
|
||||
- 2개 대조
|
||||
- 3개 이하 항목
|
||||
- 시간 순서 단계
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **split**: True
|
||||
- **merge**: True
|
||||
- **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 1171281180 — 시공 전 모델 기반 시공상세 정보물
|
||||
|
||||
## 구조
|
||||
- **layout**: list-stacked
|
||||
- **detail**: 타이틀("시공 전 모델 기반 시공상세 정보물 이용한 시공계획 작성 지원") + 세로 라벨 + 수직 리스트 항목들
|
||||
|
||||
## 내용
|
||||
시공 전 모델 기반 시공상세 정보물 활용 — 시공계획 작성 지원을 위한 정보물·모델·시뮬레이션·도면·성과물 리스트.
|
||||
|
||||
## 후보 키워드
|
||||
시공전모델, 시공상세정보물, 시공계획, 정보물, 모델, 시뮬레이션, 도면, 성과물, 계획작성, 지원, 3D모델
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
@@ -0,0 +1,3 @@
|
||||
<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 22.4 16.8" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="Vector" d="M21.4629 0.5L11.1191 15.8984L0.930664 0.5H21.4629Z" fill="var(--fill-0, black)" stroke="var(--stroke-0, white)"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 316 B |
@@ -0,0 +1,30 @@
|
||||
<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 210.699 489.919" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="Mask group" filter="url(#filter0_d_106_321)">
|
||||
<mask id="mask0_106_321" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="201" height="475">
|
||||
<path id="Intersect" d="M0 58.1721C0 62.7691 3.14483 66.7452 7.5533 68.0482C80.6773 89.662 134.036 157.329 134.036 237.46C134.036 317.59 80.677 385.255 7.55332 406.868C3.14484 408.171 0 412.148 0 416.745V465.118C0 471.337 5.62415 476.059 11.6872 474.677C119.925 450.01 200.699 353.169 200.699 237.46C200.699 121.751 119.925 24.9083 11.6872 0.241745C5.62413 -1.13998 0 3.58191 0 9.80042V58.1721Z" fill="url(#paint0_linear_106_321)"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_106_321)">
|
||||
<rect id="Rectangle 43991" y="-0.00117085" width="270" height="95" fill="var(--fill-0, #FD9164)" fill-opacity="0.8"/>
|
||||
<rect id="Rectangle 43992" y="94.9988" width="270" height="95" fill="var(--fill-0, #F29700)" fill-opacity="0.8"/>
|
||||
<rect id="Rectangle 43993" x="-54" y="189.999" width="270" height="95" fill="var(--fill-0, #FCC948)" fill-opacity="0.8"/>
|
||||
<rect id="Rectangle 43994" y="284.999" width="270" height="95" fill="var(--fill-0, #C3D601)" fill-opacity="0.8"/>
|
||||
<rect id="Rectangle 43995" y="379.999" width="270" height="95" fill="var(--fill-0, #65C6C4)" fill-opacity="0.8"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<filter id="filter0_d_106_321" x="0" y="0" width="210.699" height="489.919" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dx="5" dy="10"/>
|
||||
<feGaussianBlur stdDeviation="2.5"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.3 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_106_321"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_106_321" result="shape"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_106_321" x1="121.177" y1="-3.68723" x2="22.5301" y2="487.856" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6FD6D8"/>
|
||||
<stop offset="1" stop-color="#14706E"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
68
figma_to_html_agent/blocks/1171281180/flat.md
Normal file
@@ -0,0 +1,68 @@
|
||||
# Frame 1171281180 — 실측 기록 (flat)
|
||||
|
||||
> 원본: 1153 × 592 px (node 112:87)
|
||||
> 패턴: stacked-arrow-list (계단식 pill 리스트)
|
||||
> Scale: 1280 / 1153 = 1.11015
|
||||
|
||||
## 구조
|
||||
|
||||
```
|
||||
Frame 112:87 (1153 × 592)
|
||||
├── 112:89 타이틀 바 (12, 47) 1141×29 — CSS: #fbd5b9, radius:5px, shadow
|
||||
├── 112:90 TEXT 타이틀 center(592, 38) — mixed: 43px+50px gradient, #144838
|
||||
│
|
||||
├── 112:91 좌측 아크 장식 (12, 117) 200.7×474.9 — SVG mask group (이미지)
|
||||
├── 112:117 TEXT "시공 상세 정보물" center(62.5, 342) — 45px Bold #144838, 세로 3줄
|
||||
│
|
||||
├── 5개 pill 행 (CSS: bg + border-bottom + radius + shadow)
|
||||
│ ├── 112:111 행1 (65, 128.89) 1088×70 — border-bottom: 3px #fb5915
|
||||
│ │ ├── 화살표 SVG (-rotate-90)
|
||||
│ │ └── TEXT "3차원 형상의 정보 모델과 Data Base (D/B)" — 38px Medium
|
||||
│ │
|
||||
│ ├── 112:114 행2 (137, 220.89) 1016×70 — border-bottom: 3px #e79000
|
||||
│ │ └── TEXT "목적물, 가시설 등의 단계별 시공 시뮬레이션"
|
||||
│ │
|
||||
│ ├── 112:108 행3 (166, 318.89) 987×70 — border-bottom: 3px #e9a804
|
||||
│ │ └── TEXT "시공 및 안전교육에 도움이 되는 영상물 등 성과물"
|
||||
│ │
|
||||
│ ├── 112:102 행4 (137, 420.89) 1016×70 — border-bottom: 3px #919f00
|
||||
│ │ └── TEXT "모델 또는 D/B, 시뮬레이션으로 부터 추출한 도면"
|
||||
│ │
|
||||
│ └── 112:105 행5 (65, 508.89) 1088×70 — border-bottom: 3px #0d6361
|
||||
│ └── TEXT "모델에서 추출이 곤란한 안전, 유의사항, 개념도 등 상세 표현 도면"
|
||||
```
|
||||
|
||||
## 에셋
|
||||
|
||||
| hash | 의미 |
|
||||
|------|------|
|
||||
| ff649c28...svg | 좌측 아크 장식 (복잡 mask, 이미지 유지) |
|
||||
| 29c778b5...svg | 화살표 아이콘 (-rotate-90, 이미지 유지) |
|
||||
|
||||
## pill 행 CSS 속성 (공통)
|
||||
|
||||
- bg: rgba(255,255,255,0.5)
|
||||
- border-bottom: 3px solid {color}
|
||||
- border-radius: 30px
|
||||
- box-shadow: 2px 4px 5px rgba(0,0,0,0.5)
|
||||
- padding: 10px 20px
|
||||
- display: flex; align-items: center; gap: 15px
|
||||
|
||||
## 계단 배치 패턴
|
||||
|
||||
| 행 | left | width | 색상 |
|
||||
|----|------|-------|------|
|
||||
| 1 | 65 | 1088 | #fb5915 |
|
||||
| 2 | 137 | 1016 | #e79000 |
|
||||
| 3 | 166 | 987 | #e9a804 |
|
||||
| 4 | 137 | 1016 | #919f00 |
|
||||
| 5 | 65 | 1088 | #0d6361 |
|
||||
|
||||
다이아몬드 형태: 넓→좁→좁→넓→넓
|
||||
|
||||
## 변형 가능 축
|
||||
|
||||
- items[N=3~7] (required) — 각 행: text + border_color
|
||||
- stacking_pattern (required) — indent 패턴
|
||||
- arc_decoration (optional)
|
||||
- vertical_label (optional)
|
||||
175
figma_to_html_agent/blocks/1171281180/index.html
Normal file
@@ -0,0 +1,175 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280">
|
||||
<title>시공상세 정보물 (Frame 1171281180)</title>
|
||||
<!--
|
||||
Frame: 112:87, 1153×592 px
|
||||
Scale: 1280 / 1153 = 1.11015
|
||||
패턴: stacked-arrow-list
|
||||
구조: R17 (pill 행 flex column) + R19 (zoom)
|
||||
-->
|
||||
<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: 1153px;
|
||||
zoom: 1.11015; /* R19: layout 크기도 반영 */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 타이틀 영역 */
|
||||
.title-area {
|
||||
position: relative;
|
||||
height: 100px;
|
||||
}
|
||||
.title-bar {
|
||||
position: absolute; left: 12px; top: 47px;
|
||||
width: 1141px; height: 29px;
|
||||
background: #fbd5b9; border-radius: 5px;
|
||||
box-shadow: 0 4px 4px rgba(0,0,0,0.25);
|
||||
}
|
||||
.title-text {
|
||||
position: absolute;
|
||||
left: 592px; top: 38px;
|
||||
transform: translate(-50%, -50%);
|
||||
font-weight: 700; font-size: 0; line-height: 0;
|
||||
color: #144838; text-align: center;
|
||||
white-space: nowrap; letter-spacing: -2.25px;
|
||||
}
|
||||
|
||||
/* 좌측 장식 (absolute, 콘텐츠 영역 위에 overlay) */
|
||||
.arc-deco {
|
||||
position: absolute; left: 12px; top: 117px;
|
||||
width: 200.7px; height: 474.92px;
|
||||
z-index: 0;
|
||||
}
|
||||
.arc-deco img { width: 105%; height: 103.16%; display: block; }
|
||||
|
||||
.vlabel {
|
||||
position: absolute;
|
||||
left: 62.5px; top: 342px;
|
||||
transform: translate(-50%, -50%);
|
||||
font-weight: 700; font-size: 45px; line-height: 76px;
|
||||
color: #144838; text-align: center;
|
||||
text-shadow: 0 4px 4px rgba(0,0,0,0.25);
|
||||
white-space: nowrap;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* pill 행 컨테이너 (flex column, R17) */
|
||||
.pill-rows {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; /* 계단 배치: 각 행이 개별 width */
|
||||
gap: 22px;
|
||||
padding-top: 29px; /* 타이틀 아래 여백 */
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* pill 행 (flex row: arrow + text) */
|
||||
.pill-row {
|
||||
height: 70px;
|
||||
background: rgba(255,255,255,0.5);
|
||||
border-radius: 30px;
|
||||
box-shadow: 2px 4px 5px rgba(0,0,0,0.5);
|
||||
border-bottom: 3px solid;
|
||||
display: flex; align-items: center;
|
||||
padding: 10px 20px; gap: 15px;
|
||||
align-self: flex-start; /* 좌측 정렬 기본 */
|
||||
}
|
||||
.pill-row .arrow {
|
||||
flex: none; width: 16.8px; height: 22.4px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.pill-row .arrow img {
|
||||
width: 22.4px; height: 16.8px;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
.pill-row .text {
|
||||
font-weight: 500; font-size: 38px; line-height: 75px;
|
||||
color: #000; letter-spacing: -1.14px; white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 결론 바 영역 */
|
||||
.conclusion {
|
||||
position: relative;
|
||||
margin-top: 20px;
|
||||
height: 109px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="slide">
|
||||
<div class="block">
|
||||
<div class="inner">
|
||||
|
||||
<!-- 타이틀 영역 -->
|
||||
<div class="title-area">
|
||||
<div class="title-bar"></div>
|
||||
<div class="title-text">
|
||||
<span style="font-size:43px; line-height:76px;">시공 전 모델 기반</span>
|
||||
<span style="font-size:45px; line-height:76px;"> </span>
|
||||
<span style="font-weight:900; font-size:50px; line-height:76px; background:linear-gradient(90deg, rgb(204,82,0), rgb(204,82,0)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;">시공상세 정보물</span>
|
||||
<span style="font-size:45px; line-height:76px;"> </span>
|
||||
<span style="font-size:43px; line-height:76px;">이용한 시공계획 작성 지원</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 좌측 장식 (absolute overlay) -->
|
||||
<div class="arc-deco"><img src="assets/ff649c28fd98518d6b48b9e5451fe1da4c1e95d5.svg" alt=""></div>
|
||||
<div class="vlabel">시공<br>상세<br>정보물</div>
|
||||
|
||||
<!-- pill 행 (flex column, R17 — 계단 배치) -->
|
||||
<div class="pill-rows">
|
||||
<!-- 행1: #fb5915, width:1088 -->
|
||||
<div class="pill-row" style="width:1088px; margin-left:65px; border-color:#fb5915;">
|
||||
<div class="arrow"><img src="assets/29c778b566aca6778f505874f21670de129351f8.svg" alt=""></div>
|
||||
<div class="text">3차원 형상의 정보 모델과 Data Base (D/B)</div>
|
||||
</div>
|
||||
|
||||
<!-- 행2: #e79000, width:1016 -->
|
||||
<div class="pill-row" style="width:1016px; margin-left:137px; border-color:#e79000;">
|
||||
<div class="arrow"><img src="assets/29c778b566aca6778f505874f21670de129351f8.svg" alt=""></div>
|
||||
<div class="text">목적물, 가시설 등의 단계별 시공 시뮬레이션</div>
|
||||
</div>
|
||||
|
||||
<!-- 행3: #e9a804, width:987 -->
|
||||
<div class="pill-row" style="width:987px; margin-left:166px; border-color:#e9a804;">
|
||||
<div class="arrow"><img src="assets/29c778b566aca6778f505874f21670de129351f8.svg" alt=""></div>
|
||||
<div class="text">시공 및 안전교육에 도움이 되는 영상물 등 성과물</div>
|
||||
</div>
|
||||
|
||||
<!-- 행4: #919f00, width:1016 -->
|
||||
<div class="pill-row" style="width:1016px; margin-left:137px; border-color:#919f00;">
|
||||
<div class="arrow"><img src="assets/29c778b566aca6778f505874f21670de129351f8.svg" alt=""></div>
|
||||
<div class="text">모델 또는 D/B, 시뮬레이션으로 부터 추출한 도면</div>
|
||||
</div>
|
||||
|
||||
<!-- 행5: #0d6361, width:1088 -->
|
||||
<div class="pill-row" style="width:1088px; margin-left:65px; border-color:#0d6361;">
|
||||
<div class="arrow"><img src="assets/29c778b566aca6778f505874f21670de129351f8.svg" alt=""></div>
|
||||
<div class="text">모델에서 추출이 곤란한 안전, 유의사항, 개념도 등 상세 표현 도면</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
14
figma_to_html_agent/blocks/1171281180/texts.md
Normal file
@@ -0,0 +1,14 @@
|
||||
# Frame 1171281180 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
## 타이틀
|
||||
시공 전 모델 기반 시공상세 정보물 이용한 시공계획 작성 지원
|
||||
|
||||
## 세로 라벨
|
||||
시공 상세 정보물
|
||||
|
||||
## 항목
|
||||
3차원 형상의 정보 모델과 Data Base (D/B)
|
||||
목적물, 가시설 등의 단계별 시공 시뮬레이션
|
||||
시공 및 안전교육에 도움이 되는 영상물 등 성과물
|
||||
모델 또는 D/B, 시뮬레이션으로 부터 추출한 도면
|
||||
모델에서 추출이 곤란한 안전, 유의사항, 개념도 등 상세 표현 도면
|
||||
61
figma_to_html_agent/blocks/1171281181/analysis.md
Normal file
@@ -0,0 +1,61 @@
|
||||
# Frame 1171281181 — 현장 실효성 증대 기본사항
|
||||
|
||||
## 내용 설명
|
||||
|
||||
현장 실효성 증대를 위한 5가지 기본 요소(디지털 정보·S/W 솔루션·
|
||||
PC 활용·직관적 인터페이스 등)를 방사형 다이어그램으로 제시하는
|
||||
디자인. 각 요소는 현장 적용의 핵심 기반을 나타내며 동등한 5개
|
||||
병렬 요소로 배치. 5가지 현장 적용 요소·디지털/S/W/PC 기반 인프라
|
||||
5요소 제시에 적합. 3/4개 이하 항목·6개 이상·주체별 나열·시간
|
||||
순서·2개 비교·필수요건 나열(기술/사람/자연)에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
현장실효성, 기본사항, 현장적용, 디지털정보, S/W솔루션, PC활용, 인터페이스
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **field_effectiveness**: 현장실효성, 기본사항, 현장적용
|
||||
- **tech_infrastructure**: 디지털정보, S/W솔루션, PC활용, 인터페이스
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: diagram
|
||||
- **layout**: radial-diagram-5
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 5 / min 5 / max 5
|
||||
- **slots** (6개, required 6개): title, element_1, element_2, element_3, element_4, element_5
|
||||
- **source title**: 현장 실효성 증대 기본사항
|
||||
- **original layout**: diagram-5
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 5가지 현장 적용 요소
|
||||
- 디지털/S/W/PC 기반 인프라
|
||||
- 5요소 방사형 제시
|
||||
|
||||
### not_suits
|
||||
- 3개 또는 4개 이하 항목
|
||||
- 6개 이상 항목
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 시간 순서
|
||||
- 2개 비교
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281181 — 현장 실효성 증대 기본사항
|
||||
|
||||
## 구조
|
||||
- **layout**: diagram-5
|
||||
- **detail**: 타이틀("현장 실효성 증대 위한 기본사항") + 5개 다이어그램 항목(디지털정보·S/W솔루션·PC·직관 등)
|
||||
|
||||
## 내용
|
||||
현장 실효성 증대를 위한 기본사항 — 디지털 정보·S/W 솔루션·PC 활용·직관적 인터페이스 등 5가지 요소 다이어그램.
|
||||
|
||||
## 후보 키워드
|
||||
현장실효성, 기본사항, 디지털정보, S/W솔루션, PC활용, 직관성, 5요소, 다이어그램, 인터페이스, 현장적용
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
24
figma_to_html_agent/blocks/1171281181/texts.md
Normal file
@@ -0,0 +1,24 @@
|
||||
# Frame 1171281181 — 텍스트 (TF-IDF 매칭용)
|
||||
|
||||
> 프레임 안의 모든 텍스트를 빠짐없이 추출.
|
||||
|
||||
## 타이틀
|
||||
현장 실효성 증대 위한 **기본사항**
|
||||
|
||||
## 본문 — 다이어그램 항목들
|
||||
|
||||
### 항목1
|
||||
시스템 내 디지털 정보물 관리
|
||||
|
||||
### 항목2
|
||||
특정 S/W 종속성 해소
|
||||
|
||||
### 항목3 (중앙 강조)
|
||||
현장 맞춤형
|
||||
Solution
|
||||
|
||||
### 항목4
|
||||
일반PC 사용 가능
|
||||
|
||||
### 항목5
|
||||
직관적 정보의 이해 및 활용
|
||||
42
figma_to_html_agent/blocks/1171281182/_render.py
Normal file
@@ -0,0 +1,42 @@
|
||||
from selenium import webdriver
|
||||
from selenium.webdriver.chrome.options import Options
|
||||
from PIL import Image
|
||||
import os, time
|
||||
|
||||
here = os.path.dirname(os.path.abspath(__file__))
|
||||
renders = os.path.join(here, '_renders')
|
||||
os.makedirs(renders, exist_ok=True)
|
||||
|
||||
opts = Options()
|
||||
opts.add_argument('--headless=new')
|
||||
opts.add_argument('--hide-scrollbars')
|
||||
opts.add_argument('--force-device-scale-factor=1')
|
||||
opts.add_argument('--window-size=1600,900')
|
||||
d = webdriver.Chrome(options=opts)
|
||||
|
||||
p = os.path.join(here, 'index.html').replace(os.sep, '/')
|
||||
d.get('file:///' + p)
|
||||
time.sleep(2.0)
|
||||
full_png = os.path.join(renders, '_full.png')
|
||||
d.save_screenshot(full_png)
|
||||
|
||||
r = d.execute_script(
|
||||
'const r=document.querySelector(".slide").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('slide bounds:', r)
|
||||
Image.open(full_png).crop(
|
||||
(int(r[0]), int(r[1]), int(r[0]+r[2]), int(r[1]+r[3]))
|
||||
).save(os.path.join(renders, 'slide.png'))
|
||||
|
||||
b = d.execute_script(
|
||||
'const r=document.querySelector(".block").getBoundingClientRect();'
|
||||
'return [r.x,r.y,r.width,r.height];'
|
||||
)
|
||||
print('block bounds:', b)
|
||||
Image.open(full_png).crop(
|
||||
(int(b[0]), int(b[1]), int(b[0]+b[2]), int(b[1]+b[3]))
|
||||
).save(os.path.join(renders, 'block.png'))
|
||||
|
||||
d.quit()
|
||||
print('OK')
|
||||
BIN
figma_to_html_agent/blocks/1171281182/_renders/_full.png
Normal file
|
After Width: | Height: | Size: 259 KiB |
BIN
figma_to_html_agent/blocks/1171281182/_renders/block.png
Normal file
|
After Width: | Height: | Size: 245 KiB |
BIN
figma_to_html_agent/blocks/1171281182/_renders/slide.png
Normal file
|
After Width: | Height: | Size: 251 KiB |
BIN
figma_to_html_agent/blocks/1171281182/_renders/slide_2x.png
Normal file
|
After Width: | Height: | Size: 881 KiB |
63
figma_to_html_agent/blocks/1171281182/analysis.md
Normal file
@@ -0,0 +1,63 @@
|
||||
# Frame 1171281182 — 시공단계 BIM 모델·정보 활용 구분
|
||||
|
||||
## 내용 설명
|
||||
|
||||
시공단계에서 BIM 모델과 정보 활용을 3가지로 구분해 제시하는 디자인.
|
||||
Model-based(모델 기반)·Object 기반·Position 기반 3가지 활용법을
|
||||
카드 3열로 나란히 설명. 이 디자인은 주체별(발주자/시공자/설계자)
|
||||
이나 필수요건(기술/사람/자연)이 아니라 BIM 정보 활용 방식의 3가지
|
||||
분류. 시공단계 BIM 활용 3분류·Model/Object/Position 기반 활용법·
|
||||
BIM 정보 이용 패턴 분류에 적합. 주체별 나열·필수요건 나열·2개
|
||||
비교·4개 이상 항목·시간 순서·BIM vs DX 다면 비교에는 부적합.
|
||||
|
||||
## 후보 키워드
|
||||
|
||||
모델기반, Object, Position, Object기반, Position기반, 시공단계, BIM모델, 활용구분, 정보활용, Model
|
||||
|
||||
## 정제 Anchor Sets
|
||||
|
||||
- **three_bim_usage**: 모델기반, Object, Position, Object기반, Position기반
|
||||
- **construction_bim**: 시공단계, BIM모델, 활용구분, 정보활용
|
||||
- **model_context**: Model
|
||||
|
||||
## 구조 매칭 정보
|
||||
|
||||
- **family**: cards
|
||||
- **layout**: cards-3-category
|
||||
- **axis**: horizontal
|
||||
- **relation_type**: parallel
|
||||
- **cardinality**: ideal 3 / min 3 / max 3
|
||||
- **slots** (7개, required 7개): title, category_1_label, category_1_body, category_2_label, category_2_body, category_3_label, category_3_body
|
||||
- **source title**: 시공단계 BIM 모델·정보 활용 구분
|
||||
- **original layout**: 3-category
|
||||
|
||||
## 적합/부적합 기준
|
||||
|
||||
### suits
|
||||
- 시공단계 BIM 활용 3분류
|
||||
- Model/Object/Position 기반 활용법
|
||||
- BIM 정보 이용 패턴 분류
|
||||
|
||||
### not_suits
|
||||
- 주체별 나열 (발주자/시공자/설계자)
|
||||
- 필수요건 나열 (기술/사람/자연)
|
||||
- 2개 비교
|
||||
- 4개 이상 항목
|
||||
- 시간 순서
|
||||
- BIM vs DX 직접 대조
|
||||
|
||||
## 재구성 허용
|
||||
|
||||
- **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 1171281182 — 시공단계 BIM 모델·정보 활용 구분
|
||||
|
||||
## 구조
|
||||
- **layout**: 3-category
|
||||
- **detail**: 타이틀("시공단계 BIM 모델과 정보 활용 구분") + 3카테고리 섹션(모델기반·Object·Position)
|
||||
|
||||
## 내용
|
||||
시공단계에서 BIM 모델과 정보 활용의 3가지 구분 — 모델기반(Model-based)·Object 기반·Position 기반 활용법.
|
||||
|
||||
## 후보 키워드
|
||||
시공단계, BIM모델, 정보활용, 모델기반, Object, Position, Model, 3카테고리, 활용구분, Object기반, Position기반
|
||||
|
||||
## 메타
|
||||
- source: texts.md + flat.md
|
||||
- schema_version: analysis-v1
|
||||
- tagged_by: claude-opus-4-7
|
||||
- tagged_at: 2026-04-21
|
||||
BIN
figma_to_html_agent/blocks/1171281182/assets/card_decor.png
Normal file
|
After Width: | Height: | Size: 1.7 MiB |