UI/UX 분석하기 01. '위시버킷'은 왜 이렇게 구성되어있을까?

분석 챌린지

시작하겠습니다!

 

서비스 기획..! 무엇부터 시작해야 할지 막막해서 여러 가지를 알아보다가 챌린지 소식을 듣고 'UX/UI분석 챌린지'에 참가하기로 했다! 혼자서 하려니 동기부여가 부족해서 챌린지를 시작했는데, 꾸준히 참여해서 좋은 인사이트를 쌓았으면 좋겠다. 이번주는 조금 일정이 있어서 가벼운 마음으로 자주 사용하는 앱인 위시버킷을 주제로 선정하여 '왜 이렇게 UI를 구성했는지' 살펴보겠다!

 

*완전 추측이 난무하는 글입니다... 참고자료로 사용하는걸 추천하지 않습니다!

 

---

 

흩어진 위시리스트를 한 곳에

위시버킷을 소개합니다

 

위시버킷(wishbucket)은 여기저기 흩어져있는 나의 위시템들을 한 바구니에 모아둘 수 있는 서비스이다.

 

쇼핑몰에서 즐겨찾기 해둔 옷, 소품샵에서 발견한 디자인 소품...

'내가 갖고 싶은 물건들을 한곳에서 볼 수는 없을까' 고민했던 적이 있을 것이다. 특히 인테리어 소품샵들은 쇼핑몰마다 운영하는 홈페이지를 가지고 있어서 자체 즐겨찾기 기능이 없는 곳이 대부분이다. 이런 경우에는 따로 링크를 모아둬야 했는데, 그게 여간 불편한게 아니었다. 

 

이러한 불편함을 해소하고자 2022년 2월 위시버킷이 등장했다! 👏

런칭 2개월 만에 애플 스토어 오늘의 앱에 선정되고 트워터같은 각종 커뮤니티에서 화제가 된 것을 보면 확실히 유저들의 불편함을 꼬집은 매력적인 서비스라고 생각한다.

 

위시버킷은 링크를 기반으로 위시 아이템들을 모아두고 아이템의 가격을 비교할 수 있으며 앱 내에서 바로 결제까지 할 수 있다. 또한 유저들끼리 구매 찬반투표나 선택투표를 할 수 있는 커뮤니티 공간도 있다. 위시버킷 초기에는 인터페이스가 매우 간단하고 최소한의 기능들만 있어서 매우 컴팩트하였는데 최근 여러번의 업데이트를 거치면서 스토어 메뉴도 생기고 검색필터를 추가하는 등 다양한 개선을 시도하고있다.

 

1. 위시버킷 UI 살펴보기

(1) 이미지 중심의 피드형

위시버킷은 이미지 중심 피드형이다. 

어떤 위시템을 저장해 뒀는지 한눈에 볼 수 있어 위시버킷에 적합한 형식이다. 다양한 디자인 소품들을 좋아하는 사람들에게 익숙한 핀터레스트가 떠오르는 둥근 UI로 어딘가 익숙하고 부드러운 인상을 주며 여러가지 상품을 판매하는 '편집샵' 느낌이 강하게 났다. 카테고리 구성도 '위시템/탐색/알람/설정'으로 매우 담백했다.

 

(2) 동글동글 둥근 모서리의 UI

위시버킷은 모서리를 허용하지 않는 동글동글한 디자인으로 아기자기한 느낌을 더욱 강조하고 있다.

이는 디자인 요소이기도 하지만 심리적 관점에서 둥근 모서리가 각진 모서리보다 유저들에게 정서적인 안정감을 주는 효과가 있다고 한다. 또한 보통 상품의 이미지는 사각형 내 가운데에 배치되어 있는데 둥근 모서리는 시선을 가장자리로 분산시키지 않고 4개의 면을 멈춤 없이 스캔할 수 있어 인지효율이 좋아 컨텐츠를 빠르게 파악할 수 있다. 또한 UI 관점에서 보면 각각 연계성이 적은 상품들이 좁은 화면에 배치되어야 하기 때문에 둥근 모서리는 각 상품을 '여백'으로 구분하고 '공간성'을 보장해 주는 역할도 한다. 

