UX·UI 분석은 무신사랑 해!

어릴 때부터 패션에 관심이 많아서 한때 패션 사진을 공유하는 스타일쉐어라는 어플을 많이 사용했었는데요. 2021년에 무신사에서 인수하여 2022년 12월 1일 자로 서비스를 종료했다는 소식을 들었습니다. 스타일쉐어와 29CM까지 인수하고, 대한민국의 10번째 유니콘 기업으로 성장한 패션 소셜 커머스 앱 무신사의 UX·UI는 어떻게 되어 있을까요? 오늘은 무신사 앱의 UX·UI를 분석해 보고 개선점을 찾아보려고 합니다! 👀

 

 

다음과 같은 순서로 구성되어 있습니다!
1. 무신사는 어떤 서비스일까?
2. 무신사의 화면구성은 어떻게 돼 있을까?
3. 개선점은 무엇이 있을까?
4. 무신사 앱 분석을 마치며

 

 

1. 무신사는 어떤 서비스일까?

무신사는 대한민국의 온라인 패션 커머스 기업으로 10-20대의 많은 사랑을 받고 있죠. 2001년에 무진장 신발 사진이 많은 곳이라는 커뮤니티에서 시작했고, 후에 무신사 닷컴이라는 사이트를 만들어 길거리를 돌아 다니면서 옷 잘 입는 사람들을 사진 찍어서 올리는 스트릿 스냅이라는 콘텐츠를 선보이며 좋은 매출과 팬덤을 형성했습니다. 10-20대 남성을 주 타겟층으로 시작하여 2016년에는 '우신사'라는 여성 전용 서비스도 출시하여 사용자 층을 넓혔습니다.

 

 

아래는 유아인을 모델로 한 광고 영상입니다. ‘다 무신사랑 해’라는 이중적인 의미를 담은 캠페인 메세지가 인상 깊습니다. 1) 모두 무신사랑 같이 하고 2) 다 무신사를 사랑하자는 의미를 담고 있습니다.

 

 

 

2. 무신사의 화면구성은 어떻게 돼 있을까?

1) 홈 - 추천

앱에 접속하면 바로 보이는 홈 화면입니다. ① ② ③ 하단 탭 위에는 남성과 여성을 선택할 수 있는 FAB가 있는데, 여성을 누르면 여성 전용 서비스인 우신사로 전환하여 탐색할 수 있습니다. ④ ⑤ 무신사와 우신사의 컬러를 다르게 적용하여 사용하고 있는 것이 눈에 띕니다. ⑥ 홈 안에는 추천, 알림, 스타일, 세일, 이벤트, 뷰티 등의 탭으로 나누어져 있습니다. ⑦ 상단에는 광고가 있는데 무신사에서는 남성 위주의 광고를, 우신사에서는 여성 위주의 광고를 제공하고 있습니다. 그 아래에는 ⑧ 뷰티, 럭셔리, 스포츠 등 전문관에 대한 카테고리와 ⑨ 특정 사용자만을 위한 상품과 브랜드 추천으로 이어집니다.

 

2) 카테고리

① 카테고리는 하단 탭에 위치하고 있고, ② 검색 기능도 함께 있습니다. ③ 아우터 안에서도 후드 집업, 블루종, 레더 자켓 등으로 분류해 놓은 것에서 볼 수 있듯이 각 목록별로 상세하게 분류되어 있어서 어느 패션 커머스 앱보다도 카테고리에서 탐색하는 것이 정말 편리해 보입니다. ④ 검색창에는 사진으로 검색하는 기능도 있습니다. 사진으로 상품 검색하는 것을 시도해 보았는데 잘 안되는 것 같아 조금 아쉽습니다.

 

3) 카테고리 - 상품 리스트

카테고리에서 원하는 상품의 종류를 고르면 나오는 페이지입니다. ① 상단에는 아우터와 같이 큰 분류 아래의 하위 분류 카테고리 탭이 있어서, 아우터 중에 다른 종류를 탐색하고 싶을 때 카테고리 페이지로 돌아가지 않아도 됩니다. ② ③ ④ 상품 리스트의 레이아웃을 세 가지 형태로 변형하여 탐색할 수도 있습니다. ⑤ 필터 버튼을 누르면 브랜드, 주요소재, 상의기장 등 원하는 상품의 특징을 상세하게 설정할 수 있고, ⑥ 무신사 추천순, 신상품(재입고)순, 낮은 가격순 등을 정렬하여 탐색할 수 있습니다.

 

