이렇게 친절한 필터
UXUI study 1주 차
디자이너로 n연차... 시간이 지나 강제로? 경력은 쌓이지만 그 경력에 따른 나의 지식이나 디자인 실력은 따라가지 못하고 있다고 스스로 생각을 많이 했다. 언젠가는 나도 이직을 한번 더 할지도 모르고 내 밑으로 누군가 들어와서 내가 알려줘야 하는 일이 생길 때, 나는 드러난 내 실력 앞에 부끄러워할지도 모른다는 생각에 소소하게 스터디를 시작하게 되었다. 지금은 나와 회사분 2명이서 시작하지만 관심이 있는 누구라면 온라인으로라도 좋으니 스터디 인원을 늘려나갔으면 좋겠다.
스터디의 주제로 나는 앱의 와우 포인트(이 앱이 갖고 있는 차별화된 기능, 이 앱만의 특징, 특화되게 남들보다 잘한 부분)를 찾아 분석하고 개선할 점이 있다면 의견도 내는 방향으로 가기로 했다. 어느 순간 매일 보던 앱들도 어떤 새롭고 독창적인 부분이 있을까 유심히 살펴보게 되고 다양한 앱들을 접해보고자 관심 없던 분야의 앱도 다운로드하여 보기 시작했다. 1주 차의 내용을 선정할 때 다소 어려움을 겪었지만 그래도 조만간 척척 찾아내지 않을까?
2000년대 이후 1인 가구가 많아지면서 싱글라이프로 살아가는 ‘횰로족(‘나 홀로’와 자신의 행복을 가장 중시하며 현재를 즐긴다는 것을 뜻한다.)의 등장으로 혼자 살더라도 집에 대한 인테리어의 관심이 높아졌다. 그에 따라 이케아뿐만 아니라 다양한 셀프 인테리어 어플과 온라인 인테리어 쇼핑 어플들이 출시되며 한창 인기에 떠올랐다.
1인 가구 중 바쁜 직장인이나, 조금 저렴한 가격과 다양한 브랜드의 가구를 비교해보고 싶은 사람들이 온라인 쇼핑을 많이 하면서 유명한 가구회사들도 오프라인의 쇼룸뿐만 아닌, 전용 온라인 쇼핑앱을 만들기 시작했다.
그중에서 내가 소개하고 싶은 앱은 한샘에서 만든 인테리어 쇼핑 앱 ‘한샘몰'이다. 오늘의 집, 이케아, 마켓 비 등 유명한 인테리어 앱들과 차별화된 이 앱에서 제가 소개하고 싶었던 기능은 바로 필터 기능이다.
다양한 종류의 쇼핑몰 앱에서 필터의 역할은 수많은 제품 중에서 브랜드, 가격대, 색상 등을 선별하여 내가 원하는 제품에 쉽고 빠르게 도달하게 도와주어 쇼핑의 편의성에 큰 역할을 해낸다. 하지만 대부분의 인테리어 앱에서는 주로 가격, 배송비 정도의 최소한의 필터가 갖추어야 할 항목만 갖고 있다.
이케아의 필터(왼)/오늘의 집 필터(오)가구는 한 번 구매하면 오래 쓰는 제품이고, 제품의 가격 또한 만만치 않다. 그리고 가구의 디자인과 기능, 실내 인테리어와의 조화, 나의 편의성 및 안락함까지 다양하고 심도 있게 고려할게 너무나도 많다. 그래서 많은 가구 제품 중 나와 꼭 아주 맞는 제품만을 찾아 골라주는 친절한 필터의 기능을 가진 한샘몰이 가구 쇼핑 앱 중에 가장 적합한 필터를 갖고 있었다.
메인화면/1차 카테고리 화면/2차 카테고리 화면 (왼쪽에서 오른쪽)메인화면을 보면 한샘몰은 12가지의 제품 카테고리를 가지고 있다. 그리고 각 제품 카테고리(1차)마다 세부 카테고리(2차)를 갖고 있다. 그리고 각 세부 카테고리 내용에 적합한 필터 내용을 담고 있다.
필터 적용 전(왼)/필터 적용 후(오)예시 화면으로 침실가구에서 침대를 선택했다. 필터를 선택해보면 11가지의 필터 종류들이 나오고, 맨 하단에 결과 보기를 보면 현재 이 침대 카테고리에서 13,560개의 제품을 볼 수 있다는 것을 볼 수 있다. 필터 기능을 적용하기 전에는 아주 많은 제품들을 하나씩 클릭해서 내가 원하는 형태 및 자재 등을 확인해야 했지만 필터 기능을 거치면 내가 원하는 조건에 부합하는 제품들이 몇 개가 있는지 바로 결과 보기의 숫자 값이 바뀌고 제품 리스트를 확인할 수 있다. 이 작업으로 인해 쉽고 수월하게 원하는 가구들을 찾을 수 있다.
수납장의 필터/소파의 필터/식기류의 필터(왼쪽에서 오른쪽)한샘몰의 필터는 각 제품의 특성에 맞는 필터 리스트를 보여준다. 큰 가구뿐만 아니라 식기 같은 작은 제품들까지 특성을 고려하여 구매할 수 있다. 이렇게 친절하게 제품 하나하나 고려하여 필터 리스트를 만들어줘서 다른 앱과 차별화를 두고, 소비자에게 빠르고 편리하게 목표 도달을 시켜주지만, 사실 uiux적으로 아쉬운 부분들은 눈에 보인다.
개선 인사이트
현재 앱의 분석
굿 포인트
1. '초기화' 버튼과 '결과 보기' 버튼의 크기와 색상을 다르게 주어 사용자에게 선택의 실수를 방지했다.
2. 실시간으로 필터 적용할 때마다 결과 보기 값이 바뀐다.
개선 포인트
1. 다른 항목을 클릭하는 순간 열려있던 항목이 닫히지 않아 일일이 다시 닫아줘야 한다.
2. 자재 등급 같은 익숙하지 않은 단어는 설명이 필요하다.
3. 필터가 전체 화면으로 덮일 경우, 어떤 내용을 필터링 중이었는지 표시해주어야 한다.
참고 앱
카테고리 속의 카테고리가 많다 보니 내가 어떤 카테고리 속에 있는지 명확하게 보여주는 것이 필요하다. 그래서 지그재그나 브랜디처럼 내가 필터링하고 있는 제품 화면을 보여주는 모달 형식을 적용해도 좋을 것 같다.
브랜디의 필터
지그재그의 필터색상 항목 중에 브라운 계열, 오크 계열, 메이플 계열, 월넛 계열과 같이 글자 만으로는 정확히 어떤 색상인지 판단하기 힘든 것들이 있다. 그래서 색에 대한 시각적인 지표를 보여주면 소비자가 선택하는데 훨씬 수월할 것이다. 또한 예시로 침대 헤드의 형태에 대한 선택 리스트에서도 기본 헤드, 데이베드, 무 헤드 등 소비자가 한 번에 어떤 형태인지 파악하기 힘든 리스트들도 있다. 그래서 이 부분은 픽토그램과 같은 아이콘으로 보여주는 것이 좋다.
1주 차 스터디 후 피드백을 받았다. 개선 인사이트에서 지그재그 필터를 제시했는데 오히려, 한샘몰에 적용할 때 걸림돌이 되었다. 한샘몰은 필터 항목이 많아서 한눈에 어떤 항목들이 있는지 볼 수가 없다. 또한 내가 선택한 필터 내용이 보이지 않아 다시 일일이 항목들을 탭 해서 확인해야 하는 수고로움이 크다. 이렇게 피드백을 받으니 생각보다 필터에 디자인을 할 때 고려해야 하는 항목들이 참 많은 것 같다. 시간이 되면 한샘 필터 부분을 리 디자인하는 것도 재밌을 것 같다.