🧩  둥근 모서리 UI의 효과 (하단 출처 참고)
- 각진 모서리에 비해 정서적 안정감을 준다.
- 둥근 모서리는 인지효율이 좋다.
- 둥근 모서리가 여백을 만들어 공간성(space)을 보장해 준다.
- 둥근 모서리는 시각적으로 다른 요소들과 구분시키며, 컨텐츠 간 연관성이 적을 경우 컨텐츠 구분이 쉽다.

 

특이한 점은 상단 영역과 아이템 리스트 영역을 흑백의 둥근 모서리의 카드 형태로 나눈 점이다. 이렇게 영역을 명확하게 나눠두어 각 영역별로 어떤 정보를 담아두고 있는지 쉽게 인지할 수 있었다.

 

2. 위시버킷 기능 살펴보기

(1) 친절한 온보딩, 링크로 위시템 담기

위시버킷은 매우 친절하게 핵심 기능인 위시 저장법을 알려주고 있다.기본 방법, 쉽게 등록할 수 있는 방법을 단계적으로 알려주고 마지막에는 유저가 실습할 수 있게 샘플링크를 띄워 이해도를 높였다. 아이템을 등록하는 방법은 메인페이지 외에도 공식 게시판에서도 볼 수 있다.

 

🤔 왜 그렇게 했을까?

위시버킷은 유저가 인터넷으로 아이템을 탐색하다가 담고 싶은 아이템의 링크를 직접 복사하여 앱에 등록하는 방식을 사용한다. 사실 앱에 아이템을 등록하는 과정 자체만 고려해 보면 다소 복잡하게 느껴질 수 있다. 유저가 인터넷으로 구경하다가 링크를 복사하고 다시 앱에 진입해 등록하는 방식이기 때문에 제대로 방법을 알려주지 않으면 이탈이 발생하기 쉬운 부분이다. 이를 해결하고 앱 사용을 권장하기 위해 여러가지 방법을 제시하고 실제로 해볼 수 있는 친절한 방식을 선택했다.

 

👏 좋았던 점

위에도 언급했지만 유저가 직접 실습할 수 있게 샘플링크를 제공하는 부분이 인상 깊었다. 유저에게 가이드를 주는 동시에 수익화 영역으로 활용하여 유저들의 이용 맥락에 벗어나지 않고 자연스럽게 제품을 노출하였다. 물론 이러한 방식은 유저가 원치 않은 아이템일 경우 거부감을 느낄 수 있으며 리스트에서 아이템을 삭제해야 하는 번거로움이 존재하겠지만 비즈니스 관점에서 생각해 보면 크리티컬하게 유저에게 불편함을 주지 않으면서도 앱을 직접 경험할 수 있는 기회를 주는 괜찮은 방식이라고 생각했다.

 

 

(2) 위시템 버킷, 위시템을 폴더링하고 검색하고 공유하기

위시버킷의 핵심 기능인 위시템 부분은 내가 저장한 위시템들을 모두 볼 수 있는 영역이다.

전체 위시템을 확인할 수 있고 위시템을 필터링하여 검색할 수 있으며 삭제 혹은 폴더에 넣는 등의 수정을 할 수 있는 유저의 공간이다.

 

🤔 왜 그렇게 했을까?

링크 공유 혹은 유저들이 기존에 등록한 아이템들을 내 버킷에 저장하면 메인페이지의 '내 위시템 전체보기'에서 전체 아이템들을 확인할 수 있다. 앱 내 상품리스트들은 한 행 당 2개의 아이템이 노출되도록 배치되어 있는데, 버킷에서는 3개의 아이템들이 노출되어 있다. 위시에 이미 담은 상품들의 경우 유저들이 구매할 확률이 담지 않은 아이템보다 높다고 생각되는데 이러한 이유로 최대한 한눈에 많은 컨텐츠들을 노출할 수 있는 레이아웃을 잡은 것이 아닌가 예측했다.

 

