UX 아카데미 오픈프로젝트 [지그재그 - UX/UI 개선]

UX/UI 사용성 개선 프로젝트
2020. 09 ~ 2020. 11
동대문 종합 패션 모음 앱

N. 김소희
E. Sophiakim.design@gmail.com
About us
N. 김도희
E. asxdfc@gmail.com
N. 강주예
E. gniod114@gmail.com
N. 한진희
E. dltmf5781@gmail.com

OVERVIEW
ENJOY
FIND
EASY
지그재그는 좋아하는 상품을
보다 더 쉽게 찾을 수 있는
온라인 쇼핑 환경을 만듭니다.
서비스 특징
통합 결제 서비스 ‘z결제’
지그재그는 ‘결제 시스템의 혁명’으로 불릴 만한
‘Z결제’를 지난해 론칭해 커머스 플랫폼으로의
입지를 구축했다. Z결제는 지그재그만의 통합 결제 서비스로,
각 쇼핑몰에 접속해 회원가입과 로그인
과정 등을 거친 후 결제하는 불편함을 없앴다.
빅데이터 기반 추천서비스
지그재그는 빅데이터에 강점을 가진 앱이다. 유저가 몇 번 클릭
해 본 제품들과 상품을 바탕으로 개인화 추천 ‘ 과 ‘검색서비스
‘를 지속해서 강화하고 있다.
개인의 취향을 바탕으로한 여성 온라인 쇼핑몰 모음 앱
기존 키워드
Primary User : 10-20대 MZ세대 여성
월평균 270 만명, 일평균 70만 사용자
타겟층

CONTENTS
01
Discover
02
Define
03
Develop
04
Deliver
01_1. 데스크 리서치
01_2. 경험 요소 파악
01_3. 이슈도출
01_4. 필드 리서치
03_1. UX 가치
03_2. UX 전략
03_3. User Scenario
03_4. Storyboard
04_1. Task Flow
04_2. Prototype
04_3. Prototype video
02_1. Key Finding
02_2. Affinity Diagram
02_2. 인사이트

01
Discover
01_2. 경험 요소 파악
01_3. 이슈도출
01_4. 필드 리서치
Discover Define Develop Deliver

지그재그의 새로운 전략의 필요성
지그재그는 10-20대 MZ세대 패션 쇼핑 어플 중 절대적인 비중을 차지하고 있으며
MAU도 절대적인 수치를 차지하고 있다. 그러나 에이블리,스타일쉐어 등의 후발주자들이
20년 4월부로 무섭게 따라붙는 추세이기 때문에 새로운 전략이 필요하다.
01. Discover

01. Discover
개인화 추천 기술 강화와 인플루언셀러 플랫폼의 결합
지그재그와 에이블리의 차이점
지그재그와 에이블리에서는 공통적으로 개인화 맞
춤 서비스를 제공하고, 차이점으로는 에이블리에서
SNS 스타들이 이용하는 핫한 아이템들을 구매할
수 있는 ‘셀럽공구’서비스가 있다.
지그재그를 이긴 에이블리
1위를 달리던 지그재그를 누르고 패션 쇼핑앱 ‘에이블리’가
패션 전체 부문에서 20. 1월 월간 사용자 수 (MAU)1위를
달성했다.
인플루언셀러의 영향력
10대에게 인플루언서는 친근한 존재이며, 영향력은 연예
인보다 더 높거나 비슷한 수준이며 긍정적 인식을 가지고
있다.

01. Discover
사용자들의 절대적 앱 사용 시간을 늘리기 위해 많은 패션 앱들이 플랫폼을 제공하는 형태에서
끝나는 것이 아니라, 사용자 커뮤니티를 운영하거나, 상품을 보여주는 방식을 매거진의 형태로 변화하여
사용자를 Lock-in할 요소들을 갖추어 가고 있다.
입점 판매자들을 위해 물류
및 마케팅 등 전반적인 부분을
대행하는 서비스 '헬피'
중점 서비스
플랫폼 성격
페이스북 및 인스타그램 등
SNS 스타들이 이용하는 핫한
아이템들을 구매할 수 있는
‘셀럽공구’
패션과 뷰티 등의 정보를
실시간으로 공유하는 플랫폼으로
스타일에 특화된 SNS, ‘사용자
컨텐츠와 커머스의 결합’
패션 놀이터 지향, 온라인 패션
웹진 `무신사 매거진`
29CM는 홈에서 매거진을 보는
듯한 경험을 사용자 쇼핑으로
연결하는 방식
하루배송셀럽공구 / 개인화 무신사 매거진, 무신사 스탠다드SNS / 뷰티 카테고리로 확장
새로운 브랜드 소개/ 라이프 스
타일 추천

