안녕하세요. ABC Studio 기획자 권다이, 디자이너 김보람입니다. 저희는 일본의 최대 규모 배달 서비스인 데마에칸(Demaecan, 出前館)에서 사장님들을 위한 MerchantApp을 제작하고 있습니다. 2023년 저희는 현지 사용자들의 사용성을 극대화하는 MerchantApp UI/UX 리뉴얼 작업을 집중적으로 진행했습니다. 이번 글에서는 새로운 앱이 배포되기 전에 실시한 사용자 리서치 경험과 리뉴얼 과정을 공유하고자 합니다.
MerchantApp UX/UI을 리뉴얼한 이유
데마에칸은 2000년부터 시작한 일본의 음식 배달 서비스입니다. 오랜 기간 서비스해 온 만큼 현장의 사용자들이 기존의 MerchantApp 앱에 익숙해져 있었기에 대체로 큰 변경 없이 점진적으로 개선해 왔는데요. 그렇다고 기존의 UI/UX가 반드시 최선의 답이라는 보장은 없었기에 더 나은 사용자 경험을 제공하기 위한 목적으로 리뉴얼에 착수했습니다.
사용자 리서치
MerchantApp 리뉴얼의 시작은 현지 사용자의 경험을 깊이 이해하는 것이었습니다. MerchantApp은 주문을 받고 배달원에게 음식을 전달하는 과정에서 사용하는 간단한 도구처럼 보일 수 있지만, 이면에는 복잡한 고려 사항과 정책이 존재합니다. 예를 들어 세계적인 햄버거나 피자의 프랜차이즈 업체처럼 자체 배달 시스템을 갖춘 대형 체인점과, 배달원을 별도로 호출하는 소규모 매장은 운영 방식이 다를 수밖에 없습니다. 저희는 현지에 방문해 배달과 매장 운영이 복합적으로 진행되는 현장의 현실과 여러 배달 서비스를 병행하는 매장의 일상을 관찰하며, 단순한 데스크 리서치로는 알 수 없는 현장의 생생함을 관찰하고 사장님들의 진솔한 의견을 들을 수 있었습니다.
사장님들에게는 매출과 직결되는 프로덕트인만큼 앱의 디자인과 사용성에 큰 변화를 주려면 그만큼 신중을 기해야 합니다. 그럼에도 불구하고, MerchantApp 사용자의 연령대를 살펴보면 디지털 리터러시가 낮은 연령대가 많으며 기존 앱의 UI/UX가 이에 맞춰 최적화돼 있지 않다고 판단했기 때문에, 사용자의 의견을 먼저 듣기보다는 완성도 높은 버전을 먼저 출시하고 그에 따른 피드백을 받아 개선해 가는 방향을 선택했습니다. 기존보다 더 쉽고 간편한 UI/UX를 제공할 수 있다는 확신을 기반으로 말이죠.
문제점 및 개선 포인트
우선 사용자 리서치를 통해 사용자와 환경을 이해하고, 현지 가맹점을 대상으로 한 ‘데마에칸 서비스 만족도 평가’ 설문을 통해 사장님들의 의견을 수집했습니다. 조사 결과에서 앱과 관련된 평가 영역의 결과는 다음과 같은데요. 데마에칸의 상황을 고려해 이번 UI/UX 리뉴얼을 통해 개선할 수 있는 세 가지 주요 목표(이미지 내 빨간색 표시)를 설정했습니다.
간편한 주문 흐름 만들기
MerchantApp 사용자는 신규 주문이 들어오면 주문을 수락하고 상품을 준비하는 과정에서 배달원 매칭 상태와 배달원 도착 예정 시간 등을 지속적으로 확인해야 하는데요. 기존의 UI/UX는 주문의 각 단계를 ‘신규’, ‘준비’, '배달', ‘완료’의 네 가지 탭으로 구성해 놓았고, 주문 상태가 변경될 때마다 사용자가 해당 탭으로 이동해 주문 리스트를 찾아야만 했습니다. 물론 두 번의 클릭과 한 번의 스크롤이 필요한 정도였지만 이처럼 단절된 주문 리스트의 흐름은 바쁜 오프라인 매장과 주방 환경에서 사용하는 사용자에게 부담을 줄 수 있었습니다.
'그렇다면 주문 목록을 탭 구조가 아닌 섹션+앵커링 구조로 변경하면 사용자가 더 쉽게 확인할 수 있지 않을까?’
위와 같은 고민을 바탕으로 저희는 탭 구조를 제거하고 주문의 단계별로 섹션을 구분해 나누는 방식을 채택했습니다. 또한 주문 상태와 섹션을 연결(앵커링)해 주문 상태가 변경되면 화면에 나타나는 섹션도 같이 변경되도록 했습니다. 이를 통해 사용자는 별도의 클릭이나 스크롤 작업 없이 주문 리스트의 작업 흐름을 확인하고, 매장의 전반적인 주문 현황도 간편하게 파악할 수 있게 되었습니다.
아래 예시 화면을 보겠습니다. 기존에는 왼쪽 이미지처럼 탭으로 인해 주문 리스트의 흐름이 단절되었다면, 오른쪽 개선안은 리스트를 일렬로 나열하여 제공해 스크롤만으로 다양한 단계를 쉽게 넘나들 수 있도록 만들었습니다. 이 변경으로 사용자는 추가적인 클릭이나 스크롤 없이 주문 처리 과정을 원활하게 파악하고, 매장의 주문 상태를 손쉽게 확인할 수 있게 되었습니다.