2025.11.16 - [프로덕트 서비스] - [UX/UI] '땡겨요' UX/UI 개선해보기!(1)- 배달앱 UX/UI 비교
📍'땡겨요' 앱을 뜯어보자!
(1) 홈 화면
홈 화면을 뜯어보니 여러 배달 어플과 비슷하게 구성되어 있었다.
검색바 - 음식 카테고리 - 맛집 카테고리 - 배너 - 할인 이벤트 - 브랜드 (오늘 땡길만한 브랜드) - 무료배달 리스트 (배달비가 부담된다면) - 새로 들어온 맛집 - 우리 동네 맛집 (정렬) 순으로 되어 있었다.
(2) 휴게소?!?!
재미있었던 카테고리는 '휴게소' 카테고리..
전국의 맛집을 휴게소도 포함시켜서 더욱 다양한 선택지를 제공한다는 것이 재미있었다.
휴게소도 이제는 맛집 중 하나로 생각이 든다!
(3) 일관성 있는 빈 화면 UI
일관성 있는 UI 와 살짝살짝 변화를 주며 빈 화면을 재치있게 표현하였다.
구매와 장바구니와 관련된 빈 화면은 캐릭터가 카트를 끌고 있는 화면으로,
맛스타와, 가게 등의 콘텐츠와 관련된 빈 화면은 캐릭터가 울고 있는 화면으로 보여주어 유저의 행동을 촉진한다.
또한 '띱', '떵그러니', '띠로리' 등의 멘트를 사용하며
일관성있는 브랜딩을 보여준다.
여기까지만봐도...
'땡겨요'가 여러 멘트와 UI, '땡~겨서 받는 혜택' 등 굉장히 브랜딩에 신경을 많이 쓴 느낌을 받았다.
(4) '땡~겨보면' 땡겨요 혜택 등장!
홈 화면에 접속하면 상단에 '여기를 땡겨보세요' 라는 배너가 나오는 것을 알 수 있었다.
(이벤트성으로 하는건진 모르겠지만)
배너를 아래로 당겨보면
이벤트 혜택이 나오는 것을 알 수 있었다.
고객에게 리워드 제공을 '땡겨요' 에 맞는 이름처럼 땡~겨서 받는 혜택이라니
굉장히 재미있고 신선하게 느껴졌다.
2. 혜택을 이렇게 바꿔보면 어떨까?
물론 위의 상단을 스윽 땡~겨서 혜택이 등장하는 것은 신선하고 브랜드에 맞게 재미있게 다가왔으나,
유저 편의성 관점에서 생각해보자.
스티븐 후버는 일반인의 모바일 기기 사용에 대한 자신의 연구에서,
응답자의 49%가 스마트폰을 사용할 때 한 손으로 잡고 엄지 하나 만을 사용한다고 밝혔다.
우리가 스마트폰을 사용할 때 엄지손가락을 사용하게 되면,
위의 그림과 같이 Thumb Zone이 생기게 된다.
녹색이 엄지손가락이 닿기 쉬운 위치이고, 붉은색으로 갈 수록 엄지손가락이 닿기 어려운 위치이다.
스마트폰의 크기가 커질 수록 그 경계가 더욱 극명해진다!.
물론 두 손으로 스마트폰을 사용하는 사용자들이 상대적으로 영역에 구애 받지 않는다고 할 때,
Thumb Zone을 고려해야 대부분의 사용자들을 고려한 서비스를 제공할 수 있다.
이 UX 관점을 생각하여 혜택을 다시 생각해보자.
홈 화면을 Thumb zone 위에 올려보았는데 땡겨야 하는 배너 영역이
닿기 어려운 붉은색 영역에 걸쳐진 것을 알 수 있었다.
즉, 양손을 자유롭게 사용하는 사용자들을 제외하고
엄지손가락만을 이용하여 핸드폰을 사용하는 유저들에게는 그닥 좋지 않게 편의성을 제공하는 혜택이라는 것을 알 수 있었다.
👀 ✍🏻 흠... 혜택을 제공할 때 옆으로 땡~기면 어떨까?
간단하게 배치하여 살짝 웃기게 보이긴 하지만,
포인트는 '옆'에다 두는 것이다. 사용자들의 엄지가 닿기 쉬운 곳에 혜택을 제공할 수 있는 배너를 두어
사용자들이 더욱 편하게 댕기고 혜택을 받을 수 있게끔 하는 것이다!
3. 나가기 버튼이 강조되지 않게 바꿔보자!
땡겨요(1) 시리즈에 작성한 내용처럼,
[UX/UI] '땡겨요' UX/UI 개선해보기!(1)- 배달앱 UX/UI 비교
땡겨요 는 신한은행이 개발 및 운영하는 대한민국의 배달앱이다. 수도권을 중심으로 점차 확대, 현재는 전국으로 확산하여 운영중이다.소상공인과의 상생을 목적으로 하는 사업으로 입점료, 광
hye2story.tistory.com
땡겨요는 나가기 버튼에 강조되어 있어
유저가 실수로 백버튼을 눌렀던 것이더라도 확인을 누르고 싶게 되어 있어
결국 주문을 취소하게끔 만들어진다.
우리의 목적은 주문을 취소하지 않게끔 만들어야 하기 때문에
주문을 취소하겠습니까? > 확인을 강조하지 않고
>지금 주문하기< 로 만들어보자!
바로 이렇게!
주문하기 버튼을 강조하여
유저가 이탈하지 않고, (ㅎㅎ실수로라도..) 주문하게끔 만들 수 있다!
4. 유저를 헷갈리게 만들지 말자!
기본순으로 되어 있는 것은 좋다. 하지만 어떤 기본순?
알 방법이 없어 유저는 답답하기만 하다.
따라서 우리는 이것을 정확히 명시하는 것으로 바꿔보자!
아이콘을 두고 아이콘을 눌렀을 때 어떤 기준으로 유저에게 보이고 있는지 명확히 제공해주는 기준을 만들어주자.
유저는 헷갈릴 이유가 없고
이런 결과를 보고 있는 것을 납득하게 된다.
5. 빈 화면 알겠어, 그리고 그 다음은.... 뭘하지?
슬쩍 봐보니..
빈 화면을 보여주는 UI 에서 단순히 <빈 화면만!!!!> 보여주는 UI 들이 있었다는 것을 알 수 있었다.
다시 배민과 쿠팡이츠를 보자.
주문과 직접적으로 관련이 있고 유저의 재행동을 유도하는
'찜' 페이지에는 빈 화면이 보여지면 (당연히~~~~) 이후의 액션을 유도하는 버튼들이 있다.
배민에는 '가게 둘러보기' 버튼, 쿠팡이츠에는 '쿠팡이츠 맛집 구경하기' 버튼으로 되어 있다.
당연히 '찜' 은 바로 구매 행동으로 전환되지 않을 수 있으니,
유저의 부담을 줄여주기 위해
둘러보기, 구경하기와 같은 멘트를 사용하여
유저가 바로 구매해야 한다 라는 거부감이 들지 않게끔 돌려서 표현한 것을 알 수 있었다.
참고
'UI UX' 카테고리의 다른 글
| [UI/UX] 퍼널은 줄일수록 좋은걸까? (1) | 2025.12.17 |
|---|---|
| [UI/UX] 검색(2) - 내가 '땡겨요' 기획자라면 검색 기능부터 개선해야지! (0) | 2025.11.17 |