01_2. 경험요소 파악
01. Discover
신뢰성
[홈]
- 상품 추천의 근거가 없어 추천상품의 신뢰도가 떨어진다
사용성
[검색]
- 검색어 입력전,검
색 화면에서 의미 있
는 정보들을 보여주
지 않는다
[모아보기]
- 홈’ 기능과 중복되는 기능이 많다고 느낀다
- 모이보기에서 제공하는 스와이프 형식의 카테고리들이 한
눈에 파악하기 어려워 사용성이 떨어진다
[필터 아이콘]
- 필터 아이콘이 같은 위치에 똑같은 모양을 두고 기능의 차이를 두어 헷갈린다.
[리뷰]
- 인스타 리스트처럼 사진만 모아보는 기능이 있었으면 좋겠다
편의성
[검색]
이미지로 검색할 수
있는 기능이 있으면
좋겠다
[상품 리스트]
- 상품이 3열이 배열되어 있는데, 한 화면에 너무 많은 상품과
사진이 노출되어 어지럽다.
[찜한 아이템]
- 찜한 상품을 바로 장바구니에 넣는 기능이 있으면 좋겠다
- 찜한아이템을 비교 기준이 없어서 불편하다. 티셔츠, 바지 등을 무작위로
장바구니에 넣었더라도, 이를 한번에 비교하고 싶다.
[리스트]
- 원가(소비자가)가 써있지 않고, 할인율만 있어서 할인된 가격이라는 인지가 어렵다.
[찜 > 비교하기]
-물건을 살 때 리뷰를 보거나 각 아이템을 평점을 보고 사는 경우가 많은데
별점(리뷰평점)을 바로 확인할 수 없는 점이 불편하다.
- 각 물건의 색상, 사이즈가 여러 옵션인데 일일이 들어가서 확인 해야해서 불편하다.
탐색 주활동 보조활동

01_3. 이슈 도출
01. Discover
탐색
보조활동
주활동
1. 검색시 사진과 보이스 검색이 필요할까?
2. 검색 후 쇼핑몰, 아이템, 스타일을 구분해서 보여주는 효과적인 방법이 있을까?
모아보기 탭 
1. 모아보기에서 카테고리를 눌렀을 때 새로운 창이 뜨는데, 사용자 경험 흐름을 끊기지 않게 하는 방법이 무엇일까?  
2. 모아보기의 상단 카테고리를 스와이프 보다 쉽게 찾아볼 수 없을까?  
3. 모아보기 내의 색상 및 가격등 필터를 편리하고 유용하게 제공하는 방법이 있을까?  
 
 
1. 쇼핑을 하기 전 리뷰를 볼때, 사용자 경험 흐름이 끊기지 않고 구매까지 연결시킬 방법이 있을까?  
2. 주문 내역을 기반으로 추천해주는 서비스는 어떨까? 
3. 상품 리스트화면에서 추가적인 과정을 거치지 않고, 상품의 여러 옵션을 확인할 수 있을까?  
홈 탭(첫화면) 
1. 해당 추천의 이유를 제공하여 추천에 대한 신뢰성을 높일 수 있지 않을까? 
2. 좋아요나 싫어요와 같은 의사 표시를 통해 ‘사용자’가 능동적으로 취향을 표현하게 하면 좋지 않을까? 
3. 관심 수치를 구체적인 데이터로 표시하는게 사용자에게 더 신뢰감을 줄 수 있을까?

01_4. 필드리서치 개요
01. Discover
지그재그와 같은 쇼핑 앱를 이용한 온라인 쇼핑의 경험을 듣고, 사용자에게 task를 주어 지그재그
앱을 이용한 다양한 상품을 구매하도 하고 실제 행동 관찰 조사 한다. 관찰 조사 전후에 In-depth
인터뷰를 통해 각 이용흐름 별 Pain point 와 Needs를 파악한다.
필드 리서치 개요
총 조사 인원 : 6명
검색형 사용자(4명)
- 지그재그를 이용시 명확히 사고자하는 상품이
있어 검색 위주로 쇼핑하는 사용자
탐색형 사용자(2명)
- 지그재그를 이용시 명확히 사고자하는 상품 없이
상품 리스트를 탐색하는 위주로 쇼핑하는 사용자
Five Whys
Card Sorting
Guided Tour
인터뷰 기법
Tasks
Scenario
관찰 조사 기법

01_4. 필드리서치 문항 01
01. Discover
구분 조사포인트 Task 질문 및 지시사항
Rapport Task. 최근쇼핑경험
1. 요즘 어디서 쇼핑하세요 ? (다른 앱이라면 이용경험에 대해 듣기)
2. 언제 어디서 지그재그 앱을 사용하시나요?
3. 지그재그 앱에서는 쇼핑 자주하시나요 ?
4.지그재그 앱에서 쇼핑하는 이유가 무엇인가요?
5. 지그재그 앱에 대한 자신의 익숙한 정도를 한단어로 표현한다면 ?
모아보기 가이드 투어
모아보기
정보의 적절성
Task. 지그재그 앱을 사용해서 사고싶은 색의 신발을 4개 찜
해보세요.
1. 모아보기를 이용 시 경험에 대해서 말씀해주세요
2. 필터를 사용 후 불편한 점이 있었나요? 어떤 점이 불편하셨나요?
검색 가이드 투어
검색 과정의
적절성
Task. 검색을 이용하여 ‘사뿐’ 쇼핑몰을 검색해주세요.
Task.검색을 이용하여 ‘롱부츠’를 검색해주세요.
검색창 <내가 찾아 봤던>을 보고 의견을 말씀해주세요
1. 검색하여 쇼핑몰을 찾을 때 불편한 점이 있으셨나요?
2. 검색하여 제품을 찾을 때 불편한 점이 있으셨나요?
3. 사진검색, 음성검색이 필요하다고 생각하시나요

