상품 조회 25% 향상시킨 온스타일 상세페이지 개편 비하인드

문제 상황

• 상품 상세페이지가 주문, 배송, 방송 정보, 프로모션이 결합된 복잡한 구조로 정보 과부하와 동선 연결 부재가 발생
• 일부 패션 상품군의 별도 템플릿 운영과 레거시 프론트 구조로 인해 개발 생산성과 확장성이 저하
• 혜택, 쿠폰, 배송 정보가 분산되어 고객 인지와 액션 유도가 약한 상태

해결 방법

• 상품의 핵심 구매요소를 온스타일만의 차별화 정보와 혜택으로 재정의하고 상·하단 구조로 정보 위계 재배치
• 추천 상품, 방송 게이트, 브랜드관, 프로모션, 검색어 노출로 추가 탐색 동선 설계
• 백엔드를 포함한 컴포넌트 기반 구조로 단일화하고, backbone.js를 vue.js로 전환해 로직 정리와 모듈화를 진행

성능/운영 포인트

• 로컬 빌드 시간을 10초대로 단축해 개발 생산성 개선
• 상품 페이지 내 추천 클릭 18% 증가, 전체 클릭 35% 증가, 고객당 조회 페이지 수 25% 증가
• 주문 고객 비중 5% 증가와 함께 내부 운영자가 정보 확인하기 쉬운 구조로 개선