프로젝트 배경
1) 목표 - 기존 기업 자료를 잃지 않으면서 산업 현장의 정밀함과 에너지 흐름을 더 선명하게 전달 - 긴 원페이지를 단순 나열하지 않고 장면 기반 정보 구조로 재편 2) 주안점 - 실제 공개 사진과 제품 화면만 사용하고 가짜 제품 UI는 만들지 않음 - 모바일·키보드·모션 감소 환경에서도 전체 정보와 CTA 유지 - 정방향과 역방향 스크롤에서 동일한 상태가 복원되는 결정적 타임라인
프로젝트 성과
5개 뷰포트 반응형 QA 통과
1440·1280·1024·768·390px에서 주요 장면, 카드 레일, 수평 오버플로와 텍스트 충돌을 검증했습니다.
핵심 기능
진행 단계
설계·구현·접근성 QA
2026.07
정보 구조와 타임라인 설계 후 반응형 구현, 정·역방향 상호작용 및 모션 감소 모드를 검증했습니다.
프로젝트 상세
공개된 공조냉동 자동제어 기업 사이트의 텍스트·연혁·사진·제품 화면을 보존하면서, Vanilla HTML·CSS·JavaScript와 Vite로 구현한 비공식 자체 리디자인 프로토타입입니다. 하나의 sticky stage에서 장면이 전개되도록 결정적 스크롤 타임라인을 설계했고, rAF 렌더링·포인터 패럴랙스·키보드와 드래그가 가능한 카드 레일을 구현했습니다. prefers-reduced-motion·reduc