01_4. 필드리서치 문항 02
01. Discover
구분 조사포인트 Task 질문 및 지시사항
홈
Q&A 홈 화면 정보의 적절성
1. 사용자가 어디까지 스크롤하는지? (만족도 체크 예시화면비교)
2. 끝까지 스크롤 한다면 그 이유가 무엇인가?

큐레이션의 적절성(사용
자는 추천받은 결과에 대
해 얼마나 납득하는가?)
추천된 콘텐츠가 왜 추천
되었는지에 대한 정보가
제공되어야 하는가? (필
요하다면, 현재는 정보가
충분히 제공되고있는가?)
카테고리별 콘텐츠에 각
각 사용자취향과의 일치
정도를 나타내는 것이 필
요한가?
Task. 각 카테고리별로 큐레이션 된 추천 결과에 대한 경험을
생각나는대로 표현해달라고 요청
1. 홈화면의 <당신을 위한 추천 아이템> “이 카테고리에 나타난 콘텐츠들은 실
제로 사용자님의 취향과 얼마나 부합하는 것 같나요?” (“이 콘텐츠들은 왜
사용자님께 추천된 걸까요?”, “왜 추천되었는지에 대한 정보가 충분한가요?
부족한가요? 더 필요한가요?”)
2. 어떤방식으로 추천아이템을 보여주는 게 좋을까요?
3. 추천기준이 화면에 보여진다면 좋을까요?
(예를들어 퍼센테이지)“왜 그런가요?”
4. 자신의 취향을 적용시킬 수 있는 방법이 있다면 좋을까요?
어떤방식이 좋을까요?
5. 사용자님의 취향과 일치하는 순으로 나열된것이 유용하다고
느껴지나요?
검색 카드소팅
홈과 모아보기 탭이
가지고 있는 정보의
적절성 확인
홈과 모아보기 탭에 적절하다고 생각하는 정보를 배열해주세요.

02
Define
02_1. Key Finding
02_2. 인사이트

02_1. Keyfinding
02. Define
리서치 결과를 통한 키파인딩 도출
찜 탭 내의 기능 및 활용홈화면의 탐색 및 활용검색을 통한 탐색과정모아보기를 통한 탐색과정
필터 기능:
1. 색상필터에서 원하는 색상을 찾을
수 없다.
-필터에 원하는 색상이 없는 경우
(인디핑크, 네이비 등과 같은 색상을
찾고싶다)
모아보기 화면:
1. 전체적으로 홈화면과 모아보기가
겹치는 부분이 많아 모호하다, 컨텐츠
가 중복된다
2. 모아보기의 카테고리가 한 화면에
보이지 않고, 좌-우로 스와이프 되는
것이 불편하다,
1. 검색 후, 쇼핑몰/상품 분류가 자세히
되었으면 좋겠다.
2. 이미지로도 아이템을 검색하고 관련
상품들을 탐색할 수 있으면 좋겠다.
1. 카테고리 분류가 없어 원하는 아이템
탐색이 불편하다, 상/하의/원피스 등이
다 한꺼번에 나타나서 중구난방으로 보
여준다는 느낌을 받는다.
2. 추천의 신뢰성 - 평점, 구매수량, 수치
등의 근거가 없어 신뢰하기 어렵다.
3. 취향 기반추천리스트에, 내 취향이 아
닌 상품이 많이 나와서 이를 제외하고 싶
다
1. 찜 상품을 일일이 폴더링 하기 번거
롭다.
2. 찜 상품 내에 상품이 많이 쌓이면, 아
이템을 비교해서 보기 힘들다, 가격비
교, 할인율, 인기순 등으로 한 번 더 비
교할 수 있으면 좋을 것 같다.
3. 가위, 리스트 아이콘의 기능과 형태
가 모호하다, 아이콘을 눌렀을 때 예상
하지 못한 기능이 나온다.

