Day16. ABC studio에서 데마에칸 머천트 앱 리뉴얼하기

안녕하세요, 기획자 팥씨입니다.🥮

오늘은 ABC Studio에서 해외 사용자를 대상으로 UX 리서치를 진행한 글을 다룹니다.

 

일본 배달앱을 한국에서 만들고 있는 것, 아시나요?

ABC Studio 팀의 인터뷰의 내용도 글과 함께 확인해보세요.

 

 

1,100km 떨어져 있는 사용자를 위한 UX 리서치부터 과감한 리뉴얼까지의 기록

 

 

ABC Studio

 

- AI, Block Chain, Clova 프로덕트를 만드는 서비스

- 2021년 1월에 라인이 데마에칸 인수

- 전국 배달 가능

- 배달시간 35분 -> 27분 단축

- 자동화율 : 0% -> 90% 이상  

 

https://www.youtube.com/watch?v=lTEn8KgVwNc

 

데마에칸

'데마에칸(出前館)'은 2000년부터 서비스를 시작한 일본의 음식 배달 No.1 서비스로 2년 전에 LINE에서 인수했습니다.

현재 일본의 배달 서비스 시장은 한국보다 작은데요. 그만큼 성장 여력이 많다고도 할 수 있습니다.

 

@LY 기술블로그

 

머천트 앱 UX/UI 리뉴얼 배경

• Merchant App : 가게에서 주문을 받고 배달원에게 음식을 전달하는 과정에서 사용하는 서비스
• 2000년도부터 오랜 기간 서비스 > 기존의 MerchantApp 앱에 익숙해져 있었기에 큰 변경 없이 점진적 개선했었음
• 기존의 UI/UX가 최선의 보장이라는 답 없음. 더 나은 사용자 경험을 목적으로 리뉴얼에 착수

 

리뉴얼의 시작 | 사용자 리서치

• 깊이있게 사용자 경험을 이해하기 위해, 현장에 방문해 생생함을 관찰하고 진솔한 의견을 들음.
• 매출과 직결되는 프로덕트인만큼, 변화에 신중을 기해야 했음.
• 완성도 높은 버전을 먼저 출시 후 -> 그에 따른 피드백 받아 개선하기로.

 

문제점 및 개선 포인트 도출

• 현지 가맹점 대상으로 '데마에칸 서비스 만족도 평가' 설문 > 사장님 의견 수집
• 정보표시 개선, 기능 사용성 개선, 전반적인 UI/UX 개선에 초점을 두어 리뉴얼하기로 결정

 

Action 1. 간편한 주문 흐름 만들기

• (상황) 신규 주문이 들어오면 주문수락 - 상품준비 과정에서 배달원 매칭 상태, 배달원 도착 예정 시간 지속적 확인 필요
• (기존) 각 단계를 신규/준비/배달/완료 네 가지 탭으로 구성 - 주문 상태가 변경될 때마다 해당 탭으로 이동해 주문 리스트 찾아야
• (개선) 탭 구조 제거, 주문의 단계별로 섹션을 구분해 나누는 방식 (앵커링)

@ LY 기술블로그

 

주문 리스트 흐름 단절 -> 리스트 일렬 나열해 스크롤만으로 다양한 단계를 넘나들 수 있도록 함.

추가적인 클릭이나 스크롤 없이 주문처리과정 원활하게 파악

 

Action 2. 정보의 집중도 높이기

• (기존) 한 화면에 많은 정보를 한눈에 볼 수 있도록 제공 -> 바쁜 매장 환경에서 필요한 정보를 신속하게 찾기 어렵다는 단점
• (개선) 사용자가 필요로 할 때 원하는 정보를 볼 수 있도록 구분

@LY 기술블로그

 

릴리스 전 현지 FGT와 FGI를 통한 사용성 검증

• FGT : Focus Group Test
  • 서비스 출시 전 선별된 소수의 인원에게 서비스 미리 체험하게 하고 과정 기록하며 피드백 수집
  • 서비스 초기 기획 단계에서 정의한 주요 타깃층 중심
  • 기존 서비스 사용에 익숙하면서 매출 순위가 높은 브랜드의 가맹점주 7명 
• FGI : Focus Group Interview
  • 소규모 집단 대상으로 심층 인터뷰 실시, 앱 사용경험과 사용성, 만족도 등 질적 데이터 수집
  • FGT 진행하는 동안 행동패턴 주의깊게 관찰, 추가 질문 및 개선 의견 묻는 세션 마련
• 다양한 관점과 인사이트를 종합적으로 수집하고자 함.

 

사용자 리서치 준비 과정

@LY 기술블로그

1) 시나리오별 태스크 설계 및 작성

