SKIN · 패션 의류 / 편집숍
MARGIN
선을 긋지 않고 여백으로 나눕니다.
사진이 좋은 의류 브랜드를 위한 흰색 · 검정 스킨
01 · MARGIN
상자도 구분선도 없습니다
다른 스킨은 구역마다 테두리를 치고 제목을 키웁니다. 이 스킨은 둘 다 하지 않습니다.
구역은 비워 둔 공간이 나누고,
화면에서 가장 큰 글자가 20px입니다. 위계를 글자 크기가 아니라 여백으로 만듭니다.
사진 옆에 글이 서는 분할 밴드가 메인을 이끕니다.
첫 화면 · 카테고리 3칸 · 에디토리얼 장면 · 분할 밴드 2개 · 상품 진열 · 글만 있는 호흡 구간 · 매장 한 장. 밴드마다 문구 자리가 있습니다.
02 · BAG
담을 때 페이지가 바뀌지 않습니다
담기를 누르면 장바구니가 오른쪽에서 서랍으로 열립니다.
수량 변경 · 삭제 · 주문까지 그 안에서 되고, 닫으면 보던 상품 그대로입니다.
헤더의 Bag 을 눌러도 같은 서랍이 열려 장바구니 페이지에 들어갈 일이 없습니다.
카페24 장바구니 기능을 그대로 씁니다. 재고 · 옵션 · 배송비 규칙은 관리자 설정 그대로 따라갑니다.
03 · MOBILE MENU
하위 분류가 옆으로 넘어갑니다
보통의 모바일 메뉴는 분류를 누르면 아래로 펼쳐져 목록이 길어집니다.
이 스킨은 화면이 옆으로 넘어갑니다.
햄버거는 X로 바뀌고, 3단 분류까지 같은 방식이라 어느 깊이에서도 한 화면에 들어옵니다.
메뉴가 열려 있는 동안 뒤 화면은 움직이지 않습니다. 커뮤니티 메뉴는 게시판 목록과 연동되어 관리자에서 게시판을 추가·삭제하면 함께 바뀝니다.
04 · DETAIL
항목 이름 없이 값만 보여줍니다
배송방법 : 택배 가 아니라 그냥 택배.
배송비 · 옵션 · 수량 어디에도 라벨이 없습니다. 라벨과 값이 같은 말을 하는 자리에서는 값만 남깁니다.
사진은 세로로 이어지고 오른쪽 정보는 따라 붙으며, 상세설명은 접혀 있습니다.
관리자가 직접 추가한 항목은 라벨이 남습니다. 대표이미지가 추가이미지와 겹치면 자동으로 한 번만 보여줍니다.
05 · LIST
분류마다 두세 문장이 먼저 섭니다
목록 위에 그 분류의 설명이 붙습니다. 카페24 관리자의 분류 설명은 100바이트(한글 33자)까지인데,
이 스킨은 그 제한을 받지 않습니다.
배지와 아이콘은 걷어냈고, 사진과 두 줄의 글자만 남았습니다. PC 4열 · 태블릿 3열 · 모바일 2열.
목록에는 담기 버튼이 없습니다. 옵션 선택 창이 끼어들어 흐름을 끊지 않도록 담기는 상세에서만 합니다.
06 · EDITORIAL
분류 하나가 화보가 됩니다
상품분류 번호 하나를 정해 두면 그 분류가 화보 페이지로 나옵니다. 누르면 크게 열리고 좌우로 넘겨 봅니다.
헤더 · 푸터 · 모바일 메뉴의 Editorial 링크가 그 번호 하나를 따라갑니다. 사진만 올리면 됩니다.
화보용 분류는 검색 결과에서 자동으로 빠집니다.
SCREENS
화면 구성
메인
화면을 채우는 첫 장면 · 카테고리 3칸 · 전폭 장면 · 사진 옆에 글이 서는 분할 밴드 2개 · 상품 진열 · 글만 있는 호흡 구간 · 매장 한 장
목록
2:3 세로 사진 · PC 4열 / 태블릿 3열 / 모바일 2열 · 분류 설명문 · 마우스를 올리면 두 번째 사진으로 교차
상세
세로로 이어지는 사진 · 따라오는 구매 영역 · 라벨 없는 배송 안내 · 접히는 상세설명 · 추가구성상품 슬라이드 · Review / Q&A
장바구니
오른쪽 서랍. 담기 · 수량 · 삭제 · 주문을 페이지 이동 없이. 비었을 때는 Continue shopping 으로 돌아가는 문
마이페이지
상자와 카드를 걷어낸 한 줄 인덱스. 적립금 · 주문현황 · 메뉴가 각각 가로 한 줄
소개 팝업
왼쪽 세로 탭으로 넘기는 메인 팝업. 운영 때는 탭을 상품 · 이벤트 · 공지로 바꿔 씁니다
그 외
브랜드 · 매장 · 로그인(비회원 주문조회) · 회원가입 · 게시판 · 주문 화면 100여 개 전부 같은 톤으로. 소비자용 버튼은 Bag · Order · Total · Write 로 통일
SETUP
설정 파일 몇 개만 열면 됩니다
HTML · CSS 를 몰라도 됩니다. 설정 파일에 분류 번호와 문구만 적으면
메인 · 헤더 · 목록 · 에디토리얼이 함께 따라옵니다. 사진은 정해진 폴더에 같은 이름으로 덮어쓰면 끝입니다.
설치 안내와 설정 매뉴얼을 함께 드립니다.
TONE
흰색 · 검정 · 회색만 씁니다
사진이 먼저 읽히도록 화면의 나머지는 전부 무채색이고, 글자는 작게 눌러 두었습니다.
사진을 크게 쓰는 스킨이라 사진의 완성도가 화면의 완성도를 그대로 결정합니다.
강조색으로 할인율을 크게 띄우거나 상품 수천 개를 빠르게 훑게 하는 운영과는 맞지 않습니다 — 그런 몰에는 다른 스킨이 낫습니다.