02_2. Affinity Diagram 01
02. Define
폴더 편집 내의 햄버거
아이콘이 내가 기대했
던 반응이 아니다
찜탭 내의 아이콘의 기
능이 모호하고 사용자
가 기대했던 것과 다르
다
아이콘이 기대했던 기
능과 다르다. 특히 리
스트 아이콘
리스트, 가위 등의 아이
콘이 기대했던 작동방
식과 다르다.
능이 사용자가 기대했
던 것과 달라
사용성이 떨어진다.
찜 폴더를 만든 뒤에 알
아서 분류해주면 좋겠
다.
짬탭 내 폴더링의 자동
셋팅값이 필요하다.
정리하는 걸 좋아해서
직접 ‘찜’상품을 폴더링
함, 자동적인폴더링이
있으면 좋겠다.
사용자들은 찜 자동 폴
더링 기능이 필요하다.
사용자들은 찜탭 내에
서도 상품을 비교하길
원한다.
찜탭에도 필터가 있으
면 좋겠다.
가격비교, 할인률, 무료
배송등 찜탭내의 비교
를 할 수 있으면 좋겠
다.
찜 상품 내에서 한번 더
상품을 비교하고 싶다.
사용자들은 보다 디테
일한 색상 필터에 대한
니즈를 가지고 있다.
필터에서 원하는 색상
을 찾기 어렵다.
색상 필터 사용시, 원하
지 않는 색상의 제품도
나와서 불필요하다.
상품의 색상 종류가 얼
마나 있는지, 어떤 색인
지 알 수 없다.(탐색)
필터를 사용할 때, 원하
는 색상이 없어서 당황
스럽다
색상필터를 사용하기
어렵다??
다수의 고객들은 ‘홈’과
‘모아보기’탭의 분류를
모호하게 느낀다.
홈에 카테고리 기능이
필요하다.
‘홈’과 ‘모아보기’가 겹
친다는 느낌을 받는다.
홈화면 내의 카테고리
분류가 없어서 불편을
느낀다.
홈은 추천이나 픽같이
상품소개 용도로 사용
되고, 개인맞춤형이면
좋겠다.
홈에도 카테고리가 있
으면 좋겠다.
‘모아보기’를 평소에 사
용하지 않고, ‘검색’을
통해 쇼핑한다.
홈화면의 추천상품에
서도 카테고리를 나누
어주면 좋겠다.
추천리스트에서 내스
타일이 아닌 옷이 드러
나지 않길 원한다.
내 취향과 딱맞는 상품
이 추천되면 좋겠다.
지금 사고싶지 않은 상
품은 제외하고 싶다.
취향에 맞는 옷을 더 보
여주면 좋겠다(3개 이
상)
넷플릭스의 좋아요/싫
어요 같은 기능, 엔터테
인먼트적 요소로 넣으
면 좋을것같다.
‘내가 원하는 스타일만
선택해서 보는 건 없나
요?’
나와 스타일이 맞지 않
으면 추천에서 제외할
수 있으면 좋겠다.
왓챠는 처음 가입할 때
취향선택 가능 -> 지그
재그도 사용자가 자신
의 취향을 선택할수있
었으면
안사고싶으면 꾹 눌러
서 삭제 및 편집으로 삭
제가 반영되었다는 반
응이 뜬 후, 새로운 리
스트를 보고싶다.
홈화면(추천화면)을 보
며, ‘이런 스타일은 내
스타일이 아닌데?’
무한스크롤의 컨텐츠
가 끝까지 나와 맞는 스
타일이면 스크롤을 내
린다.
이미지 검색 기능이 요
구된다.
사용자 검색을 용이하
게 쓸 수 있도록 직관적
인 정보가 필요하다.
옷 사진을 통해 검색할
인기있는 아이템을 보
여주는 것이 큰 의미가
없다.
검색의 정확성이 떨어
진다.
영어로 검색했을 경우,
해당제품이 나오지 않
는다.
검색시, 지금 <가장 인
기 있는> 을 통해 구매
한 적이 없다.
네이버 쇼핑의 <렌즈검
색>기능과 같이 비슷
한 상품 한 눈에 보고
싶다.
내가 찾아봤던 검색기
록을 보여주는 것이 편
리하다.
무신사의 경우, 브랜드
검색을 <브랜드> 라고
따로 표시해줘서 편리
하다.
추천기준을 모르겠어
서 신뢰가 잘가지 않는
다.
최근에 구매한 상품을
은 보고싶지 않다.
이미 산 제품 추천보다
는 어울리는 옷 추천을
받고싶다.
순위의 가독성이 떨어
진다
베스트 순위를 신뢰할
수 있는 추가적인 정보
가 필요하다
베스트 탭의 순위가 잘
보이지 않는다.
베스트 순위에 대한 신
뢰가 안간다.
순위가 눈에 잘 들어오
지 않는다.
(하윈순위와 윗순위 구
분니즈)
베스트 순위의 기준을
보여주면 좋을 것 같
다.(판매순 or 좋아요
순)
별점을 보여줬으면 좋
겠다(신뢰도)
추천된 이유에 대한 부
가적인 정보를 제공하
여 추천의 신뢰도를 높
여야 한다.

