📌 84A - 빈티지 의류 숍 웹사이트
🔹 프로젝트 개요
- 작업 기간: 약 4주
- 작업 범위: 정보 구조 설계 및 아트디렉션, 카페24 스마트디자인 스킨 프론트엔드 전량 커스텀(메인 · ITEMS 목록 · 상품상세 · NOTES · ABOUT · SHOPPING GUIDE), 회원·주문 화면 정리, 상품 분류·게시판 세팅, 초기 상품 등록, 반응형 QA, 오픈 세팅(대표 도메인 · robots · 사이트맵 · 검색엔진 소유확인)
- 사용 도구: 카페24 스마트디자인(독자 템플릿 문법), HTML5, CSS3, JavaScript, 디자인 FTP, Git(스킨 형상관리)
🔹 프로젝트 목적
84A는 세컨핸즈 의류를 한 점씩 골라 파는 큐레이션 숍입니다. 같은 옷이 두 번 들어오지 않는 판매 형태라, 일반 쇼핑몰처럼 썸네일만 깔아두면 물건의 성격이 전혀 전달되지 않습니다. 그래서 목록에서부터 소재·상태·치수 같은 정보가 상시 드러나도록 진열 방식을 바꾸고, 물건을 고른 이유를 적는 NOTES 저널을 따로 두었습니다. 카페24 솔루션은 결제·주문·회원 기능만 그대로 쓰고, 보이는 화면은 전부 직접 다시 짰습니다.
🔹 핵심 기술 및 구현 기능 (Key Technical Features)
- 빌더 템플릿이 아니라 스킨을 직접 고쳤다
- 카페24 스마트디자인은 자체 템플릿 문법이라 로컬에서 렌더링되지 않습니다. 기본 스킨 561개 파일을 FTP로 내려받아 형상관리 기준점을 만든 뒤, 실서버에 올려 확인하는 루프로 작업했습니다.
- 메인 · 상품 목록 · 상품 상세 · 게시판 · ABOUT · 쇼핑가이드까지 화면 단위로 교체했고, 상품 타일·목록 진열 방식도 새로 짰습니다.
- 정보가 먼저 보이는 상품 목록
- 썸네일 위에 마우스를 올려야 보이는 구조를 버리고, 품명·소재·가격이 항상 노출되는 진열로 바꿨습니다. 한 점씩 다른 물건을 파는 숍에서는 이 편이 탐색이 빠릅니다.
- NOTES — 고객이 직접 쓰는 저널
- 카페24 게시판을 저널 형식으로 커스텀하고 말머리를 나눠, 운영자가 관리자에서 글만 올리면 사이트 톤에 맞게 표시됩니다. 작성 방법 안내서를 따로 만들어 함께 넘겼습니다.
- 회원·주문 화면까지 톤 통일
- 로그인 · 회원가입 · 아이디/비밀번호 찾기 · 마이페이지 · 회원정보수정까지 기본 스킨 상태로 남기지 않고 전부 정리했습니다. 커머스는 이 화면들에서 인상이 깨집니다.
- 오픈 세팅
- 상품 분류 체계와 게시판, 배송 정책, 쇼핑몰 기본정보를 세팅하고, 대표 도메인 연결 · robots 원복 · 사이트맵 정리 · 검색엔진 소유확인까지 마친 뒤 오픈했습니다.
🔹 디자인 포인트
- 정물처럼 두는 화면: 옷을 광고하듯 키우지 않고, 여백을 넉넉히 둬 한 점씩 놓인 물건으로 읽히게 했습니다.
- 활자와 선만으로: 장식 요소 없이 활자 크기와 얇은 선으로 위계를 만들었습니다. 세컨핸즈 큐레이션이라는 성격상 화려한 연출이 오히려 신뢰를 깎습니다.
- 목록 → 상세 → NOTES 한 흐름: 물건을 보고, 상태를 확인하고, 고른 이유를 읽는 순서가 끊기지 않게 동선을 짰습니다.