👏 좋았던 점

내가 모아둔 버킷 내에서 필터링과 검색이 가능하다는 부분이었다. 위시템들이 많아지면 정리와 탐색이 어려워지는데 전체 아이템뿐 아니라 내 버킷에서도 저장한 아이템을 검색하고 필터링할 수 있어 아이템 탐색이 편리했다.

 

또 특이했던 기능은 위시템 콜라쥬 기능이다. 위시템 콜라쥬 기능으로 위시템 리스트를 이미지형식으로 저장 및 SNS에 공유할 수 있다. 요즘 '취향'으로 본인의 정체성을 정의하고 취향을 전시하고자 하는 트렌드가 반영되어 블로그나 트위터에 위시템을 공유하는 모습을 자주 볼 수 있다. 해당 기능은 취향을 공유하길 원하는 니즈 트렌드를 잘 파악한 기능이라고 생각한다.

 

 

(3) 커뮤니티(다른 유저 위시템 보기, 위시타래, 투표)

위시버킷에는 유저들끼리 소통을 할 수 있는 커뮤니티 영역이 있다.

 

🤔 왜 그렇게 했을까?

서비스 주요 목적이 '위시템 저장'으로 유저들의 앱 사용 목적이 뚜렷한 편이라 해당 기능만으로는 유저들의 체류시간을 늘리기 어렵기 때문에 커뮤니티 환경 구축으로 문제점을 해결하고자 한 것 같다. 매력적인 커뮤니티를 만들어 유저가 앱에 머무는 시간을 늘리고 리텐션을 높이는데, 이를 달성하기 위해 딱딱한 분위기가 아닌, 언제든지 방문하여 유저들끼리 편안하게 소통할 수 있는 공간을 지향하고 있다.

 

며칠 전까지만 해도 유저끼리 직접적으로 의견을 내고 소통할 공간이 부족했었는데 최근 '위시타래'라는 새로운 소통공간을 추가하였다. 마치 트위터의 타임라인처럼 원하는 템들을 타래로 엮을 수 있는 공간이다. 유저들은 다른 유저의 타래를 저장하거나 댓글을 담기거나 좋아요를 누르면서 소통할 수 있다. 현재 위시버킷은 커뮤니티를 활성화하는 것에 집중하고 있는 듯했다.

 

👏 좋았던 점

유저들은 다른 사람이 저장한 위시템들을 확인하여 본인의 위시템에 저장할 수 있고 익명투표를 열어 유저들의 의견을 듣고 구매를 결정할 수도 있다. '이거 살까 말까?', '둘 중에 골라줘' 두 가지 유형의 투표를 열 수 있는데 투표 질문을 작성할 때 '반모(반말모드)'라고 표기하여 유저들끼리 마치 친구처럼 편하게 소통할 수 있게 가이드하고 있다는 점은 또 다른 재미요소였다.

 

 

(4) 유저가 만드는 트렌드 보고서, 30분 간격으로 변경되는 랭킹

위시버킷의 또 다른 매력은 다양한 랭킹 시스템으로 인해 유저들의 트렌드를 바로 확인할 수 있다는 점이다.

전체 아이템 랭킹과 스토어 랭킹, 그 스토어 내 랭킹으로 다양한 랭킹정보를 제공하고 있다.

 

🤔 왜 그렇게 했을까?

유저들의 취향을 적극 반영한 페이지로 어떤 아이템을 담아야 할지 모르는 유저들에게 가이드를 제공하는 역할이자 구매 욕구가 들만한 아이템을 제안하는 페이지이다. 30분 간격의 랭킹 변경이 특징인데, '취향'의 공간은 빠른 트렌드의 변화를 동반할 수밖에 없기 때문에 잦은 변경으로 트렌디한 서비스라는 인식을 보여주기 위함이라고 생각한다.

 