다
스트 아이콘
식과 다르다.
던 것과 달라
다.
원한다.
면 좋겠다.
다.
스럽다
어렵다??
필요하다.
느낀다.
좋겠다.
으면 좋겠다.
상)
요?’
었으면
린다.
구된다.
없다.
진다.
는다.
한 적이 없다.
싶다.
리하다.
하다.
다.
받고싶다.
진다
가 필요하다
뢰가 안간다.
지 않는다.
분니즈)
순)
겠다(신뢰도)
여야 한다.
02. Define
순위의 가독성을
보완하고 신뢰도를
높일 수 있는 방안을
마련한다
순위의 가독성이
떨어진다
수 있는 추가적인
정보가 필요하다
홈과 모아보기의
공통적인 정보를
한탭에 보여준다
모호하게 느낀다
홈에 카테고리
기능이 필요하다
인사이트 인사이트
공통적 기능을 통합하고,
신뢰성 있는 홈화면
UX 방향성

다
스트 아이콘
식과 다르다.
던 것과 달라
다.
원한다.
면 좋겠다.
다.
스럽다
어렵다??
필요하다.
느낀다.
좋겠다.
으면 좋겠다.
상)
요?’
었으면
린다.
구된다.
없다.
진다.
는다.
한 적이 없다.
싶다.
리하다.
하다.
다.
받고싶다.
진다
가 필요하다
뢰가 안간다.
지 않는다.
분니즈)
순)
겠다(신뢰도)
여야 한다.
사용자에게 추천의
당위성을 느끼게 하기 위한
시각적인
정보를 제공한다
추천된 이유에 대한
부가적인 정보를
제공하여 추천의
신뢰도를 높여야 한다
사용자의 능동적
개입을 통해 추천항목의 신
뢰성을 높인다
추천리스트에서 내스타
일이 아닌 옷이 드러나지
않길 원한다
내 취향과 딱맞는 상
품이 추천되면 좋겠
다
추천의 당위성을 위한
추가 기능 및 정보 제공
UX 방향성
02. Define

다
스트 아이콘
식과 다르다.
던 것과 달라
다.
원한다.
면 좋겠다.
다.
스럽다
어렵다??
필요하다.
느낀다.
좋겠다.
으면 좋겠다.
상)
요?’
었으면
린다.
구된다.
없다.
진다.
는다.
한 적이 없다.
싶다.
리하다.
하다.
다.
받고싶다.
진다
가 필요하다
뢰가 안간다.
지 않는다.
분니즈)
순)
겠다(신뢰도)
여야 한다.
색상을 세부적으로
선택할 수 있는 필터
기능을 제공한다
사용자들은 보다
디테일한 색상 필터에
대한 니즈를
가지고 있다.
찜 탭내 아이콘 개선과 구
매 결정을 돕기위한
기능 추가가 필요하다
찜탭 내의 아이콘의
기능이 사용자가 기대했
던 것과 달라
사용성이 떨어진다
사용자들은 찜
자동 폴더링
사용자를 위한 구매 편리성 제고
UX 방향성
사용자들은 찜탭 내
에서도 상품을 비교
하길 원한다
02. Define

다
스트 아이콘
식과 다르다.
던 것과 달라
다.
원한다.
면 좋겠다.
다.
스럽다
어렵다??
필요하다.
느낀다.
좋겠다.
으면 좋겠다.
상)
요?’
었으면
린다.
구된다.
없다.
진다.
는다.
한 적이 없다.
싶다.
리하다.
하다.
다.
받고싶다.
진다
가 필요하다
뢰가 안간다.
지 않는다.
분니즈)
순)
겠다(신뢰도)
여야 한다.
검색을 통해 자신이
원하는 상품을 정확히
찾을 수 있도록
개선한다
사용자 검색을 용이하게
쓸 수 있도록 직관적인
정보가 필요하다.
인사이트
이미지 검색 기능이
요구된다
직관적인 검색 기능 강화
UX 방향성
02. Define

다
스트 아이콘
식과 다르다.
던 것과 달라
다.
원한다.
면 좋겠다.
다.
스럽다
어렵다??
필요하다.
느낀다.
좋겠다.
으면 좋겠다.
상)
요?’
었으면
린다.
구된다.
없다.
진다.
는다.
한 적이 없다.
싶다.
리하다.
하다.
다.
받고싶다.
진다
가 필요하다
뢰가 안간다.
지 않는다.
분니즈)
순)
겠다(신뢰도)
여야 한다.
02_3. Affinity Diagram Insight
공통적 기능을 통합하고,
신뢰성 있는 홈화면
UX 방향성
• 다수의 고객들은 ‘홈’과 ‘모아보기’탭의
분류를 모호하게 느낀다
• 홈의 카테고리 기능이 필요하다
• 순위의 가독성이 떨어진다
• 베스트 순위를 신뢰할 수 있는 추가적
인 정보가 필요하다
• 색상을 세부적으로 선택할 수 있는 기능
을 추가한다
• 이미지 검색 기능이 요구된다
• 사용자 검색을 용이하게 쓸 수 있도록 직
관적인 정보가 필요하다
• 추천리스트에서 내스타일이 아닌 옷이 드러나지
않길 원한다
• 내 취향과 딱 맞는 상품이 추천되면 좋겠다
• 추천된 이유에 대한 부가적인 정보를 제공하여
추천의 신뢰도를 높여야 한다
• 찜 탭내 아이콘 개선과 구매결정을
위한 기능이 필요하다
• 찜 한 상품 내에서의 자동 폴더링
• 사용자들은 찜 탭 내에서도 상품을
비교하길 원한다
직관적인 검색기능 강화
UX 방향성
사용자를 위한
구매 편리성 제고
UX 방향성
추가 정보 및 정보 제공
UX 방향성
02. Define