• 6가지 시나리오와 각 시나리오별 상세 태스크, 세부 설문 준비
• 기존에 사용하던 기능과 정보를 새로운 화면에서도 빠르게 찾아내는지
• 새롭게 추가된 기능 및 개선된 부분을 어떻게 인지 및 활용하는지

예시 @LY 기술블로그

 

2) 프로토타입 준비

• 실제 제품과 거의 동일한 수준의 디테일과 기능을 갖춘 프로토타입 제작

 

3) 사용자 리서치 진행 과정 및 결과

Part1, 2로 나누어 진행 @ LY 기술블로그

사용자 리서치 결과 분석 및 인사이트 도출

@LY 기술블로그

• 추가 개선 요청 의견
  • 스와이프 -> 탭 (오작동 위험 적음) 방식 선호
    • 주방환경에서 태블릿을 사용하거나 장갑을 낀 손으로 앱을 조작하는 등의 특수 상황 고려
  • 작은 기기에서도 효율적으로 볼 수 있는 화면 배치 필요
    • 여러 딜리버리 서비스의 태블릿을 동시에 사용하는 경우가 일반적이기 때문
  • 누락없는 상품 준비를 위해 '상품 정보를 최우선으로 표시해야'

현지 사용자 대상으로 테스트 시 고려할 점

1. 진행자 _ 태스크 원활히 수행할 수 있도록 보조
2. 팀 _ 외국인 사용자를 대상으로 리서치를 진행할 시 발생할 수 있는 변수들 사전에 파악, 대비
   • 파일럿 테스트 과정 중 간단한 의사소통 방안 모색 : 국적과 언어가 다른 사용자 대상 '낱말카드'
3. 동시 통역을 고려한 공간 배치

 

사용자 리서치 후 개선 결과

사용자 리서치 피드백 기반으로, 사용자 요구와 편의성 고려해 주요 화면 개선

 

Solution 1. 주문 목록 개선

(기존) 탭 구조 -> (개선) 섹션 + 앵커링 구조 : 주문단계별 이동의 불편함이 해소되었다는 피드백

• '준비' 탭 클릭 수 25% 감소, 사용자 수 12% 감소

Solution 2. 상세 화면 개편

• 사용자가 필요한 정보에 집중할 수 있도록 개선
• 주문확인과 매장 상태 변경 등 중요 정보의 가시성 크게 향상
• 리뉴얼 후 '상품 전체 보기' 기능 사용률 분석 : 수주 확인 버튼 클릭한 사용자 중 60% 기능 사용

Solution 3. 점포 상태를 명확히 표시해 메인 화면 이탈 감소

• 긴급정지 상태 / 수주 불가 상황을 더 명확히 표시
• 점포 상태 레이어 추가 -> '설정-긴급정지' 메뉴로 이동하는 클릭 수 21% 감소
• 수주 재개 기능을 적극적으로 활용하도록 한 변화가 잘 작동하고 있음을 확인

Solution 4. 주방 작업의 효율성을 높인 수주 확인 화면 개선

• 기존 스와이프 -> 탭 방식으로 
• 사용자가 명확하게 조작할 수 있도록 개선
• '수주확인' 버튼의 클릭 수 전반적 증가, 주문 수락 과정 효율적 진행 확인

 

🥮 해외 사용자를 대상으로 한 사용자 테스트와 개선 방식

해외 사용자 테스트 설계부터, 매끄러운 테스트 진행을 위한 숨겨진 고민들까지 상세하게 나눠주셔서

하나의 서비스가 개선되는 방식을 헤메지 않고 따라갈 수 있었습니다.

 

파일럿 테스트를 통해 예상되는 불편점을 '낱말카드'로 방지하고,

동시통역도 고려하여 공간 배치를 한 점이 인상깊었습니다.

 

데마에칸은 B2C 딜리버리 서비스이지만,

데마에칸 머천트 앱은 가게 사장님의 성공적인 수주/배달을 도우며

문제를 정확히 파악해 개선한다면 매출 향상에 직접적으로 기여할 수 있다는 점이

매우 매력적으로 다가옵니다.

 

동시에 직접적으로 매출과 연관되어있는 만큼,

데스크리서치뿐만 아니라 현장에 직접 방문하여

실제 사용자들은 어떤 상황에서 서비스를 사용하는지 면밀하게 체크해야 함을 다시한번 실감했습니다.

(주방환경에서는 장갑을 끼고 화면을 조작하기도 하다보니 스와이프보다는 탭이 오작동 확률이 적다는 것 등)

 

더 자세한 설명과 이미지는 @LY 기술블로그를 참고해주시기를 바라며,

규모있는 프로젝트를 상세하게 작성 및 공유해주신 ABC Studio에 감사합니다.