Kim Jieun.
전체 프로젝트

제조업 (유압기기)

남광유압

유압 실린더, 유압 유니트 등 산업용 유압기기를 개발·생산하는 제조업체의 기업 홈페이지입니다. 회사소개, 제품소개, 제품문의, 기술자료실로 구성되었으며, 관리자가 직접 콘텐츠를 운영할 수 있는 관리자 시스템까지 포함되어 있습니다.

남광유압 PC 화면
남광유압 모바일 화면

업종

제조업 (유압기기)

기간

6주

기여도

100%

역할

기획ㆍ디자인ㆍ개발

사이트 방문하기

주요 작업

제품 카테고리(유압 실린더/유압 유니트/기타 유압 기기)와 기술자료실을 포함한 정보 구조(IA)를 설계하고, 페이지별 UI 디자인과 반응형 퍼블리싱·개발을 진행했습니다. 콘텐츠 수정 때마다 개발자 개입이 필요했던 기존 방식의 한계를 고려해 Supabase 기반 DB를 설계하고 별도의 관리자 페이지를 구축해, 담당자가 회사소식 등록·인증서 업로드·제품문의 내역 확인 및 응대를 직접 처리할 수 있도록 개선했습니다.

성과 및 개선

기존 클라이언트 사이드 렌더링(CSR) 구조에서는 제품, 뉴스, 인증서 목록과 같은 핵심 콘텐츠를 불러올 때 클라이언트 측 자바스크립트 실행 및 API 통신 대기 시간으로 인해 LCP가 8.8초까지 지연되는 부분을 확인했습니다. 이를 해결하기 위해 데이터 기반 페이지의 렌더링 방식을 서버 사이드 렌더링(SSR)으로 전환했습니다. 서버에서 초기 HTML을 미리 완성하여 전달함으로써 클라이언트의 렌더링 부하를 줄였고, 결과적으로 최초 콘텐츠 표시 속도(LCP)를 2.7초로 69% 단축하여 초기 사용자 경험을 대폭 개선했습니다.

회고

개발자 없이도 지속 관리할 수 있는 구조를 구축하며, 클라이언트 관점에서 "만들고 끝나는 사이트"가 아닌 "직접 운영 가능한 사이트"를 설계하는 가치를 배웠습니다. 또한 SSR 전환을 통한 초기 사용자 경험 개선까지 더하여, 클라이언트의 운영 편의성과 실제 방문자의 UX를 모두 충족하는 종합적인 웹 설계의 중요성을 깨달았습니다.