03
Develop
03_1. UX 핵심가치
03_2. UX 전략
03_3. User Scenario
03_4. Storyboard

03. Develop
‘지그재그’ 는 비교적 기본적인 기능
및 UX는 잘 갖추어져 있음
따라서 Basic 요소의 개선 보다는,
Performance 영역과 Excitement 영역에 집
중한 서비스 개선을 목적으로 함
가치 검증 : Kano Model 사용

Kano Model : Performance 영역
직관적인 검색기능 강화
추가 기능 및 정보 제공
사용자를 위한
구매 편리성 제고
홈 화면과 모아보기의 중복기능(MD
픽, 유사한 탐색형태)를 통합한다
사용자에게 무한 스크롤을 할 수 있는
동력은 ‘개인화 콘텐츠‘이다
추천의 신뢰성을 위해 리스트에 정보를
추가해야 한다
사용자들이 추천아이템에 대한
능동적인 표현을 3D 터치를 통해
할 수 있도록 돕는다
이미지 검색기능을
추가한다
사용자 검색을 용이하게
할 수 있도록 직관적인
정보를 제공한다
추천리스트에서 나의
스타일이 아닌 옷이
드러나지 않도록 한다
내 취향과 딱 맞는
상품을 추천한다
추천된 이유에 대한
부가적인 정보를 제공하여
추천의 신뢰도를 높힌다
사용자의 예상과
다르게 작동하는
아이콘을 수정한다
찝 탭내 자동폴더링 기능
을 추가하여 사용자의
편리한 쇼핑기능을 돕는다
찜 탭내 상품비교기능을
통해 구매로 이어질 수
있는 동기부여를 제공한다
색상을 세부적으로 선택할
수 있는 필터를 제공한다
사용자별 쇼핑 상황에서 정보가
중복되지 않고, 만족할 수 있는
사용성을 갖춘 ‘홈화면’이 필요하다.
03. Develop

Kano Model : Excitement 영역
아이템에 대한 다른 유저들의 의견을 파악하고 싶다.
1020대의 경우, SNS를 통해 자신의 스타일을 표현
하고자 하는 욕구가 있다.
최신 트렌드를 파악하고 인기있는 상품을 보기 위해
MD픽을 활용한다
유명 연예인 또는 인플루언서들이 산 상품들이 궁금하고,
그들의 상품을 따라하고픈 욕구가 있다
‘언니 스타일 가지고 싶어요’
‘공감과 소통’을 중시하는 사용자를 만족시키는 커뮤니티 형성을
통해 단순 구매 이외의 앱 사용동기를 만들어야 한다.
03. Develop
10대들은 3D 아바타 생성 앱 ‘제페토’를 통한 가상 현
실 플랫폼을 통해 자신을 표현하고자 한다.
사고 싶은 상품 중에서도, 특히 나에게 잘 어울리는
옷을 사고싶다.
옷을 실제로 구매해서 입어보기 전에, 이 옷이 나의 체형
에 맞는 사이즈 인지 궁금하다.
온라인 구매시 실제 상품을 보지 않더라도 상품들 중에
사용자(구매자)에게 더 어울리는 옷을
찾고 싶어하는 욕구를 충족시켜야 한다.

단순한 패션 커머스앱을 넘어서는
개인화 추천 기반 MZ세대 스타일 커뮤니티 / 패션 커머스 앱
복합단일
저기능
고기능
03_2. UX 전략
03. Develop

#’취향’ 기반으로 #간편히 ‘비교’하고 #함께 ‘공유’하는
#최근 구매 목록 기반
#찜 목록 기반
#내 스타일의 상품을 알아서
보여주는
#찜 탭 내 비교기능
#일일이 상품페이지 들어가서 비교하
는 건 그만
#한 페이지에서 #바로 비교
#입어보기 기능
#언니_옷장_ 궁금해요
#Z클로젯
#패션으로_소통하자
#생생한 후기까지
▪개인화 추천 기반의 홈화면 개선
▪데이터 기반 추천으로 서비스의 신뢰도 향상
▪내 스타일과 유사한 타사용자와 연결고리 제공
▪ ‘찜‘한 상품을 더 자세하게 비교할 수 있도록
2배열 화면 개선
▪ 끝까지 고민하던 2개의 상품을 쉽게 비교할
수 있는 기능 제공
▪ 나의 얼굴로 설정한 아바타가 직접 옷을 입어
보며, 나에게 딱 어울리는 찾을 수 있도록 함
▪ 나의 스타일을 뽐내고, 타인의 스타일을
참고할 수 있는 Z 클로젯 탭 추가
▪ ‘패션‘에 대한 정보를 공유하며, 패션으로
하나될 수 있는 지그재그만의 커뮤니티
생성
03_2. UX 전략
03. Develop

