접근 A — DX 목표

"""3가지 접근법 비교 — 콘텐츠 2: DX 시행 목표 및 기대 효과 이전 콘텐츠(포함 관계)와 성격이 다름: - 목표 3가지 (안전/품질, 생산성, 소통/신뢰) - 프로세스 변화 4가지 (생산방식, 인지검토, 협업구조, 검증대응) - 주체별 기대효과 (DxEffect 컴포넌트 — 텍스트로 대체) - 핵심 결론 1줄 """ from __future__ import annotations import asyncio, json, sys, base64 from pathlib import Path ROOT = Path(__file__).parent.parent sys.path.insert(0, str(ROOT)) DESIGN_TOKENS_CSS = """ :root { --color-primary: #1e293b; --color-accent: #2563eb; --color-accent-light: #93c5fd; --color-bg: #ffffff; --color-bg-subtle: #f8fafc; --color-bg-dark: #1e293b; --color-bg-dark-deep: #0f172a; --color-border: #e2e8f0; --color-danger: #dc2626; --color-success: #16a34a; --color-warning: #f59e0b; --color-text: #1e293b; --color-text-secondary: #64748b; --color-text-light: #94a3b8; --color-text-on-dark: #e2e8f0; --color-text-on-accent: #ffffff; --font-title: 28px; --font-section: 14px; --font-body: 13px; --font-small: 11px; --font-caption: 10px; --weight-normal: 400; --weight-medium: 500; --weight-bold: 700; --weight-black: 900; --spacing-page: 36px 40px 24px; --spacing-section: 16px; --spacing-block: 12px; --spacing-inner: 10px; --spacing-small: 6px; --radius: 8px; --radius-small: 6px; --line-height: 1.6; } """ SLIDE_BASE_CSS = """ @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css'); * { margin: 0; padding: 0; box-sizing: border-box; } .slide { width: 1280px; height: 720px; overflow: hidden; background: var(--color-bg); font-family: 'Pretendard Variable', sans-serif; color: var(--color-text); font-size: var(--font-body); line-height: var(--line-height); word-break: keep-all; display: grid; grid-template-areas: 'header header' 'body sidebar' 'footer footer'; grid-template-columns: 65fr 35fr; grid-template-rows: auto 1fr auto; gap: var(--spacing-section); padding: var(--spacing-page); } .header { grid-area: header; font-size: var(--font-title); font-weight: var(--weight-black); color: var(--color-primary); border-bottom: 3px solid var(--color-accent); padding-bottom: 8px; } .body { grid-area: body; display: flex; flex-direction: column; gap: var(--spacing-block); overflow: hidden; } .sidebar { grid-area: sidebar; display: flex; flex-direction: column; gap: var(--spacing-block); border-left: 1px solid var(--color-border); padding-left: 20px; overflow: hidden; } .footer { grid-area: footer; background: linear-gradient(135deg, #006aff, #00aaff); border-radius: var(--radius); padding: 14px 30px; text-align: center; color: var(--color-text-on-accent); } .footer-text { font-size: 15px; font-weight: var(--weight-bold); } .footer-sub { font-size: var(--font-small); opacity: 0.85; margin-top: 2px; } """ # ═══════════════════════════════════════ # 접근 A: Few-Shot 직접 생성 # ═══════════════════════════════════════ APPROACH_A = f""" 접근 A — DX 목표

DX를 통한 궁극적 목표

🛡️

안전과 품질

설계-시공-운영 전 과정에서 디지털로 검증하여 안전성 확보. 하자 최소화로 고품질 성과물 제공

⚡

생산성 향상

Analogue → Digital 프로세스 전환. 비용 절감, 기간 단축, 인력투입 최소화로 부가가치 제고

🤝

소통과 신뢰

협업 강화로 의사소통 효율 증진. 3D 모델·데이터 기반 검증으로 오류 최소화 및 Claim 예방

업무 수행 과정(Process)의 변화

→

생산 방식

수작업 의존의 반복 업무

SW를 활용한 체계화된 방식으로 전환

→

인지·검토

2D 도면 해석 중심

3D 모델 기반의 직관적 인지·검토 체계

→

협업 구조

개별 문서 중심 협업

데이터 통합 기반의 정보 공유·관리 환경

→

검증·대응

사후 대응 중심의 문제 처리

사전 검증 중심의 예방적 업무 방식

