GLOSSARY 글로서리 K뷰티 색조 쇼핑몰 디자인
분야: 디자인 · 퍼블리싱 / 웹 / 쇼핑몰, 카페24, 반응형 참여 기간: 2026.10 관련 기술: 카페24 스마트디자인, HTML5, CSS3, JavaScript, 반응형 웹 [프로젝트 개요] 립 글로스, 틴트, 쿠션, 하이라이터처럼 광택이 특징인 K-뷰티 제품을 파는 편집몰입니다. 은색 크롬 질감과 연라벤더를 써서 반짝이는 패키지가 매대에 줄지어 있는 인상을 냈습니다. 첫 화면의 신제품과 특가 카드 아래로 실시간 랭킹, 광 단계로 고르기, 세트 빌더, 이번 주 메이크업, 발색 리뷰가 이어집니다. 색조와 기초 제품 16종으로 구성했습니다. [주요 기능] 1. 크롬 질감 - 은색 금속 그라데이션을 헤더 아래 띠, 첫 화면 글 면, 카테고리 링, 광 단계 표시에만 썼습니다. 2. 광 단계로 고르기 - 매트, 새틴, 글로시, 글래스 네 단계를 광 정도를 그린 원으로 고르면 그 마무리의 제품 네 개가 나옵니다. 모든 카드에도 광 단계 칩을 붙였습니다. 3. 실시간 랭킹 5열 - 순위 숫자와 오르내림 칸을 붙이고 1~3위는 라벤더로 표시했습니다. 4. 3개 고르면 25% 세트 빌더 - 미니 여섯 종에서 세 개를 고르면 오른쪽 내 세트 칸과 할인, 결제 금액이 바로 계산됩니다. 5. 광택 컬러칩 - 칩마다 하이라이트를 얹어 글로스처럼 보이게 했고 카드와 첫 화면, 리뷰 셰이드에 같은 칩을 씁니다. [디자인] - 은색 크롬 그라데이션과 연라벤더 면, 진한 라벤더 할인율로 반짝이는 매대 인상을 냈습니다. - 한글과 가격은 Pretendard, 워드마크와 특가 시간 숫자는 Unbounded입니다. - 상품 카드는 3:4 비율에 모서리를 크게 둥글렸습니다. [범위] - 메인 페이지 PC·모바일 반응형 디자인과 퍼블리싱 - 상품 카드는 반복 구조로 짜서 카페24 메인 진열 모듈로 옮길 수 있는 구조



이런 프로젝트를 준비하고 계신가요?
이 사례로 상담하기