찜탭 이동
03_3. User Scenario 01
Activity
✔ 사용자 특성
- 탐색형 사용자
- 원하는 옷이 명확히 없는 경우가 많으며, 지그재그에서
둘러보면서 옷을 구매
‘이제 곧 겨울이니까,
지그재그 어플을 통해 겨울옷을 구매해야지! ‘
Experience
접근
‘오늘은 어떤 겨울옷을 사볼까?’
라는 생각을 하며, 나에게 딱 맞는
스타일의 겨울 옷을 사고싶다
나에게 딱 맞는 옷이 나올것
이라 기대한다.
홈에서 내가 원하는 옷이 나올 때
까지 계속 스크롤 한다.
내 스타일이 아닌 옷을 많이
보고싶지 않다
카테고리를 선택해서 추천받고 싶다
나에게 아이템들이 추천된
이유가 궁금하다
마음에 드는 상의 2개와
원피스 1개를 찜한다
찜 리스트가 자동으로
분류될 것이라 기대한다
찜 리스트를 쭉 살펴보다가, 과거에
찜 해놨던 상의만 살펴본다
찜 상품 내에서도, 나와 더 잘 어울리는
상품을 찾고 싶다
찜 한 상품 내에서 이전에 담아놓은
상품과 비교하고 싶다
홈화면 탐색 찜
Solution
추천 기능의 강화
- 추천의 당위성을 위한 UI 개선
- 추천 아이템에 자신의 취향을 표현할 수 있는 기능 추가
자동 폴더링 기능을 제공해,
상품이 카테고리별로 자동적으로
분류되도록 기능 개선
‘내 아바타＇를 활용해 찜 탭 내의
옷을 입어볼 수 있도록 한다
✔ 상황(Situation)
03. Develop

03_3. User Scenario 02
Activity
✔ 사용자 특성
- 검색형 사용자
- 원하는 옷이 있을때 지그재그에 접속하며, 주로 ‘검색
‘을 통해 옷을 구매한다
‘썸남과의 데이트를 위해 연보라색 원피스를 구매해야
지!’
Experience
접근
Solution
✔ 상황(Situation)
썸남과의 데이트를 위한 연
보라색 원피스를 사고싶다
나에게 딱 맞는 옷이 나올
것 이라 기대한다.
검색 탭에서 원피스를 검색
한다
검색창에 ‘러블리 연보라
원피스’를 검색했으나
상품이 2개 나온다
검색에서 나온 리스트를
계속 스크롤해서 겨우
마음에 드는 원피스를
6개 찜했다
찜으로 가서 사고싶은 메인
상품과 다른 상품들을
편하게 비교하고 싶다
오랜시간 동안 비교한다
오랜시간동안 비교
했지만, 시간도 촉박하고
구매과정에서 지쳐
구매를 포기한다
필터를 통한 상세검색 강화
쉐이더를 통한 색상 상세검색 제공
이미지 검색기능 제공
검색 후 필터제공이 아닌, 검색 시 필터제공
찝 탬네 비교기능 제공
다수의 상품의 상세내역 비교기능 제공
본인의 체형분석을 바탕으로, 적절 사이즈 추천기능 제공
검색 리스트 탐색 찜 장바구니(구매)
내가 원하는 러블리한 연보라
색 제품을 찾기 어렵다
일일이 들어가서 상세
설명과 가격비교를
보는게 힘들다
상세 화면까지 가지 않고
지그재그 앱 찜 탭 내에서
비교해서 보고싶다
03. Develop

다른 사람들이 입는 옷이 궁금해! 지그재그의 메인페이지에서, Z클로젯 배너를 발견 Z클로젯 기능을 활용해, 다른 사람들이 산 옷을 구
경하고 내가 사고싶었던 옷도 발견한다
사고 싶었던 옷의 색감을 질문하며, 옷의 정보
를 얻는다
다른 사용자들과 소통하며 옷의 구체적 정
보를 얻고 쇼핑에 참고한다
실 구매자와의 소통은 쇼핑 대한 신뢰도 상승! 성공적인 쇼핑 완료
[ Z클로젯 ]
03_4. Storyboard 01
03. Develop

‘비교하기’ 기능을 통해, 2개의 상품을 한 페이지에서 비
교할 수 있어서 편리하네
주말 썸남과의 데이트를 위해 연보라색 원피
스를 장만해야겠어
구체적인 색상 설정이 가능하니까 편하게
내가 원하는 색상의 옷을 찾을 수 있네
쉐이더를 통해서, 내가 원하는 연보라색 원피스를 6
개 찜 완료
6개 중에서도특히 고민되는 2개를 ‘비교하기’ 기능을
통해 비교해야지
데이트룩 구매 완료!
[ 검색 기능 ]
03_4. Storyboard 02
03. Develop

