📌 Saole(사오레) - 미니멀 캐주얼 여성 의류 쇼핑몰 자사몰 구축
🔹 프로젝트 개요
- 작업 기간: 2026.02
- 작업 범위: 아임웹(I'mweb) 기반 자사몰(D2C) 웹 디자인 및 구축, 반응형 UI/UX 최적화, 상품 카테고리 및 프로모션 세팅, 커머스 기능 연동
- 사용 도구: I'mweb (아임웹), HTML/CSS (커스텀 스타일링), Figma
🔹 프로젝트 목적
'Saole(사오레)'는 힙하고 트렌디한 무드를 전개하는 캐주얼 여성 의류 브랜드입니다. 본 프로젝트는 브랜드 특유의 모던하고 시크한 감성을 온라인 스토어에 시각적으로 녹여내는 동시에, '실제 판매 전환율'과 '고객 탐색 편의성'을 극대화하는 직관적인 커머스 환경을 구축하는 데 목적을 두었습니다. 또한 브랜드 초기 런칭 단계임을 고려하여, 클라이언트가 향후 복잡한 개발 지식 없이도 상품과 프로모션을 원활하게 관리할 수 있도록 운영 효율성이 높은 최적의 시스템 환경을 제공하고자 했습니다.
🔹 핵심 기술 및 구현 기능 (Key Technical Features)
- E-commerce UI/UX Optimization (커머스 동선 최적화):
'NEW ARRIVALS', 'BEST ITEMS', 'TIME SALE' 등 고객의 구매를 직접적으로 유도하는 핵심 기획전 섹션을 메인 페이지에 전략적으로 배치했습니다. 유입된 고객이 이탈 없이 자연스럽게 상품을 탐색하고 장바구니 및 결제로 이어지도록 구매 여정(User Journey)을 설계했습니다.
- Fully Responsive Web Design (완벽한 반응형 웹):
모바일 쇼핑 비율이 압도적으로 높은 패션 이커머스 시장의 특성을 반영하여, PC, 태블릿, 모바일 등 모든 디바이스 환경에서 이미지 레이아웃이나 텍스트가 깨짐 없이 최적의 비율로 렌더링되도록 반응형 분기점을 정교하게 맞췄습니다.
- Custom Styling & Layout (브랜드 맞춤형 커스텀 스타일링):
아임웹의 기본 제공 템플릿을 넘어, 사오레만의 미니멀한 감성을 살리기 위해 폰트 웹폰트 적용, 세밀한 여백(Margin/Padding) 조정, 버튼 및 호버(Hover) 액션 등에 커스텀 CSS를 반영하여 기성 솔루션 특유의 획일화된 느낌을 탈피했습니다.
- Efficient Management System (효율적인 백오피스 환경 세팅):
클라이언트가 신상품 업데이트, 재고 및 품절 관리, 타임 세일 타이머 설정 등을 독립적이고 직관적으로 수행할 수 있도록 상품 카테고리 트리와 게시판(Notice, Q&A, Review) 모듈을 체계적으로 구조화하여 인수인계했습니다.
🔹 디자인 포인트
- Trendy & Minimalist Aesthetics: 불필요한 그래픽 요소를 과감히 배제하고, 상품의 핏(Fit)과 소재 디테일이 온전히 돋보일 수 있도록 무채색 계열의 배경과 심플한 타이포그래피를 활용한 미니멀리즘 디자인을 채택했습니다.
- Intuitive Categorization: Top, Bottom, Outer, Dress&Setup, ACC 등 타겟 고객층에게 가장 익숙하고 직관적인 GNB(Global Navigation Bar) 라우팅을 적용하여 원하는 상품군으로 즉시 이동할 수 있게 구성했습니다.
- Visual Hierarchy for Conversion: 'TIME SALE' 배너, 할인율, 가격 정보의 시각적 위계를 명확히 하여 프로모션 상품에 대한 주목도를 높이고, 소비자의 구매 결정에 긴장감을 부여하여 전환율을 높이는 시각적 포인트를 주었습니다.
🔹 담당 역할
- 아임웹(I'mweb) 플랫폼 기반 웹사이트 전체 기획 및 레이아웃 디자인 구축
- PC/Mobile 반응형 UI 프론트엔드 최적화 및 커스텀 스타일링(CSS) 작업
- 커머스 주요 카테고리 구성 및 기본 결제/배송 시스템 연동 세팅
🔹 주요 화면