Files
C.E.L_Slide_test2/samples/src/pages/civil-dx/big-room/01-설치-근거-및-필요성.astro

297 lines
21 KiB
Plaintext

---
import StarlightPage from '@astrojs/starlight/components/StarlightPage.astro';
---
<StarlightPage frontmatter={{ title: '기초 용어 정의', tableOfContents: false }}>
<style is:global>
.sl-markdown-content,
.content-panel,
.sl-container,
[data-pagefind-body],
main {
max-width: 100% !important;
padding: 0 !important;
margin: 0 !important;
width: 100% !important;
}
.sl-markdown-content h2,
.sl-markdown-content h3 { all: unset; display: block; }
.sl-markdown-content table { all: unset; display: table; width: 100%; border-collapse: collapse; }
.sl-markdown-content th,
.sl-markdown-content td { all: unset; display: table-cell; }
.sl-markdown-content ul,
.sl-markdown-content ol { all: unset; display: block; }
.sl-markdown-content li { all: unset; display: list-item; }
.sl-markdown-content img { all: unset; }
.sl-markdown-content p { all: unset; display: block; }
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
body { font-family: 'Noto Sans KR', sans-serif; }
table { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 0.9rem; }
th { background: #f1f3f5; border: 1px solid #ddd; padding: 8px; text-align: center; }
td { border: 1px solid #ddd; padding: 8px; vertical-align: middle; }
ul { padding-left: 20px; margin-top: 5px; }
li { margin-bottom: 5px; }
img { max-width: 100%; border-radius: 8px; }
blockquote { margin: 10px 0; padding: 10px 15px; border-left: 4px solid #0056b3; background: #f8f9fa; }
/* 컬럼 리사이즈 핸들 */
.col-resize-handle {
width: 6px;
cursor: col-resize;
background: transparent;
flex-shrink: 0;
position: relative;
z-index: 10;
transition: background 0.2s;
}
.col-resize-handle:hover, .col-resize-handle.dragging {
background: #0056b3;
border-radius: 3px;
}
.col-resize-handle::after {
content: '⋮';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #999;
font-size: 14px;
pointer-events: none;
}
.col-resize-handle:hover::after, .col-resize-handle.dragging::after {
color: #fff;
}
/* 표 리사이즈 */
table {
position: relative;
}
.table-wrapper {
position: relative;
margin-top: 10px;
}
.table-col-grip {
position: absolute;
top: 0;
width: 8px;
height: 100%;
cursor: col-resize;
z-index: 10;
background: transparent;
}
.table-col-grip:hover {
background: rgba(0, 86, 179, 0.25);
}
.table-row-grip {
position: absolute;
left: 0;
width: 100%;
height: 8px;
cursor: row-resize;
z-index: 10;
background: transparent;
}
.table-row-grip:hover {
background: rgba(0, 86, 179, 0.25);
}
</style>
<div style="height: 100%; width: 100%; overflow: hidden; display: flex; flex-direction: column; padding: 15px 40px; box-sizing: border-box;">
<div id="colContainer" style="flex: 1 1 auto; display: flex; align-items: stretch; margin-top: 10px; margin-bottom: 10px;">
<div id="leftCol" style="flex: 4; display: flex; flex-direction: column;
padding-right: 20px;
overflow-y: auto; padding-top: 5px;">
<h2 style="font-size: 1.5rem; font-weight: bold; border-bottom: 2px solid #333;
padding-bottom: 10px; margin-bottom: 15px; margin-top: 7px;">1. 기초 용어 정의</h2>
<div style="font-size: 1rem; line-height: 1.6; color: #333;"><p>건설산업에서 BIM, DX를 이해하려면 각각의 용어가 무엇을 뜻하는지 명확히 구분하여야 한다.</p>
<h3 style="font-size:1.1rem; margin: 15px 0 8px 0;">1.1 건설산업</h3>
<p>수요자가 요구하는 다양한 시설물을, 각 산업마다의 <strong>광범위한 기술을 통합 및 융합</strong>하여 만들어 내는 종합산업으로, 목적 시설물의 품질에 대한 욕구를 충족 시키면서 <strong>최단기간</strong> 내에 <strong>최소한의 비용</strong>으로 <strong>편리</strong>하고 <strong>안전</strong>하며 <strong>우수한 성능</strong>의 <strong>시설물을 완성</strong>하는 것을 목표로 하는산업을 의미한다.</p>
<h3 style="font-size:1.1rem; margin: 15px 0 8px 0;">1.2 BIM(building information modeling, 건설정보모델링)</h3>
<p>BIM은 시설물의 생애주기 동안 발생하는 모든 정보를 3D 모델 기반으로 통합하여, 건설정보와 절차를 표준화된 방식으로 상호 연계하고 디지털 협업이 가능하게 하는 <strong>디지털전환(DX, Digital Transformation) 체계</strong>를 의미한다.</p>
<h3 style="font-size:1.1rem; margin: 15px 0 8px 0;">1.3 DX(digital Transformation, 디지털 전환)</h3>
<p><strong>디지털 기술과 도구</strong>를 활용하여, 고객과 시장의 변화에 대응하고 <strong>새로운 가치를 창출</strong>하며 산업생태계, 비지니스 모델(B.M) 및 업무수행 방식(Process)을 혁신하는 과정과 전환을 말한다.</p>
<div style="text-align: center; margin: 15px 0;">
<img alt="디지털전환 그림" src="/assets/images/01.png" style="max-height: 35vh; object-fit: contain;"/>
<p style="font-size: 0.9rem; color: #666; margin-top: 5px;"></p>
</div>
</div>
</div>
<div class="col-resize-handle" id="colResizeHandle"></div>
<div id="rightCol" style="flex: 6; display: flex; flex-direction: column; padding-left: 20px; overflow-y: auto;">
<h2 style="font-size: 1.5rem; font-weight: bold; border-bottom: 2px solid #333;
padding-bottom: 10px; margin-bottom: 15px; margin-top: -3px;">2. BIM vs DX 비교</h2>
<div style="font-size: 1rem; line-height: 1.6; color: #333;"><p>흔히 BIM과 DX를 혼용하여 사용하곤 한다. 하지만 BIM이 3D 형상 구현을 위한 도구적 성격이 강하다면, DX는 이를 기반으로 데이터와 프로세스 전반을 혁신하는 체계라는 점에서 <strong>엄연히 다른 개념</strong>이다.</p>
<div class="table-wrapper"><table style="width:100%; border-collapse:collapse; margin-top:10px; font-size:0.9rem; table-layout:fixed;"><thead><tr><th style="background: rgb(241, 243, 245); border: 1px solid rgb(221, 221, 221); padding: 8px; text-align: left; width: 328px;">BIM</th><th style="background: rgb(241, 243, 245); border: 1px solid rgb(221, 221, 221); padding: 8px; text-align: left; width: 164px;">구분</th><th style="background: rgb(241, 243, 245); border: 1px solid rgb(221, 221, 221); padding: 8px; text-align: center; width: 625px;">DX</th></tr></thead><tbody><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;"><strong>Only 3D</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>BIM/DX</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>BIM &lt;&lt; DX</strong> (ENG. + Management 포함)</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;"><strong>모델 제작용 상용 S/W</strong><br/>[Civil 3D, Revit, Navisworks, Autocad]</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>S/W</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>제작 및 운영</strong> (상용 + 전용 40~80개)<br/>[Rhino, Sketchup, Blender..] + [EG-BIM 등]</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">기존 2D 설계방식 유지</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>프로세스</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>근본적 문제의식</strong>을 통한 개선</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;"><strong>3D 모델 중심</strong><br/>기존 성과품 유지</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>성과품</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>공학 정보 및 콘텐츠 연계</strong>에 집중<br/>도면, 수량, 시공계획 등 일식</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">3D 모델에 의한 일반적 이해 향상</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>활용</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>설계/시공의 혁신</strong> (개념의 재정립)</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">(설계/시공/운영) 분야별 단절</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>확장성</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>전 생애주기</strong> 활용 시스템</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;"><strong>단순화(오류)</strong><br/>수동적/집단적 동질화</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>수행개념</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>구체화(복잡)</strong><br/>적극/구체적 실현 방안</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">소극적, 상용 기술에 의존</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>CIVIL + IT</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>적극적</strong>, 주체적인 기술 접목/융합</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">S/W 제작사 판매 정책에 의존</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>주체</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>자체 수행능력</strong> - 지속가능성 확보</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">평준화, 국내 중심</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>발주처</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>차별화 및 경쟁력 확보</strong>, 해외 진출</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">소규모 BIM팀 운영 + 단순교육에 집중</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>설계사</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>IT + CIVIL ENG 220명 운영</strong> + 기술 개발</td></tr><tr><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 328px;">국내 토목 소극적 / 해외 토목증가</td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: left; width: 164px;"><strong>시공사</strong></td><td style="border: 1px solid rgb(221, 221, 221); padding: 8px; vertical-align: middle; text-align: center; width: 625px;"><strong>분야 확장 모델 및 시스템</strong></td></tr></tbody></table><div class="table-col-grip" data-col-index="0" style="left: 342px; height: 605px;"></div><div class="table-col-grip" data-col-index="1" style="left: 524px; height: 605px;"></div><div class="table-row-grip" data-row-index="0" style="top: 37px; width: 1173px;"></div><div class="table-row-grip" data-row-index="1" style="top: 78px; width: 1173px;"></div><div class="table-row-grip" data-row-index="2" style="top: 142px; width: 1173px;"></div><div class="table-row-grip" data-row-index="3" style="top: 183px; width: 1173px;"></div><div class="table-row-grip" data-row-index="4" style="top: 247px; width: 1173px;"></div><div class="table-row-grip" data-row-index="5" style="top: 288px; width: 1173px;"></div><div class="table-row-grip" data-row-index="6" style="top: 329px; width: 1173px;"></div><div class="table-row-grip" data-row-index="7" style="top: 393px; width: 1173px;"></div><div class="table-row-grip" data-row-index="8" style="top: 434px; width: 1173px;"></div><div class="table-row-grip" data-row-index="9" style="top: 475px; width: 1173px;"></div><div class="table-row-grip" data-row-index="10" style="top: 516px; width: 1173px;"></div><div class="table-row-grip" data-row-index="11" style="top: 557px; width: 1173px;"></div></div>
<p>:::note</p>
<p>BIM은 건설산업의 DX(디지털 전환)을 수행하는 과정에서 가장 기초가 되는 일부분이다.</p>
<p>:::</p></div>
</div>
</div>
</div>
</StarlightPage>
<script is:inline>
document.addEventListener('DOMContentLoaded', function() {
// ===== 1. 컬럼 리사이즈 =====
(function() {
var handle = document.getElementById('colResizeHandle');
if (!handle) return;
var container = document.getElementById('colContainer');
var leftCol = document.getElementById('leftCol');
var rightCol = document.getElementById('rightCol');
if (!leftCol || !rightCol) return;
var dragging = false;
handle.addEventListener('mousedown', function(e) {
e.preventDefault();
dragging = true;
handle.classList.add('dragging');
document.body.style.cursor = 'col-resize';
document.body.style.userSelect = 'none';
});
document.addEventListener('mousemove', function(e) {
if (!dragging) return;
var rect = container.getBoundingClientRect();
var x = e.clientX - rect.left;
var totalW = rect.width;
var leftRatio = (x / totalW) * 10;
leftRatio = Math.max(2, Math.min(8, leftRatio));
var rightRatio = 10 - leftRatio;
leftCol.style.flex = leftRatio.toFixed(1);
rightCol.style.flex = rightRatio.toFixed(1);
});
document.addEventListener('mouseup', function() {
if (!dragging) return;
dragging = false;
handle.classList.remove('dragging');
document.body.style.cursor = '';
document.body.style.userSelect = '';
});
})();
// ===== 2. 표 셀 리사이즈 (오버레이 방식) =====
(function() {
document.querySelectorAll('table').forEach(function(table) {
table.style.tableLayout = 'fixed';
// 테이블을 wrapper로 감싸기
var wrapper = document.createElement('div');
wrapper.className = 'table-wrapper';
table.parentNode.insertBefore(wrapper, table);
wrapper.appendChild(table);
function createGrips() {
// 기존 그립 제거
wrapper.querySelectorAll('.table-col-grip, .table-row-grip').forEach(function(g) { g.remove(); });
var rows = table.querySelectorAll('tr');
if (rows.length === 0) return;
// 컬럼 그립 - 첫 행의 셀 경계에 배치
var cells = rows[0].querySelectorAll('th, td');
var cumX = 0;
for (var i = 0; i < cells.length - 1; i++) {
cumX += cells[i].offsetWidth;
var grip = document.createElement('div');
grip.className = 'table-col-grip';
grip.style.left = (cumX - 4) + 'px';
grip.style.height = table.offsetHeight + 'px';
grip.dataset.colIndex = i;
wrapper.appendChild(grip);
(function(colIdx, gripEl) {
var startX, startW, nextStartW, col, nextCol;
gripEl.addEventListener('mousedown', function(e) {
e.preventDefault();
startX = e.clientX;
col = [];
nextCol = [];
rows.forEach(function(row) {
var c = row.querySelectorAll('th, td');
if (c[colIdx]) col.push(c[colIdx]);
if (c[colIdx + 1]) nextCol.push(c[colIdx + 1]);
});
startW = col[0] ? col[0].offsetWidth : 100;
nextStartW = nextCol[0] ? nextCol[0].offsetWidth : 100;
document.body.style.cursor = 'col-resize';
document.body.style.userSelect = 'none';
function onMove(ev) {
var diff = ev.clientX - startX;
var newW = Math.max(40, startW + diff);
var newNextW = Math.max(40, nextStartW - diff);
col.forEach(function(c) { c.style.width = newW + 'px'; });
nextCol.forEach(function(c) { c.style.width = newNextW + 'px'; });
}
function onUp() {
document.removeEventListener('mousemove', onMove);
document.removeEventListener('mouseup', onUp);
document.body.style.cursor = '';
document.body.style.userSelect = '';
createGrips();
}
document.addEventListener('mousemove', onMove);
document.addEventListener('mouseup', onUp);
});
})(i, grip);
}
// 행 그립 - 각 행 하단에 배치
var cumY = 0;
for (var r = 0; r < rows.length - 1; r++) {
cumY += rows[r].offsetHeight;
var rowGrip = document.createElement('div');
rowGrip.className = 'table-row-grip';
rowGrip.style.top = (cumY - 4) + 'px';
rowGrip.style.width = table.offsetWidth + 'px';
rowGrip.dataset.rowIndex = r;
wrapper.appendChild(rowGrip);
(function(rowIdx, gripEl) {
var startY, startH;
gripEl.addEventListener('mousedown', function(e) {
e.preventDefault();
startY = e.clientY;
startH = rows[rowIdx].offsetHeight;
document.body.style.cursor = 'row-resize';
document.body.style.userSelect = 'none';
function onMove(ev) {
var diff = ev.clientY - startY;
rows[rowIdx].style.height = Math.max(20, startH + diff) + 'px';
}
function onUp() {
document.removeEventListener('mousemove', onMove);
document.removeEventListener('mouseup', onUp);
document.body.style.cursor = '';
document.body.style.userSelect = '';
createGrips();
}
document.addEventListener('mousemove', onMove);
document.addEventListener('mouseup', onUp);
});
})(r, rowGrip);
}
}
// 초기 그립 생성 (약간의 딜레이 후 — 렌더링 완료 대기)
setTimeout(createGrips, 100);
});
})();
});
</script>