내 스타일에 딱 맞는 옷을 찾고싶어! 평소 내 스타일과 잘 매치되는 옷을 보여주
네? 퍼센테이지 까지 보여줘서 더 신뢰가 간
다 ~
역시 지그재그야 ! 이거 찜 해 두고 이따가 봐야
겠다
아 이건 너무 별론데, 싫어요로 내 의사를 표현
할 수 있어서 좋다 ~ 다음엔 이런 스타일이 안
뜨겠지?
자동 폴더링 기능 덕분에, 저번에 찜 해놓은 블라
우스와 한번에 비교가 가능하네 !
오늘도 지그재그에서 성공적인 쇼핑 완료
[ 홈 화면 및 찜 탭 개선 ]
03_4. Storyboard 03
03. Develop

04
Deliver
04_1. Task Flow
04_2. Prototype

04_2. Prototype drawing
04. Deliver
홈 화면 검색 화면
찜 화면
피드
Z 클로젯

개인 맞춤형 홈화면으로 개선
홈과 모아보기 탭을 통합하여
기능의 중복을 제거한 효율적인 화면을 구성한다
모아보기 탭에서 제공되던 스와이프 형식의 카
테고리를 한 화면에 보여주고, MD픽 등의 의류
관련 콘텐츠도 홈화면에서 접할 수 있다
추천을 강화하여
데이터 기반 추천아이템
위주로 제공한다
개인 맞춤화
Z클로젯 인플루언서 노출
04_2. Prototype
04. Deliver

검색화면 개선
필터와 이미지 검색등을 추가하여 검색창 개선

필터기능추가
기존검색의 경우, ‘검색 후 모
아보기에서 필터적용’의 흐름
이었지만, '검색 및 필터적용’을
검색창 화면에서 진행할 수 있
도록 개선한다
‘지금 가장 인기있는’ 키워드의 신뢰도 향
상을 위해, 상승/하강 순위를 제공한다
색상 스포이드 형식으로
색상선택의 폭을 넓히고,
정확한 색상 선택을 제공한다
이미지 검색 기능 추가하여 검
색의 활용성을 높인다
04_2. Prototype
04. Deliver

찜탭 개선
비교하기 기능 추가 / 자동폴더링 및 아이콘 정의 / 이미지를 2배열로 개선
찜 내 아이템들이 자동적으로 폴더링
되도록 개선하고, 혼동을 주는 아이콘을
제거하고 삭제 아이콘을 추가한다
색상, 사이즈, 리뷰를 지그재그
안에서 비교할 수 있도록 제공한다
기존 제공 방식을 2배열로 개선하여
정보를 더 쉽게 볼 수 있도록 한다
04_2. Prototype
04. Deliver

AR을 활용한 나의 아바타
신규기능 - 나의 체형과 입어보기
나의 체형을 설정하기
각 쇼핑몰의 제품의 사이즈가 달라도, 옷을
입어보지 않아도, 나에게 딱 맞는 사이즈를
알려주어 사용자의 편리성을 제고한다
나의 아바타로 옷 입어보기
내가 찜한 옷을 가상으로 입어보고 구매를
결정할 수 있다.
아바타에 코디를 하고 ‘Z클로젯의 내 피드’에
공유하는 기능을 통해 사용자에게 새로운
경험을 제공한다
Z클로젯 공유기능 제공
피드에 나의 아바타를 공유할 수 있다.
04_2. Prototype
04. Deliver

Z클로젯
신규기능 - 엔터테인먼트
커뮤니티 기능을 제공하여 서로 실제 후기와 구매 목록을 볼 수 있다
또한 지그재그 안 인플루언서로 성장도 가능하다
이를 통해 상품 리뷰와 다른 사람 의견을 듣고 싶은 니즈를
충족시킨다
태그한 각 제품 페이지로 넘어갈 수 있다
스토리 기능제공
구매연결가능
04_2. Prototype
04. Deliver

Z클로젯
신규기능 - 엔터테인먼트
커뮤니티의 기능 또한 할 수 있어서
지그재그 사용자들의 앱내 절대적
사용시간을 증대시킬 수 있다
인플루언서 팔로우 가능
04_2. Prototype
04. Deliver

04_3. Prototype Video
04. Deliver
홈화면 홈화면/ 카테고리

04. Deliver
검색화면 찜 / 비교하기

04. Deliver
Z클로젯 마이페이지 / 나의체형

지그재그
UX/UI 사용성 개선 프로젝트
2020. 09 ~ 2020. 11
THANK YOU

UX 아카데미 오픈프로젝트 [지그재그 - UX/UI 개선]

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Similar a UX 아카데미 오픈프로젝트 [지그재그 - UX/UI 개선]

Similar a UX 아카데미 오픈프로젝트 [지그재그 - UX/UI 개선] (20)

Más de RightBrain inc.

Más de RightBrain inc. (13)

UX 아카데미 오픈프로젝트 [지그재그 - UX/UI 개선]