트렌드 변화가 빠른 무신사가 30분 간격으로 인기 순위를 갱신하는데 위시버킷 또한 트렌드에 민감한 성격의 서비스이기 때문에 30분 간격을 채택했을 것이다. 더 빠르게 갱신할 순 없을까 생각해 보았는데 현재 위시버킷의 30분 간격의 순위도 상단 아이템들은 큰 변동을 보이지 않고 있어 적당한 간격이라 생각한다. 너무 빈번한 변동은 유저들에게 혼란을 주기 때문에 무리해서 리얼타임을 적용할 필요가 없을 것 같다.

 

👏 좋았던 점

유저의 입장에서는 잘 몰랐던 아이템과 브랜드들을 알 수 있게 되고 비슷한 연령대로 생각되는 타깃 유저들 사이에서 동질감을 느낄 수 있는 부분이고 무엇보다 트렌드를 파악할 수 있다는 점이 제일 좋았다. 최근 슬램덩크의 인기로 '농놀'이 트렌드가 되면서 실제로 위시버킷의 순위에도 농구 관련 아이템들이 올라왔고 인스타에서 자주보이는 '힙'한 디자인의의 소품들도 자주 등장했다. 

서비스의 입장에서는 위에 언급한 대로 유저들에게 여러가지 아이템과 브랜드를 노출할 수 있는 기회가 되고, 유저들에게 '이 앱은 나랑 취향이 비슷한 사람이 많구나, 트렌드에 잘 맞네'와 같은 인상을 심어주어 크게 보면 유저 충성도 또한 높일 수 있는 부분이 될 것이다.

 

---

마치며

 

아직 앱 초기단계라 업데이트가 잦은 편이고 지속적으로 개선을 하고 있는 서비스가 위시버킷이다. 전반적으로 디자인 자체가 나에게 매력적이고, 취향에 맞는 아이템들이 많아 자주 자용하고 있으나, '유저들의 취향'에 초점이 맞춰질 수밖에 없는 서비스이기 때문에 주요 유저가 누구인지에 따라 앱 아이템들이 세팅될 수밖에 없다는 한계점이 있다고 생각한다. 이러한 부분 또한 커뮤니티의 활성과로 다양한 취향의 유저가 유입된다면 어느정도 해결할 수 있지 않을까 기대한다.

 

위시버킷은 정말 거의 매일 사용하는 앱이라 가볍게 시작한 글이었는데 생각보다 너무 구구절절.. 장황해져서 놀랐다... 이게 글쓰기인가...

신규 앱이기 때문에 업데이트마다 어느 방향으로 개선했는지, 왜 그렇게 개선했는지 지속적으로 앱을 관찰한다면 위시버킷 서비스와 함께 나도 성장해갈 수 있을 거라 생각한다.

 

 

---

참고자료 출처

 

1. '본다'라는 행동에 대한 잡담 2

https://ditoday.com/%EB%B3%B8%EB%8B%A4%EB%9D%BC%EB%8A%94-%ED%96%89%EB%8F%99%EC%97%90-%EB%8C%80%ED%95%9C-%EC%9E%A1%EB%8B%B4-%E2%91%A1/

‘본다’라는 행동에 대한 잡담 ② - DIGITAL iNSIGHT 디지털 인사이트

2. 버튼의 둥근 모서리에 대한 이해

https://brunch.co.kr/@blackindigo-red/37

버튼의 둥근 모서리에 대한 이해

 

3.ZEN of UX.08 - 모서리가 둥근 사각형은 왜 사용하는가.

https://www.panopt.net/69

ZEN of UX. 08 - 모서리가 둥근 사각형은 왜 사용하는가.