리스트 한 페이지 바꾸기
내 맘대로 UI
요즘 당근마켓이 내 삶을 바꾸고 있다. 아내가 집에 있는 물건들을 쇼핑백에 담아주면서 우리 동네 여기저기로 날 보내고 있다.
약속 장소에서 기다리고 있으면, 다양한 사람들이 와서 물건을 가져간다. 흔히 말하는 당근셔틀이 된 것이다. 거래하는 물건은 별 다른 것이 아니라, 작은 물건들인데, 아내는 물건을 매우 싸게 팔고 있는 듯했다. 거래를 하다가 보면, 주말농장에서 키운 감자나 양파를 받기도 한다.
그런데 거래를 끝나고 돌아올 때마다 아내는 당근마켓 앱에 대해서 이런저런 불평을 하기 시작했다. 아무래도 내가 비슷한 일을 해서인 듯하다. 어느 날은 나에게 디자인이 이상하다는 말을 했다.
"이 디자인은 이상해."
10년을 넘게 같이 지낸 아내가 앱이나 프로그램의 디자인에 대해서 불평을 하는 것이 처음이라, 깜짝 놀랐다. 그래서 디자인이 이상한 이유를 물어봤는데, 단순한 호불호의 내용이 아니었다.
디자인이 이상하다고? 어디가?
잘 만들었구만...현재의 당근마켓 디자인이다. 아내가 이상하다고 생각한 부분은 바로 상품의 리스트였다. 이 리스트의 디자인이 깔끔하지 않다는 것이다. 더 자세히 물어보니 정리되지 않은 느낌이라는 말을 들었다.
앱을 디자인하는 사람은 알겠지만, 하나의 앱을 분석할 때는 비슷한 사용자가 쓰는 앱의 그룹을 찾아서 비교해 봐야 한다. 우리 집의 경우는 '오늘의집', '쿠팡', '마켓컬리'에서 물건을 산다. 새 제품을 이 쇼핑몰에서 구입한 다음에 당근마켓으로 판매하는 흐름이 있다.
왜 이상하다고 느끼지?
다른 앱이랑 비교하면, 다르지만 다르다고 꼭 뛰어나다는 것은 아니다.아내가 '깔끔'하다고 말하는 디자인은 2열의 디자인으로 화면 좌우가 꽉 찬 레이아웃이었다. Pinterest처럼 2열로 되어 있는 레이아웃은 기본적으로 4개의 상품을 첫 화면에 보여준다. 당근마켓의 경우도 4개의 정도의 상품을 보여준다. 하지만, 더 작은 상품 이미지를 사용하고 있고, 사용자가 잘 이해하기 힘든 공간 활용이 된다.
여백인지, 공백인지 아는데 학습이 필요하다. 기본적인 상품정보의 상태를 아는데, 혼란을 줄 수 있다. 초기에 상품정보가 적을 때는 유효했는지 모르겠는데, 우리 동네의 경우에는 상품이 점점 많아지고 있다.
울퉁불퉁해지는 것만 문제는 아니었다.당근마켓의 기존 리스트 디자인을 정리해보았다. 당근마켓의 경우는 상품 설명이 최대 2줄로 들어가고 경우에 따라 하트 아이콘과 말풍선 아이콘을 표시하고, 해당 데이터가 없는 경우는 출력하지 않는다. 그래서 오른쪽의 오렌지 색상으로 표시한 부분의 영역이 일정하지 않다. 데이터가 없는 경우 표시하지 않는 아이디어는 좋은데, 비슷하게 사용하는 앱에 비해 덜 정리된 느낌을 받는다는 것을 알았다.
이 경우, 리스트와 카드 디자인으로 현재 당근마켓의 리스트를 분리해서 만들어볼 수 있는데, 아내의 경우는 2열 디자인을 이야기했기 때문에 디자인을 변경해 보았다.
자주 쓰는 다른 앱처럼 바꿔보기,
쇼핑 앱처럼~
상품 이미지를 더 크게 표시할 수 있고, 대략 6개의 상품을 한 화면에 표시할 수 있다. 하트 아이콘과 말풍선 아이콘의 표시 형태와 상품에 대한 텍스트도 2줄까지 표시했다.
아내의 경우, 상품의 텍스트를 보기보다는 쭉 상품을 훑어 본다고 했다. 상품의 사진이 상품의 설명보다 중요하기 때문이라는 말을 덧붙였다. 중고품의 질과 상태를 확인하려면, 상품 이미지가 중요할 것 같다는 생각이 들었다.
리스트를 바꾸기 힘든 문제가 있었네.
그리고 아내가 이상하다고 생각한 점이 하나 더 있었는데, 바로 '상품의 질'을 묻는 질문이었다. 유튜브의 경우, 피드의 영상 콘텐츠를 제거하면, 왜 제거하냐고 묻는 UI가 있다. 당근마켓은 좀 더 적극적으로 특정 중고품이 팔만한 물건인지 물어본다.
답변을 하기로 하면, 팝업이 하나 뜨면서, 투표를 할 수 있다.
아내는 상품 피드를 브라우징 하는 사용자다. 투표를 한 번 할 때마다 브라우징이 멈추게 된다. 그래서 유튜브의 투표처럼, 모달이 없는 투표 스타일을 적용했다. 그리고 아내의 불만은 투표를 했을 때, 시스템이 어떻게 처리하는지를 궁금해했다.
물건을 파는 사람에게 불이익이 가는지, 아니면 앞으로 이런 상품을 덜 보게 되는지 궁금해했다. 팝업까지 띄워서 물어보는데, 그 이후 처리에 대한 부분은 안내가 없었다. 그래서 유튜브가 그러하듯 안내 문구와 재투표 절차를 추가해 보았다.
원래 리스트 형식에서는 이 기능이 맥락이 있다고 생각해서 2열로 바꿀 수 없지는 않았을까? 하는 생각이 좀 들었다.
자주 쓰는 다른 앱처럼 바꿔보기,
메시징 앱처럼~
사용자가 흔히 쓰는 기능이지만, 다른 분야의 앱도 있으면 좋은 기능또 하나의 불만은 상품을 쭉 보는데, 가끔 맨 위로 이동한다는 것이다. 화면의 상단을 탭하거나 제스쳐를 하다가 실수 할 수도 있다. 그런 일이 일어나면, 어디까지 봤는지 다시 찾아 내려가기 힘들다는 것이었다. 트위터에는 이런 말이 있다. 나중에 맨션 하거나 리트윗하려는 트윗은 꼭 다시 찾을 수 없다.
최신 상품이 리스트 상단에 추가되기 때문에, 내가 본 곳까지 다시 내려가는 기능과 다시 최신 물품을 보는 것을 카카오톡이나 슬랙처럼 표시하면 좋겠다는 생각이 들었다.
넷플릭스처럼 굳이 사지 않더라도 좋은 물건이 나왔는지 확인하기 위해(실제로 잘 사지 않지만) 자주 본다는 말을 들었다.
아내에게 왜 검색을 하지 않냐고 물었다가, 좋은 물건을 사는 거지, 특정 물품을 구매하려는 것이 아니라는 말을 들었다. 검색을 하면, 찾을 수는 있지만, 리스트의 특정 부분으로 이동할 수는 없다는 설명이었다.
들어보니 맞는 말이었다.
뭔가 ‘발견’하는 것이 더 중요한 것이다.
이런저런 대화를 종합해서
좀 바꿔본다.
캐릭터는 내 취향으로...개인적인 스타일로 UI를 다시 배치했다.
1. 상단에 고정되는 영역을 줄이고, 상품을 최대한 보여준다.
2. 상단에 1행은 꼭 상품이 표시되도록 한다.
3. 검색을 잘 사용하지 않을 수 있으니 특정 카테고리에 대한 검색을 유도하는 검색창을 아이콘이 아니라 눈에 보이게 배치한다. 이 경우, 필터를 아이콘으로 표시하는 것보다, 쉬운 단어로 재검색, 재정렬을 유도하는 것이 좋을 수 있다는 생각이 들었다.
4. 상단에 고정되는 오른쪽 상단 영역은 알림에 대한 기능으로 그룹핑했다.
5. 캐릭터가 가진 색상의 대비가 낮아서, 색과 라인을 변경했다.
의외의 부분이 하나 있는데, 당근마켓의 경우, 공지사항 부분에 대한 개선이 많이 필요한 것 같았다. 동네 커뮤니티는 게시판이 생각보다 중요한 역할을 하지 않을까 하는 생각이 들었다. 엘리베이터나 현관에 있는 게시판이 이웃 간의 사소한 정을 느끼게 해주는 경험을 많이 했다.
확장을 한다면?
스크린이 하나만 있으니까 왠지 심심해 보여서...당근마켓의 경우, 중고거래도 하고, 동네 홍보도 하려는 것 같은데, 이 메뉴가 독특하다는 생각이 들었다. 하단에서 팝업 되는 시트를 활용하고 있는데, 현재의 디자인의 경우, 중고거래와 동네 홍보의 스타일이 유사하다.
내가 보기에 굳이 나눈다면, C2C와 B2C 같은 느낌이라 분리가 필요하다는 생각이 들었다.
의도는 모르겠지만, 성격이 다르므로, 색으로 구분했다.
간단하고 명확하게 만들어서 큰 성과를 얻은 앱 같은데, 앱이 중고거래를 하는지, 커뮤니티를 만들고 싶은지, 광고 플랫폼이 되려는지 되고 싶은 것이 많다는 생각이 들었다.
마무리를 하면서
페이스북에서도 당근마켓이 크게 성장한다고 해서 자주 보이기 때문에 궁금해서 앱을 살펴보게 되었다. 중고거래를 좋아하지 않아서 당근셔틀이 내 역할이지만, 아이가 있거나 기혼 가정 대상으로 꽤 좋은 서비스다. 안 좋은 경험을 한 사람도 많다고 하는데, 우리 동네의 경우는 대개의 거래가 모두 잘 끝났다.
당근마켓에 간단한 지도 서비스를 좀 넣는 것도 좋겠다.(지도 관련 서비스를 잠시 한 적이 있어서) 대강 위치만 지도에 찍혀도 거래가 편할 것 같다. 해당 위치에 도착했다고 일일이 채팅을 해야 하는데, 구구절절한 이야기 없이 도착했다 정도만 앱에서 알려줘도 좋을 것 같다.
