OVERVIEW

UI/UX 디자인은 브랜딩이다

프리미엄 전략으로 파스텔몰의 장점을 부각하고 구매 고객에게는 만족감을 제공하다.

파스텔몰은 분명한 장점과 타깃층이 있음에도 사이트에서는 그 정체성을 찾기 어려웠습니다.
리플렉션은 이번 리뉴얼이 단순히 사용자 편의성을 높이는 것이 아니라 브랜딩의 역할도 해야 한다고 봤습니다.

먼저 파스텔몰의 고객층과 그들의 선호도를 파악했고,
고급 키즈 브랜드들이 입점한 파스텔몰의 장점이 잘 드러나도록 고급스러운 디자인을 추구했습니다.
하지만 사용자 편의성을 해치는 ‘과유불급’이 되지 않도록 했습니다.

MISSION & GOAL

브랜드 또 브랜드

다양한 고급 키즈 브랜드들이 입점한 국내 유일 무이한 전문 편집숍이라는 장점을 살렸습니다.
입점한 브랜드들이 ‘파스텔몰’이라는 정체성에 그 색을 잃기보다는 자신들의 색을 다 보여줄 수 있는 ‘파스텔몰’을 목표로 사용자의 개념을 소비자뿐만 아니라 각 브랜드로까지 확대했습니다.

파스텔몰 안의 모든 브랜드를 살려내는 파스텔몰 브랜딩 전략은 리플렉션이 상정한 3 고객(트라이본즈/입점 브랜드/소비자) 모두의 만족을 목표로 했습니다.

DAKS LITTLE

HAZZYS KIDS

PETER JENSEN

UI/UX Concept

Form Follows Function

하나의 UI 안에 다양한 섹션의 기능을 과하게 넣지 않고 각 섹션의 역할에 맞는 UI를 구성했습니다.
그러나 미니멀리즘을 추구해 전체적으로 다양한 디자인 요소를 쓰지 않았고 이용 방식도 직관적으로 쉽게 알 수 있도록 했습니다.

Design

Motion Amidst Rest

다양한 브랜들를 일관된 방식으로 경험한다는 동중정(動中靜) UI 전략 안에서 디자인은 반대로 정중동(靜中動)으로 나아갔습니다.
여백과 이미지를 단순하게 사용하되 그리드는 자유롭게 사용했고 직선의 간결함 속 곡선의 부드러움을 담았습니다.
UI/UX 콘셉트에 따른 각 섹션에 최적화된 디자인도 정중동의 흐름 안에 있습니다.
이런 변화들은 시각적 피로도를 낮춰주는 역할도 합니다.

Contents

가로 또 세로

기존 E 커머스의 긴 세로형 디자인이 주었던 스크롤 피로도를 줄이기 위해
짧은 동선의 가로 스와이프 기능 부분적으로 도입했습니다. 카드 형태로 한눈에 보고 빠르게 탐색할 수 있습니다.

Lookbook 강화

이런 구성은 기존 E 커머스와 차별화된 비주얼을 보여줬습니다.
이를 통해 입점 브랜드는 프리미엄 이미지를 얻었고 고객은
LOOKBOOK과 LIVE를 통해 좀 더 시각적 만족을 느끼며 쇼핑을 할 수 있게 됐습니다.

검색 기능 강화

검색과 필터의 기능을 강화하고 사용은 쉽게 했습니다.
태그 기능도 강화돼 키워드 검색이 쉬워졌습니다.

판매자 중심에서 고객 중심으로

개인화 서비스를 위해 상품 추천 기능(AI)을 강화, 고객의 취향에 맞는 상품이 잘 노출되도록 했습니다.

‘살까?’ 할 때 바로 살 수 있도록

어떤 페이지, 위치에서도 하단 구매하기를 누르면 해당 상품 구매가 바로 진행됩니다.
쉽게 ‘주문 완료’까지 이어지도록 구조와 프로세스를 간소화 하였으며
선물하기 기능 추가로 새로운 수요를 이끌어 냈습니다.

Color

• Primary

  Black

  #222222

  Sand Beige

  #b7a386

• Secondary

  Purple

  #5211ce

  Purple Pink Gradient

  #7876FE
  #ff99a6

• Positive / Right

  Blue

  #2680EB

• Warning / Error

  Red

  #f25758

Typeface

• Kor

  Noto Sans CJK KR

  Bold

  Medium

  Regular

  letter-spacing -10 고정 (어도비XD 설정상)

• Eng, Num

  Montserrat

  Bold

  Semi Bold

  Medium

  Regular