4) 상품 상세페이지

① ② 상품 상세페이지에는 사진과 상품 가격 정보가 있고 ③ 아래에는 정보·이벤트, 사이즈, 후기, 문의로 나누어져 있습니다. ④ 상단 GNB에는 뒤로가기, 카테고리, 홈, 검색, 장바구니 아이콘이 있습니다. ⑤ 하단 탭에는 좋아요 버튼과 구매하기 CTA 버튼이 있습니다. 무신사는 전반적으로 검정색을 많이 쓰는데 중요한 정보에는 파란색을 사용하고 있으며, ⑥ 우신사는 보라색을 사용하고 있습니다. 하나의 앱에 무신사와 우신사가 함께 존재하기 때문에 색을 구분하여 사용한 것이 인상깊습니다. ⑦ 하단 탭 위에는 상단으로 바로갈 수 있는 FAB가 있어서, 스크롤을 하며 상품 정보를 탐색하다가 위로 올라가고 싶을 때 또 다시 스크롤하지 않아도 돼서 시간 절약을 할 수 있습니다. 

 

5) 상품 상세페이지 - 후기

① 후기는 스타일, 상품사진, 일반으로 나누어져 있습니다. 스타일은 전신 사진을 올린 리뷰, 상품사진은 전신 사진 이외에 상품사진을 올린 리뷰, 일반은 텍스트 리뷰를 의미합니다. ② 성별, 키와 몸무게 등을 설정하여 탐색할 수 있습니다. ③ 필터에서 사용자의 키와 몸무게를 설정하면 비슷한 체형을 가진 사람들의 리뷰를 볼 수 있습니다. ④ 또한 구매한 사용자가 느끼는 사이즈, 밝기, 색감, 두께감, 촉감의 정도를 작성하게 해서 다른 사용자들이 구매 전에 최대한의 정보를 얻을 수 있도록 분류하여 제공하고 있습니다. 사용자들이 온라인으로 착용해 보지 못하고 구매하기 때문에 해당 상품의 원하는 정보를 최대한 구체적으로 얻을 수 있도록 세심하게 배려했다는 생각이 듭니다! 

 

6) 스냅

위에서도 말했듯이 무신사는 소셜 기능이 충성고객과 매출향상에 큰 기여를 했기 때문에 소셜 영역이 중요한 부분이라고 할 수 있는데요. ① ‘스냅’ 페이지는 하단 탭에서 접근이 가능하고, 사용자들이 다른 사용자들의 패션을 참고하여 구매로 이어질 수 있도록 하고 있습니다. ② 스냅에는 추천, 인기, 최신, 팔로잉 탭으로 나누어져 있으며, ③ 그 안에서 미니멀, 아메카지, 시티보이 등 원하는 스타일의 카테고리를 선택하여 탐색할 수 있습니다. ④ 또한 자신의 키와 몸무게를 설정하여 비슷한 체형의 사람들만 필터링하여 볼 수 있는 것이 특징적입니다. 

 

7) 스냅 - 상세페이지

스냅에서 특정 사진을 클릭하면 나오는 페이지입니다. ① 마음에 드는 패션은 좋아요 버튼으로 자신의 좋아요 목록에 추가할 수 있습니다. ② 또한 댓글로 사용자들이 소통하며 정보를 주고 받을 수 있습니다. ③ 사진 위의 해당 유저의 프로필 사진과 이름 영역을 누르면 유저의 프로필 페이지로 넘어갑니다. 인스타그램처럼 마음에 드는 유저의 피드를 팔로우하여 팔로우한 유저들의 사진들만 모아볼 수도 있습니다.

 

8) 좋아요

① 좋아요 페이지도 하단 탭에서 바로 접근할 수 있습니다. ② 좋아요 페이지 안에서는 상품, 브랜드, 스타일로 나눠져 있고, 상품의 종류도 분류하여 좋아요를 눌러둔 상품들을 확인할 수 있습니다. ③ ‘내가 좋아할 만한 추천 상품’, ‘좋아요하고 포인트 받기’, ‘좋아요한 브랜드 쿠폰 모아보기’ 등 상품을 탐색하고 좋아요를 더 누르라고 유도하는 영역도 눈에 띕니다.

 

9) 마이