주체	기대효과
발주처	품질 향상, 비용·기간 절감, 투명한 관리
설계사	오류 감소, 설계 품질 제고, 재작업 최소화
시공사	공정 최적화, 안전 강화, 현장 생산성 향상
감리·CM	실시간 모니터링, 데이터 기반 의사결정
유지관리	디지털 트윈 기반 예방 정비, 자산 관리 효율화

""" # ═══════════════════════════════════════ # 접근 B: 프리미티브 조합 # ═══════════════════════════════════════ APPROACH_B = f""" 접근 B — DX 목표

DX를 통한 궁극적 목표

🛡️

안전과 품질 디지털 검증으로 안전성 확보, 하자 최소화로 고품질 성과물

⚡

생산성 향상 Digital 프로세스 전환, 비용 절감·기간 단축·부가가치 제고

🤝

소통과 신뢰 협업 강화, 3D·데이터 기반 검증으로 오류 최소화·Claim 예방

업무 수행 과정(Process)의 변화

생산 방식: 수작업 의존 반복 업무 → SW를 활용한 체계화된 방식으로 전환

인지·검토: 2D 도면 해석 중심 → 3D 모델 기반의 직관적 인지·검토 체계로 전환

협업 구조: 개별 문서 중심 → 데이터 통합 기반의 정보 공유·관리 협업 환경으로 전환

검증·대응: 사후 대응 중심 → 사전 검증 중심의 예방적 업무 방식으로 전환

주체	기대효과
발주처	품질 향상, 비용·기간 절감, 투명한 관리
설계사	오류 감소, 설계 품질 제고, 재작업 최소화
시공사	공정 최적화, 안전 강화, 현장 생산성 향상
감리·CM	실시간 모니터링, 데이터 기반 의사결정
유지관리	디지털 트윈 기반 예방 정비, 자산 관리 효율화

""" # ═══════════════════════════════════════ # 접근 C: 참조 기반 생성 # ideal_v2의 디자인 패턴(다크배경+포함박스+사이드바 정의) 참조하되 # 이 콘텐츠에 맞게 구조 변형 # ═══════════════════════════════════════ APPROACH_C = f""" 접근 C — DX 목표

DX를 통한 궁극적 목표

🛡️

안전과 품질

디지털 검증으로 안전성 확보
하자 최소화, 고품질 성과물

⚡

생산성 향상

Digital 프로세스 전환
비용 절감, 기간 단축, 부가가치 제고

🤝

소통과 신뢰

협업 강화, 의사소통 효율
데이터 검증으로 Claim 예방

DX 기반 Process 혁신

업무 수행 과정의 변화

Analogue 기반 → Digital 기반 프로세스 전환

생산 방식

수작업 의존의 반복 업무

SW를 활용한 체계화된 방식

인지·검토

2D 도면 해석 중심

3D 모델 기반의 직관적 인지·검토

협업 구조

개별 문서 중심 협업

데이터 통합 기반 정보 공유·관리

검증·대응

사후 대응 중심 문제 처리

사전 검증 중심 예방적 업무 방식

발주처 품질 향상, 비용·기간 절감, 투명한 관리

설계사 오류 감소, 설계 품질 제고, 재작업 최소화

시공사 공정 최적화, 안전 강화, 현장 생산성 향상

감리·CM 실시간 모니터링, 데이터 기반 의사결정

유지관리 디지털 트윈 기반 예방 정비, 자산 관리 효율화

""" async def main(): from src.slide_measurer import measure_rendered_heights, capture_slide_screenshot out_dir = ROOT / "data" / "runs" / "3approaches_dx2" out_dir.mkdir(parents=True, exist_ok=True) for name, html in [("A_fewshot", APPROACH_A), ("B_primitives", APPROACH_B), ("C_reference", APPROACH_C)]: print(f"\n=== 접근 {name} ===") m = await asyncio.to_thread(measure_rendered_heights, html) s = await asyncio.to_thread(capture_slide_screenshot, html) (out_dir / f"{name}.html").write_text(html, encoding="utf-8") if s: (out_dir / f"{name}.png").write_bytes(base64.b64decode(s)) slide = m.get("slide", {}) print(f" slide: {slide.get('scrollHeight', 0)}px / 720px {'✅' if not slide.get('overflowed') else '❌'}") print(f"\n결과물: {out_dir}") if __name__ == "__main__": import logging logging.basicConfig(level=logging.INFO, format="%(asctime)s %(levelname)s %(message)s", datefmt="%H:%M:%S") logging.getLogger("selenium").setLevel(logging.WARNING) logging.getLogger("urllib3").setLevel(logging.WARNING) asyncio.run(main())