kyeongmin
51548fdc41
figma_to_html_agent/: - Figma MCP 기반 블록 추출 에이전트 (CLAUDE.md, PLAN.md, PROCESS.md 등) - block-tests/: Figma→HTML 변환 결과물 (bim-3roles-cards 등) - templates_staging/: Jinja2 템플릿 + meta.yaml + example.yaml - figma-analysis/, figma-assets/: Figma 분석 데이터 + 에셋 - scripts/: gradient_math.py 등 유틸리티 설정: - .mcp.json: Figma MCP 서버 연결 설정 - .claude/settings.json: Claude Code 프로젝트 설정 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
167 lines
7.9 KiB
HTML
167 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=1280">
|
|
<title>현황 및 문제점 (Frame 1171281194)</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@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; padding: 20px;
|
|
word-break: keep-all;
|
|
}
|
|
.slide {
|
|
width: 1280px; height: 913.5px;
|
|
background: #fff;
|
|
position: relative;
|
|
display: flex; align-items: center; justify-content: center;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,.15);
|
|
}
|
|
.block { width: 1280px; height: 913.5px; position: relative; overflow: hidden; }
|
|
.inner {
|
|
position: absolute; left: 0; top: 0;
|
|
width: 1857px; height: 1325.62px;
|
|
transform: scale(0.689285);
|
|
transform-origin: top left;
|
|
}
|
|
|
|
/* 헤더 */
|
|
.header {
|
|
position: absolute; left: 0; top: 0;
|
|
display: flex; align-items: center; gap: 15px; height: 101px;
|
|
}
|
|
.header-icon { width: 50px; height: 50px; }
|
|
.header-icon img { width: 100%; height: 100%; object-fit: cover; }
|
|
.header-title {
|
|
font-weight: 700; font-size: 70px; line-height: normal; white-space: nowrap;
|
|
background-image: linear-gradient(180deg, #cc5200 0%, #883700 100%);
|
|
-webkit-background-clip: text; background-clip: text; color: transparent;
|
|
text-shadow: 0 0 4px #322c1e;
|
|
}
|
|
|
|
/* row-box */
|
|
.row-box {
|
|
position: absolute;
|
|
left: 60px; width: 1797px;
|
|
border: 3px solid #60a451;
|
|
border-radius: 30px;
|
|
background: rgba(250, 237, 203, 0.15);
|
|
}
|
|
|
|
/* 점선 */
|
|
.row-divider {
|
|
position: absolute;
|
|
left: 945px; width: 0; height: 195px;
|
|
border-left: 1px dashed rgba(96, 164, 81, 0.4);
|
|
}
|
|
|
|
/* 텍스트 */
|
|
.pair-text {
|
|
position: absolute;
|
|
font-weight: 500; font-size: 36px; line-height: 65px;
|
|
color: #0c271e;
|
|
word-break: keep-all;
|
|
z-index: 3;
|
|
}
|
|
.pair-text.left { left: 95.28px; width: 829.93px; }
|
|
.pair-text.right { left: 958.01px; width: 867.9px; text-align: right; }
|
|
|
|
/* pill — absolute, Figma 좌표 그대로, row-box 밖으로 걸침
|
|
두루마리 형태: 이미지(R16 프레임 배치) — crop/프레임이므로 이미지 유지 */
|
|
.label-pill {
|
|
position: absolute;
|
|
width: 457.96px;
|
|
height: 95.62px;
|
|
overflow: hidden;
|
|
z-index: 1;
|
|
}
|
|
/* 상단 pill 이미지 배치 (R16) */
|
|
.label-pill.left-pill img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: -45.3%;
|
|
width: 145.3%;
|
|
height: 100%;
|
|
}
|
|
.label-pill.right-pill img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 151.25%;
|
|
height: 100%;
|
|
}
|
|
/* 하단 pill: rotate(180) + 이미지 배치 반전 (R16) */
|
|
.label-pill.bottom.left-pill img {
|
|
left: 0;
|
|
width: 151.25%;
|
|
}
|
|
.label-pill.bottom.right-pill img {
|
|
left: -45.3%;
|
|
width: 145.3%;
|
|
}
|
|
.label-pill .text {
|
|
position: absolute; inset: 0;
|
|
display: flex; align-items: center; justify-content: center;
|
|
font-weight: 700; font-size: 40px; color: #fff;
|
|
line-height: 70px; white-space: nowrap; z-index: 2;
|
|
}
|
|
.label-pill.bottom { transform: rotate(180deg); }
|
|
.label-pill.bottom .text { transform: rotate(180deg); }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="slide">
|
|
<div class="block">
|
|
<div class="inner">
|
|
|
|
<!-- 헤더 -->
|
|
<div class="header">
|
|
<div class="header-icon"><img src="assets/shared/b0e9fad5b03f4d9e368524976c20c9886392e17b.png" alt=""></div>
|
|
<div class="header-title">현황 및 문제점</div>
|
|
</div>
|
|
|
|
<!-- Row 1: 개념 부재 / 잘못된 접근방식 — pills top -->
|
|
<div class="row-box" style="top:143px; height:229px;"></div>
|
|
<div class="row-divider" style="top:160px;"></div>
|
|
<div class="pair-text left" style="top:228px;">BIM을 Digital 전환의 개념이 아닌, CAD의 확장판으로 해석하여 3D를 그리는 수단 정도로만 인식</div>
|
|
<div class="pair-text right" style="top:228px;">단순 업무효율 증진을 위한 도구로만 인식하여, 기술자들이 도구로서 사용만 할 수 있도록 교육시키면 된다고 판단</div>
|
|
<div class="label-pill left-pill" style="left:60px; top:124px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">개념 부재</div></div>
|
|
<div class="label-pill right-pill" style="left:1399.04px; top:124px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">잘못된 접근방식</div></div>
|
|
|
|
<!-- Row 2: 방향성 상실 / 전제조건 오류 — pills bottom -->
|
|
<div class="row-box" style="top:372px; height:231px;"></div>
|
|
<div class="row-divider" style="top:387px;"></div>
|
|
<!-- TEMP: 1:1 fidelity — Chrome Noto Sans KR 너비 보정. 템플릿화 시 제거 -->
|
|
<div class="pair-text left" style="top:389px; letter-spacing:-0.8px;">대형 S/W 개발 및 판매회사에서 제시된 내용과 방향대로 따라하므로써, 국내는 자체적 목표설정 기능을 상실</div>
|
|
<div class="pair-text right" style="top:389px;">건축과 토목이 유사하다는 전제하에 Library를 활용하는 건축에서 수행하고 있는 방식을 토목에도 동일하게 적용</div>
|
|
<div class="label-pill bottom left-pill" style="left:60px; top:522px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">방향성 상실</div></div>
|
|
<div class="label-pill bottom right-pill" style="left:1399.04px; top:526.43px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">전제조건 오류</div></div>
|
|
|
|
<!-- Row 3: 수행주체 혼란 / 수행방식 무지 — pills top -->
|
|
<div class="row-box" style="top:706px; height:310px;"></div>
|
|
<div class="row-divider" style="top:791px;"></div>
|
|
<div class="pair-text left" style="top:801px;">학자, 발주처 중심으로 S/W 판매회사에서 제시한 기술 수행 방식의 변화를 주도, 실행주체인 기업과 기술자들은 기존의 방식을 고수하면서 눈치만 보는 실정</div>
|
|
<div class="pair-text right" style="top:801px;">기존 2D 설계의 결과가 옳다는 전제와 3D 설계를 수행/검토해본 경험이 없어, 전환설계의 개념으로 수행하므로써 비용과 시간이 추가로 소요, 높은 수준의 품질확보 불가</div>
|
|
<div class="label-pill left-pill" style="left:60px; top:687px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">수행주체 혼란</div></div>
|
|
<div class="label-pill right-pill" style="left:1399.04px; top:687px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">수행방식 무지</div></div>
|
|
|
|
<!-- Row 4: 외산S/W 기술예속 / H/W 미비 — pills bottom -->
|
|
<div class="row-box" style="top:1016px; height:290px;"></div>
|
|
<div class="row-divider" style="top:1036px;"></div>
|
|
<div class="pair-text left" style="top:1031px;">단순 외산 범용S/W만 사용하면 BIM이 될 수 있을 것이라는 안일한 생각으로 접근하므로 외국 대형S/W 회사에 기술예속 가속</div>
|
|
<!-- TEMP: 1:1 fidelity — Chrome Noto Sans KR 너비 보정. 템플릿화 시 제거 -->
|
|
<div class="pair-text right" style="top:1031px; letter-spacing:-1.2px;">도면작성 중심의 기존 설계방식과 동일한 개념으로 생각하여, 탁상용 개인 PC, Monitor 사용기반 정도에 머물러 있어 실무적용에 필요한 높은 수준의 모델 등의 표출은 한계</div>
|
|
<div class="label-pill bottom left-pill" style="left:60px; top:1226.08px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">외산S/W 기술예속</div></div>
|
|
<div class="label-pill bottom right-pill" style="left:1399.04px; top:1226px;"><img src="assets/shared/b47d2977a36ab6a0c180d8f090afff798c44ed27.png" alt=""><div class="text">H/W 미비</div></div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|