① 하단 탭의 제일 우측에 있는 마이페이지에서는 프로필 정보 설정과 주문과 관련된 정보들을 확인할 수 있습니다. 어쩔 수 없이 내용이 많은 마이페이지의 정보들을 잘 그룹핑하여 정리해 놓은 것을 볼 수 있습니다. ② 프로필 설정, ③ 주문 관련 정보, ④ 적립금, 포인트 등 보상, ⑤ 받을 수 있는 혜택 정보, ⑥ 쇼핑정보, ⑦ 무신사페이 정보, ⑧ 고객센터 순으로 중요도에 따라서 배치되어 있으며 적절하게 그룹핑이 되어 있습니다.

 

10) 장바구니

① 상단 GNB에서 접근할 수 있는 장바구니 페이지에는 택배배송과 무탠픽업으로 나누어져 있습니다. ② 무탠픽업은 오프라인 매장에서 무신사 자체 브랜드인 무신사 스탠다드 상품을 픽업할 수 있는 서비스입니다. ③ 장바구니에 담아 놓은 상품이 없을 때는 ‘장바구니에 상품이 없습니다. 상품을 추가해보세요.’라는 문구를 띄워주면서 ‘좋아요한 상품 보러 가기’ 버튼으로 구매를 유도하고 있는 것이 흥미롭습니다! ④ 또한 하단에는 ‘쇼핑 계속하기’라는 버튼으로 다시 탐색하던 페이지로 돌아갈 수 있습니다.

 

 

 

3. 개선점은 무엇이 있을까?

1) 여성의류를 탐색하려고 우신사로 들어왔는데, 남성의류에 가까운 남녀공용인 의류랑 섞여있어서 불편해!

AS-IS
아래의 사진은 각각 무신사와 우신사에서 [상의] - [니트/스웨터]로 들어갔을 때 나오는 화면입니다. 무신사와 우신사의 상품 정렬을 달라지긴 하지만 우신사에는 남녀공용인 상품들이 주를 이루고 있습니다. 하단에 M과 W로 남성의류와 여성의류가 구분돼 있고, 공용에는 M과 W가 함께 태그돼 있습니다. 우신사로 들어왔을 때 여성 의류를 위주로 탐색하고 싶었는데 공용인 상품은 남성의류에 가까워서 불편하게 느껴졌습니다.

 

TO-BE
우신사에서 남녀공용 의류를 제외하거나 포함시킬 수 있는 필터 기능을 제공하는 방법으로 솔루션을 제시해 보았습니다! 또한 남성의류도 포함해서 탐색할 수 있도록 했습니다.

 

 

2) 좋아요 페이지에서 남성의류와 여성의류를 구분해서 보고 싶어!

AS-IS
무신사에서는 남성인 지인에게 선물하고 싶은 상품에 찜을 하고, 우신사에서는 여성인 지인에게 선물하고 싶은 상품이나 제가 관심 있는 상품에 찜을 해놓는 편인데요. 남성의류나 여성의류만 탐색하고 싶을 때 섞여있어서 불편하게 느껴졌습니다.

 

TO-BE
여성 유저의 좋아요 페이지에서는 ‘남성 상품 제외’, ‘남녀공용 상품 제외’ 체크박스 컴포넌트를 추가하여 여성의류만 탐색할 수 있도록 해보았습니다.

 

 

 

 

4. 무신사 앱 분석을 마치며

무신사 앱을 분석해 보니 상세하게 분류해서 탐색할 수 있도록 잘 되어있다는 생각이 들었습니다. 특히 카테고리에서 옷의 종류를 아우터 안에서도 종류별로 분류한 부분과 상품 후기 부분에서 사용자의 신장과 옷의 특징을 설정하여 탐색할 수 있는 부분이 인상 깊었습니다. 직접 착용해 보지 못하고 구매해야 하는 온라인 쇼핑몰의 단점을 최대한 보완하기 위해 고민한 흔적들이 느껴졌습니다. 그리고 기회가 된다면 무신사에서 UX리서처나 프로덕트 디자이너로 일해보고 싶다는 생각이 들었습니다. 패션에 관심이 많은데 관심분야의 회사에서 일하게 되면 더 재미있게 일할 수 있을 것 같습니다. 무신사 앱의 UX·UI분석을 위해 오랜만에 앱에 들어갔는데 조만간 쇼핑하러 무신사 앱에 들어가 봐야겠어요! 😗