PENNY PAGE
CASE 58민건설2026.04

현장 사진으로
증명한 공법

구경 Ø1m~Ø10m 현장타설말뚝을 육상·수상·해상에서 시공하는 PRCD·RCD 공법 전문 건설사의 회사 홈페이지입니다.

업종
건설업 · 현장타설말뚝(PRCD·RCD)
형태
회사 홈페이지 (멀티페이지)
구성
회사소개 · 공법소개 · 기술 · 장비
시공실적 · 현장 갤러리 · 문의
기술 스택
Cloudflare Pages · PhotoSwipe 갤러리 · SVG 로고 재구성 · 반응형 HTML/CSS
호스팅
Cloudflare Pages
민건설 데스크탑·모바일 화면
PENNYPAGE WORKS · CASE 58

01과제

무엇을 받았고, 무엇을 했나

말뚝 공사는 발주처가 공법과 시공 실적을 보고 업체를 고릅니다. 그래서 대표님이 보내주신 카탈로그·시공계획서(PPTX·HWP)에서 공법 설명과 현장 사진을 추출해 공법소개·기술·장비·시공실적 페이지로 정리했습니다.

인트로 애니메이션 뒤로 회사소개·공법소개·기술·장비·시공실적·문의 6개 페이지가 이어지고, 현장 사진은 해상·육상·장비 등 8개 분류 필터와 PhotoSwipe 확대 보기로 볼 수 있습니다. 문서에만 남아 있던 회사 로고는 SVG로 다시 그려 헤더와 파비콘에 적용했습니다.

핵심 — 공법과 실적이 곧 영업발주처가 확인하는 공법 설명과 시공 실적을 문서에서 꺼내 페이지로 옮기고, 현장 사진으로 뒷받침했습니다.

02화면

히어로가 아니라 실제로 일하는 구간

주요 사업 — PRCD·RCD·해상·특수 기초
01주요 사업 — PRCD·RCD·해상·특수 기초
현장 기록 갤러리
02현장 기록 갤러리
주요 시공 실적
03주요 시공 실적
기술력 지표 · 시공 문의
04기술력 지표 · 시공 문의

03구성

이 사이트에 들어간 것

  • 01
    인트로 애니메이션첫 진입 시 브랜드 연출
  • 02
    히어로 슬라이더현장 실루엣 배경
  • 03
    PRCD·RCD 공법소개카탈로그·시공계획서에서 추출
  • 04
    기술·장비 페이지PPTX·HWP 자료 정리
  • 05
    시공실적발주처·기간·구경 카드
  • 06
    현장 갤러리 분류 필터해상·육상·장비 등 8개 분류
  • 07
    PhotoSwipe 라이트박스현장 사진 확대 보기
  • 08
    SVG 로고 재구성헤더·파비콘 적용
민건설 모바일 전체 화면

모바일 · 스크롤해서 보기

제작 당시 화면을 보존했습니다.

미러본은 납품 시점 화면을 그대로 보존한 사본입니다.