전체 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>
338 lines
12 KiB
HTML
338 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=1280">
|
|
<title>BIM 수행실정 (Frame 1171281193)</title>
|
|
<!--
|
|
원본: design_agent(원본)/figma_to_html_agent/block-tests/bim-issues-quadrant.html
|
|
하이브리드: text-box hybrid
|
|
축1: body 내부 ul/li → R13 flex pair + height:auto ✓
|
|
축1.5: headline+body → text-group 묶음 (multiline headline → body 밀림) ✓
|
|
축2 (미적용): 우측 bullet-row 배치 방식
|
|
변경하지 않은 것: card-bg, ribbon, center-quote, zoom
|
|
-->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;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;
|
|
padding: 20px;
|
|
}
|
|
.slide {
|
|
width: 1280px;
|
|
background: #ffffff;
|
|
position: relative;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,.15);
|
|
}
|
|
.block {
|
|
width: 1280px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.inner {
|
|
width: 2226px;
|
|
height: 1766px;
|
|
zoom: 0.575022; /* R19 */
|
|
position: relative;
|
|
}
|
|
|
|
/* ─── 카드 배경 (원본 그대로) ─── */
|
|
.card-bg {
|
|
position: absolute;
|
|
width: 1080px;
|
|
height: 270.183px;
|
|
background: linear-gradient(180deg, #f2f2f2 0%, #ffffff 100%);
|
|
}
|
|
.card-bg.tl { left: 5px; top: 0; border-radius: 50px 50px 0 0; }
|
|
.card-bg.tr { left: 1142px; top: 0; border-radius: 50px 50px 0 0; }
|
|
.card-bg.bl { left: 5px; top: 1495.69px; border-radius: 0 0 50px 50px; background: linear-gradient(0deg, #f2f2f2 0%, #ffffff 100%); }
|
|
.card-bg.br { left: 1146px; top: 1495.69px; border-radius: 0 0 50px 50px; background: linear-gradient(0deg, #f2f2f2 0%, #ffffff 100%); }
|
|
|
|
/* ─── Header ribbons (원본 그대로) ─── */
|
|
.header-ribbon {
|
|
position: absolute;
|
|
width: 1080px;
|
|
height: 119px;
|
|
border-radius: 50px;
|
|
}
|
|
.header-ribbon .text {
|
|
position: absolute;
|
|
inset: 0;
|
|
display: flex; align-items: center; justify-content: center;
|
|
font-weight: 900;
|
|
font-size: 60px;
|
|
color: #ffffff;
|
|
text-shadow: 0 0 4px #322c1e;
|
|
z-index: 2;
|
|
}
|
|
.header-ribbon.tl {
|
|
left: 5px; top: 0;
|
|
background: linear-gradient(270deg, rgba(165,161,150,0.5) -26.87%, #39321E 73.13%);
|
|
}
|
|
.header-ribbon.bl {
|
|
left: 5px; top: 1646.86px;
|
|
background: linear-gradient(270deg, rgba(165,161,150,0.5) -26.87%, #39321E 73.13%);
|
|
}
|
|
.header-ribbon.tr {
|
|
left: 1142px; top: 0;
|
|
background: linear-gradient(90deg, rgba(41,107,85,0.5) 0%, #032118 100%);
|
|
}
|
|
.header-ribbon.br {
|
|
left: 1146px; top: 1646.99px;
|
|
background: linear-gradient(90deg, rgba(41,107,85,0.5) 0%, #032118 100%);
|
|
}
|
|
|
|
/* ─── 가운데 원 (원본 그대로) ─── */
|
|
.center-quote {
|
|
position: absolute;
|
|
left: 809.01px;
|
|
top: 581.87px;
|
|
width: 644.99px;
|
|
height: 584.43px;
|
|
}
|
|
.center-quote img {
|
|
width: 100%; height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
.center-quote .text {
|
|
position: absolute;
|
|
left: 47.24px; top: 188.26px;
|
|
width: 552.41px;
|
|
height: 220.93px;
|
|
font-weight: 700;
|
|
font-size: 55px;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
line-height: normal;
|
|
}
|
|
|
|
/* ─── Text group (headline + body 묶음) ─── */
|
|
.text-group {
|
|
position: absolute;
|
|
}
|
|
|
|
/* ─── 빨간 헤드라인 (nowrap 제거 → 폭 안에서 자연 줄바꿈) ─── */
|
|
.red-h {
|
|
font-weight: 700;
|
|
font-size: 55px;
|
|
line-height: 65px;
|
|
color: #ff0000;
|
|
word-break: keep-all;
|
|
}
|
|
|
|
/* ─── 본문 body ─── */
|
|
.body-text {
|
|
font-weight: 400;
|
|
font-size: 42px;
|
|
line-height: 60px;
|
|
color: #000000;
|
|
word-break: keep-all;
|
|
}
|
|
|
|
/* ── R13 flex pair ── */
|
|
.bullet-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.bullet-row {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
}
|
|
.bullet-row .marker {
|
|
flex: none;
|
|
width: 1.5em;
|
|
text-align: center;
|
|
}
|
|
.bullet-row .bt {
|
|
flex: 1;
|
|
}
|
|
|
|
/* ─── Left-side text groups ─── */
|
|
/* 각 margin-bottom = 원본 (body_top - headline_top - 65px line-height) */
|
|
|
|
.tg-tl-1 { left: 8px; top: 151.22px; }
|
|
.tg-tl-1 .red-h { margin-left: 4px; width: 771px; margin-bottom: 6px; }
|
|
.tg-tl-1 .body-text { width: 993px; }
|
|
|
|
.tg-tl-2 { left: 8px; top: 565.27px; }
|
|
.tg-tl-2 .red-h { margin-left: 4px; width: 885px; margin-bottom: 15px; }
|
|
.tg-tl-2 .body-text { width: 870px; }
|
|
|
|
.tg-bl-1 { left: 8px; top: 957.17px; }
|
|
.tg-bl-1 .red-h { margin-left: 4px; width: 657px; margin-bottom: 13px; }
|
|
.tg-bl-1 .body-text { width: 972px; }
|
|
|
|
.tg-bl-2 { left: 0; top: 1298.36px; }
|
|
.tg-bl-2 .red-h { margin-left: 12px; width: 771px; margin-bottom: 4px; }
|
|
.tg-bl-2 .body-text { width: 1082px; }
|
|
|
|
/* ─── Right-side text groups ─── */
|
|
.tg-right {
|
|
width: 1100px;
|
|
}
|
|
.tg-right .red-h {
|
|
text-align: right;
|
|
}
|
|
.tg-right .body-text {
|
|
margin-left: auto;
|
|
margin-right: 20px; /* body right:21 - group right:1 = 20px */
|
|
text-align: right;
|
|
}
|
|
.tg-right .bullet-row .bt {
|
|
text-align: right;
|
|
}
|
|
.tg-right .bullet-row .marker {
|
|
width: auto;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.tg-tr-1 { right: 1px; top: 151.22px; }
|
|
.tg-tr-1 .red-h { margin-bottom: 6px; }
|
|
.tg-tr-1 .body-text { width: 1058px; }
|
|
|
|
.tg-tr-2 { right: 1px; top: 564.35px; }
|
|
.tg-tr-2 .red-h { margin-bottom: 6px; }
|
|
|
|
.tg-br-1 { right: 1px; top: 957.17px; }
|
|
.tg-br-1 .red-h { margin-bottom: 6px; }
|
|
|
|
.tg-br-2 { right: 1px; top: 1312.18px; }
|
|
.tg-br-2 .red-h { margin-bottom: 2px; }
|
|
.tg-br-2 .body-text { width: 1074px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="slide">
|
|
<div class="block">
|
|
<div class="inner">
|
|
|
|
<!-- 카드 배경 4개 -->
|
|
<div class="card-bg tl"></div>
|
|
<div class="card-bg tr"></div>
|
|
<div class="card-bg bl"></div>
|
|
<div class="card-bg br"></div>
|
|
|
|
<!-- 헤더 ribbons -->
|
|
<div class="header-ribbon tl"><div class="text">정책 집행</div></div>
|
|
<div class="header-ribbon tr"><div class="text">수행 개념</div></div>
|
|
<div class="header-ribbon bl"><div class="text">근본 취지의 이해부족</div></div>
|
|
<div class="header-ribbon br"><div class="text">지속적 투자 의지 부재</div></div>
|
|
|
|
<!-- 가운데 원 -->
|
|
<div class="center-quote">
|
|
<img src="assets/922ee6f4bea1434652ffc08f962086052286b6c5.png" alt="">
|
|
<div class="text">Rome wasn't<br>Built in a day!</div>
|
|
</div>
|
|
|
|
<!-- ═══ 좌상 (정책 집행) ═══ -->
|
|
<div class="text-group tg-tl-1">
|
|
<p class="red-h">인정주의 정책 집행</p>
|
|
<div class="body-text">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">수행능력이 없는 업체 선정 후 품질을 낮추어 시행하고 낮은 수준의 성과품을 실적으로 수용</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">모든 설계사가 할 수 있다는 전제하에 정책 시행</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">발주처의 책임회피를 위한 제도 운영</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-group tg-tl-2">
|
|
<p class="red-h">적용효과도 사례도 없는 방침부터 남발</p>
|
|
<div class="body-text">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">효과 검증도 없는 지침부터 만들고보는 현실</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">BIM/DX 적용효과를 판단할 사례 부재</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">대부분 홍보목적으로 포장되어 투자 대비 효과 없음</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══ 우상 (수행 개념) ═══ -->
|
|
<div class="text-group tg-right tg-tr-1">
|
|
<p class="red-h">공학적 개념 정립 부재</p>
|
|
<div class="body-text" style="width:1058px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">DX 개념과 BIM 기술의 차이점의 이해부족으로 전략적 접근방식과 기술적 도구 사이의 혼란만 가중</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">인프라시설의 DX의 기본은 단순 모델이 아닌 위치기반 3D 모델(BIM)을 활용한 과정(Process)의 혁신</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">기술적 도구인 3D 모델 제작S/W에 과도하게 의존</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-group tg-right tg-tr-2">
|
|
<p class="red-h">'본업 기술력 확보' 우선의 개념 부재</p>
|
|
<div class="body-text" style="width:915px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">깊은 기반지식 바탕의 기술이 축적된 메뉴얼에 대한 중요성 및 필요성에 대한 이해 부족</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="body-text" style="width:751px; margin-top:20px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">자체 기술개발 없이 국내 발주처의 지침과 방침에만 의존한 낮은 기술력</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══ 좌하 (근본 취지의 이해부족) ═══ -->
|
|
<div class="text-group tg-bl-1">
|
|
<p class="red-h">기술투자 없는 성과 창출 기대</p>
|
|
<div class="body-text">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">이전의 CAD 도입·확장 시기처럼 상용화된 BIM S/W만 구입·구독하면 될거라는 안일한 생각</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">기술개발 노력없이 과거처럼 하면 된다는 착각</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-group tg-bl-2">
|
|
<p class="red-h">엔지니어링 S/W에 대한 개념 부재</p>
|
|
<div class="body-text">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">다양한 엔지니어링 S/W의 특성에 대한 깊은 이해없이 단기 비용절감에 치우쳐 범용 S/W 선택</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">대형 Global S/W 회사에 과도한 의존과 이에 예속되는 방침 남발로 전용S/W 소멸</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ═══ 우하 (지속적 투자 의지 부재) ═══ -->
|
|
<div class="text-group tg-right tg-br-1">
|
|
<p class="red-h">근본적인 역할은 회피</p>
|
|
<div class="body-text" style="width:880px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">엔지니어의 근본적인 역할인 과정의 혁신과 결과물의 변화에 대한 고민 부재</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="body-text" style="width:1025px; margin-top:6px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">기술자가 직접 3D 모델을 만들고 수정하며 설계를 수행해야하는데 정작 모델제작은 외주처리</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-group tg-right tg-br-2">
|
|
<p class="red-h">과거의 타성에 머무르고 있는 업계</p>
|
|
<div class="body-text" style="width:1074px;">
|
|
<div class="bullet-list">
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">설계/감리/시공 임직원들의 디지털무지와 전략적 무지</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">S/W 판매업체의 기능적 사용법을 BIM 교육으로 착각</span></div>
|
|
<div class="bullet-row"><span class="marker">•</span><span class="bt">교육을 통한 인재양성보다는 당장 실무활용이 가능한 타사의 인력을 빼오기에 집중</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|