배달의민족이 필터 디자인을 변경한 이유
#멜리즈-검색
#쿠팡이츠-알림
#페이북-홈
#배달의민족-필터
1. 쿠팡이츠가 알림 설정 안내를 띄우는 방법
알림 설정은 서비스에게 회원가입만큼 중요한 과정 중 하나입니다. 설정을 완료한 사용자에게 서비스가 원하는, 사용자에게 꼭 필요하다고 느낄 내용을 전달할 수 있기 때문입니다. 문제는 알림을 언제, 어떤 방법으로 안내하고 설정하게 할 것인지?에 대한 고민인데요. 여전히 많은 서비스는 맥락을 바탕으로 하지 않고 가입 후 등의 상황에서 알림 설정 안내를 제공합니다.
또 하나 아쉽게 느껴졌던 건, 알림을 왜 설정해야 하는지에 대한 이유입니다. 전체 화면을 할애할 수 없기에 보통 팝업 형태로 알림 설정을 유도하게 되는데, 구체적이고 명확한 내용이 포함되지 않는다면 사용자 입장에서는 당장 어떤 혜택이 있는지 등 설정을 해야 하는 이유를 한 번에 알아차리기 어렵습니다.
즉, 알림 설정을 이끌어내기 위해서는 사용자가 납득할만한 상황이나 시점을 확인하고 적합한 내용으로 구성해야 함을 의미하는데요. 얼마 전, 쿠팡이츠를 다운로드하여 신규가입을 하며 위 두 가지 조건에 잘 맞는 과정을 경험할 수 있었습니다.
쿠팡이츠는 신규 가입자에게 첫 주문에 쓸 수 있는 쿠폰을 제공합니다. 가입 후 관련 안내를 확인할 수 있어요. 쿠폰 확인 및 다운로드가 가능한 화면으로 이동하면 쿠폰 관련 자세한 내용을 확인할 수 있습니다. 그리고 실제 쿠폰을 다운로드하면 알림 설정을 위한 팝업을 볼 수 있어요. 실제 쿠폰을 다운로드한 시점에 쿠폰과 혜택을 받을 수 있다는 안내를 이어 제공하는 방법입니다.
안내에는 ‘알림 설정’ = ‘쿠폰과 혜택 제공’이라는 간단하지만 명확한 이유가 포함되어 있습니다. 설정을 해제하는 방법도 포함되어 있어요. 알림 설정을 위한 버튼에도 ‘해택 알림 받기’라는, 혜택이라는 표현이 다시 사용됩니다. 쿠폰을 처음 받는 그 경험을, 앞으로도 계속 경험할 수 있다는 것을 잘 보여주는 방법이라고 생각합니다.
만약, 쿠팡이츠가 회원가입과 동시에 알림 설정 안내를 제공했다면 어땠을까요? 쿠폰의 종류나 구체적인 혜택을 모르는 상태에서 알림 설정을 주저할 가능성이 더 높지 않을까 싶네요.
2. 페이북이 메인 화면과 카드 선택 UI를 변경한 이유
페이북이 얼마 전, 홈 화면 UI를 변경했어요. 기존 화면은 가장 먼저 주요 기능 안내나 광고 등이 포함된 영역을 볼 수 있었습니다. 배너는 서비스 입장에서 중요한 공간이지만, 핵심 기능 사용을 방해하지 않아야 하는데요. 기존에는 배너에 먼저 시선이 가서 카드와 카드 이용 내역을 보기 힘들었습니다. 변경 후에는 배너가 빠진 덕분에 카드 아래 위치한 카드 이용 내역도 관련된 정보의 하나로 쉽게 볼 수 있네요.
현재 선택한 카드와 결제로 이어지는 UI도 기존 대비 홈 화면의 전반적인 모습과 잘 어울려요. 기존에는 테두리를 조금 다른 컬러로 적용해 강조했는데, 이제는 카드 이용내역이나 소비 분석 카드 UI와 유사한 룩을 갖게 되었습니다. 이런 일관성 있는 구성은 각기 다른 내용을 구분하는 데 더 많은 도움을 줄 수 있다고 생각해요.
같은 맥락에서 기존에는 결제 버튼을 더 강조하기 위한 선택을 했는데, 이제는 결제 버튼과 카드 이용 내역 아래 위치한 페이북 머니, 이용 한도, 카드 명세서 등의 메뉴도 톤이 잘 맞아떨어지는 모습입니다.
또 이번 달 내 또래는~의 카드 UI 역시 기존에는 텍스트가 더 강조되어 어떤 식으로 분석 내용이 제공되는지 파악하기 어려웠는데 지금은 사이즈를 늘리고 ‘내 소비와 비교해보기’ 버튼을 추가해 더 적극적으로 안내하고 있네요. 역할 자체가 이 기능 한 번 써봐-에 맞춰져 있기에 기능 안내와 버튼을 함께 활용하는 편이 더 효과적이지 않을까 싶습니다.
3. 배달의민족이 필터 디자인을 변경한 이유
배달의민족 필터와 정렬 기능은 배달 카테고리에 따른 활용이 가능해요. 예를 들어 피자를 선택했다면, 피자 주문이 가능한 매장 리스트를 확인할 수 있고, 기본순 등의 정렬 조건을 바탕으로 쿠폰 / 1인분 / 배달팁 범위 / 별점 등을 선택할 수 있습니다. 리뷰가 많은 가게로 정렬 조건을 바꾼 뒤, 쿠폰 사용이 가능한 매장을 다시 추리는 방법입니다.
다만, 기존에는 정렬과 필터가 섞여 있고 각 내용 간 구분이 쉽지 않았는데요. 필터를 대표하는 이모지가 적용되어 있다는 건 좋았지만, 배달 카테고리와 텍스트 크기가 다르지 않고, 정렬과 필터 간 구분이 따로 적용되어 있지 않아 원하는 조건을 빠르게 찾아 적용하기 어려웠어요.
이 필터와 정렬 기능이 얼마 전 변경되었습니다. 가장 큰 변화는 필터와 정렬에 해당하는 텍스트 사이즈가 카테고리보다 더 커졌다는 점입니다. 현재 선택한 카테고리 보다 필터나 정렬이 더 큼직하게 적용되었어요. 메뉴는 이미 사용자가 선택한 상황이니, 다른 메뉴 카테고리 확인보다는 원하는 조건의 가게(매장) 선택이 더 중요하다는 판단 때문이 아닐까 싶습니다.
그리고 기존에는 정렬 조건이나 필터 이름 등을 텍스트와 이모지로 구분했는데 이제 각 내용을 쉽게 구분할 수 있는 디자인이 적용되었습니다. 이전보다 한 뭉치로 빠르게 읽을 수 있어 더 좋네요. 개인적으로는 폰트 사이즈를 키운 게 사용성에도 영향을 주지 않을까 생각합니다.
4. 멜리즈가 브랜드 검색에 사용자 참여를 유도하는 방법
멜리즈는 전 세계 브랜드와 상품을 검색할 수 있는 서비스로 등록된 ‘브랜드’가 정말 중요합니다. 등록된 브랜드가 많을수록 사용자가 원하는 브랜드를 빠르게 찾을 수 있기 때문입니다. 멜리즈는 브랜드를 더 많이 확보하기 위해 최근 눈에 띄는 이벤트 하나를 시작했는데요. 사용자로 하여금 브랜드 검색을 자연스레 경험하게 하고, 없는 경우 원하는 브랜드를 직접 등록하게 하는 방법입니다.
눈에 띄는 건, 이벤트에 참여하는 과정입니다. 이벤트 안내 팝업을 따라 별도 화면으로 이동하면 이벤트와 관련된 타이틀과 주요 내용을 먼저 확인할 수 있습니다. 멜리즈라는 서비스가 핵심으로 생각하는 것은 무엇이며, 사용자가 어떻게 참여할 수 있는지에 대한 내용이 포함되어 있습니다. 그리고 바로 브랜드를 검색할 수 있는 검색창이 제공되는데요. 사용자 입장에서는 내가 원하는 브랜드가 있을까? 에 대한 답을 검색으로 먼저 확인할 수 있습니다. 이를 통해 자연스레 브랜드 검색이 무엇인지 경험할 수 있어요.
또 이벤트 참여 방법 및 당첨자 발표 텍스트 링크를 통해 별도 팝업을 제공하고 있는데요. 팝업을 통해 구체적으로 어떻게 브랜드를 요청할 수 있는지 알 수 있습니다. 그리고 당첨자 발표에 대한 안내도 포함되어 있는데, 이 내용은 알림 설정과 엮어 제공하는 모습입니다. 푸시 알림을 통해 안내 메시지를 발송한다는 내용과 푸시 알림 켜러가기 버튼이 제공됩니다. 참여 방법까지 확인한 사용자라면 참여할 가능성이 높다는 판단이 있지 않았을까 싶네요.
브랜드 검색을 확인할 수 있는 화면에는 이벤트 참여가 가능한 ‘브랜드 추가 요청하기’ 버튼이 있습니다. 사용자가 검색한 키워드를 포함하고 있는데, 검색 결과가 있음에도 버튼을 같이 보여주는 건 조금 어색하게 느껴지기도 하네요. 키워드 일부가 포함된 다른 브랜드를 고려했을 가능성도 있어 보입니다.
한성규님의 ‘지금 써보러 갑니다‘에 게재된 글을 모비인사이드가 한 번 더 소개합니다.
