PORTFOLIO PORTFOLIO

기업

한국조선소

Launch
January, 2026
Client
한국조선소
Role
UI/UX , Publishing, Programing

1. 시각적 정체성 (Visual Identity)

색상 체계 (Color System)

주조색:


해양 블루(#003366) - 안정성, 신뢰성, 전문성 상징


선박용 레드(#CC3333) - 주의 표시, 핵심 요소 강조


산업 그레이(#4A4A4A) - 기술력과 견고함 표현


보조색상:


하얀색(#FFFFFF) - 청결함, 정확성


금속 실버(#C0C0C0) - 첨단 기술 연상


딥 네이비(#000080) - 심해/깊이의 이미지


타이포그래피 (Typography)

영문 폰트:


헤드라인: Montserrat/Bebas Neue - 강력하고 현대적인 느낌


본문: Roboto/Open Sans - 가독성 우수


한글 폰트:


헤드라인: Noto Sans KR Bold - 명확한 제시


본문: Noto Sans KR Regular - 장문 가독성


기술 용어: 나눔바른고딕 - 정확한 정보 전달


2. 레이아웃 구조 (Layout Architecture)

정보구조 (Information Architecture)

계층적 구조 (Hierarchical Structure)


메인 네비게이션: 회사소개 > 사업영역 > 기술력 > 프로젝트 > 투자정보 > 채용 > 고객지원


카드형 그리드 시스템 적용


콘텐츠 우선순위 (Content Prioritization)


F패턴에 따른 시각적 흐름 구성


히어로 섹션(주요 성과/신기술 강조)


매거진형 콘텐츠 배치


사용자 경로 (User Journey)

B2B 고객: 기술력 > 프로젝트 실적 > 문의하기 경로 최적화


투자자: 재무정보 > 경영현황 > IR자료 직관적 배치


구직자: 채용공고 > 복리후생 > 회사문화 강조


3. 산업 특화 콘텐츠 전략 (Industry-Specific Content Strategy)

전문성 구축 요소:

기술 어휘 활용:


선박 분야: 선형계수(Cb), 흘수(Draft), 데드웨이트(DWT)


공학 용어: 유한요소해석(FEA), 전산유체역학(CFD)


인증 표기: DNV-GL, ABS, KR(한국선급) 인증 강조


시각적 요소:


3D 모델링/애니메이션으로 조선 공정 시각화


인포그래픽으로 기술 스펙 직관적 표현


VR/AR을 통한 가상 선박 투어


신뢰성 구축:


프로젝트 타임라인(납품 이력)


테스트 베드 시설 소개


품질 관리 시스템 인증 표시


4. 반응형 디자인 (Responsive Web Design)

브레이크포인트 설정:

Desktop (1200px 이상): 풀스크린 메가메뉴


Tablet (768px~1199px): 햄버거 메뉴 + 콘텐츠 재배치


Mobile (767px 이하): 터치 최적화 인터페이스


5. 브랜드 톤앤매너 (Brand Tone & Manner)

커뮤니케이션 전략:

공식적이면서 접근 가능한 전문가적 어조


데이터 기반의 객관적 표현


미래 지향적이면서 전통의 기술력 강조


6. 접근성 고려사항 (Accessibility)

WCAG 2.1 AA 기준 준수


키보드 네비게이션 최적화


색각 이상자 고려한 색상 대비(4.5:1 이상)


스크린 리더 호환성 확보


7. 성능 최적화

조선소 특성상 해외 접속 고려한 CDN 활용


대용량 이미지/동영상 최적화(Lazy Loading)


기술 문서 다운로드 속도 개선


한국 조선소 홈페이지는 기술 신뢰성과 글로벌 경쟁력을 동시에 표현해야 하며, 복잡한 엔지니어링 정보를 직관적으로 전달하는 것이 핵심 성공 요소입니다. 

산업의 특수성을 고려한 정보 설계와 엔지니어링 감각이 반영된 디자인이 필요합니다.

한국조선소 > PORTFOLIO - 광주홈페이지제작-알렉스디자인한국조선소 > PORTFOLIO - 광주홈페이지제작-알렉스디자인
View