스타벅스는 2012년 처음 앱을 출시, 2014년 전세계 최초로 한국에서 '사이렌 오더'기능을 도입하였다. 덕분에 스타벅스 앱은 성공적인 옴니채널의 대표적인 사례이기도 하며 이는 온/오프라인 모두 일관적인 경험을 제공하는 큰 역할을 했다.
* 2025년 5월에는 스타벅스 앱의 월간 활성 사용자수(MAU)가 무려 802만 명을 달성하였다.
오프라인 매장과 동일하게 앱에서도 개인화 된 추천을 통해 고객이 선호하는 음료와 푸드를 제안하고, 고객이 직접 커스텀한 메뉴를 저장 및 주문이 가능하며, 픽업 가능 알림 서비스를 제공하면서 고객의 대기 시간을 크게 줄여주었다.
더불어 앱을 통해 메뉴를 주문하면 스타벅스의 멤버십 회원 제도인 리워드(별)적립이 가능한데, 일정 갯수를 모을 때 마다 앱에서 별을 음료 쿠폰으로 즉시 교환할 수 있다. 또한 등급에 따라 무료 사이즈 업, 푸드 할인 쿠폰, 등급에 관계 없는 생일 쿠폰, 한정판 굿즈를 획득할 수 있는 프리퀀시 이벤트 등 공격적인 마케팅과 확실한 보상으로 고객의 참여도를 높이고 있다.
하단 내비게이션 바를 기준으로 각각의 화면이 어떻게 구성되어있는지 분석하여 스타벅스는 고객에게 어떤 UIUX 경험을 제공하는지 알아보고자 한다.
☑️ 하단 내비게이션 바 화면 구성 분석
1. 홈화면
1. 감성적인 일러스트 + UX 라이팅 : 사용자의 접속시간을 고려하여 일러스트와 라이팅이 시간대 별로 바뀌며 사용자의 감성을 자극한다.
2. Chip : 주요 기능인 리워드, 쿠폰, Pay, 구독 서비스를 안내하는 Buddy Pass 까지 총 4개의 칩이 있으며, 클릭이 용이해 접근이 쉽다. 사용자들에게 가장 중요한 기능 중 하나인 리워드의 경우에는 앱을 통해 음료를 구매하기만 하면 어떠한 액션을 취하지 않아도 자동으로 별(리워드)이 적립되고 별의 갯수를 알려준다.
3. 행사 배너(프리퀀시): 프리퀀시는 브랜드의 충성도를 높일 수 있는 게이미피케이션 전략이다. 스타벅스는 연 2회 여름과 겨울마다 e-프리퀀시 행사를 진행하는데 시즌별 미션음료 3잔 포함, 일반 제조 음료까지 총 17잔 이상 구매를 하면 한정판 굿즈를 받을 수 있다. 인기가 많기 때문에 상단에 배너를 배치하여 구매를 유도하는 전략으로 보인다.
4. 퀵 오더 : 최근 주문 메뉴 혹은 나의 메뉴 (즐겨찾기 메뉴)를 통해 빠르게 주문이 가능하다. 시간이 항상 부족한 직장인들의 필수 기능이라 볼 수 있다!
5. 이벤트 배너: 이벤트 배너와 다양한 콘텐츠를 카드형 UI로 디자인했다.
5. 추천 메뉴 : 사용자 주문 내역 및 선호도를 확인하여 추천을 해준다. 개인화 된 추천은 사용자의 만족도를 높여준다.
Painpoint - Insight
1. 너무 많은 콘텐츠를 포함해 길어진 홈화면
일단 대략 15개 이상의 카드형식의 UI배너가 홈화면을 차지한다. 길이가 너무 길어 사용자가 다 확인할 수 없을 뿐더러, 오히려 과다한 정보로 사용자에게 인지부하를 일으킨다. -> 콘텐츠나 이벤트 등을 따로 모아서 볼 수 있는 기능이 필요하다.
2. 퀵 오더 영역의 아쉬운 위치
기종이 아이폰 미니인 나의 경우, 화면 크기가 작아서 프리퀀시 광고 배너와 중간에 삽입된 이벤트 배너 때문에 퀵 오더 영역이 보이지 않는다. 빠른 결제 기능인 만큼 최대한 상단에 배치해서 접근성을 높여야한다. 아래로 굳이 스크롤을 내려야하는 점은 불편했다.
2. Pay
결제와 관련된 화면으로 현재 가지고 있는 카드를 스와이핑해서 확인할 수 있다.
실물 카드와 동일한 UI와 바코드를 크게 보여주며, 매장에서 해당 바코드를 기기에 찍기만 하면 빠르게 결제 할 수 있다.
아래 '내 카드관리'를 누르면 해당 카드의 충전기능을 바텀시트로 제공하고 있다.
자동충전은 사용자가 정한 특정 임계치보다 금액이 떨어지면 일정금액이 자동충전되는 기능이며, 일반 충전은 원할때마다 일정금액을 충전할 수 있다. 그리고 남은 잔액들은 하나의 카드로 모아주는 잔액이전 기능이 있다.
애플 월렛에도 스타벅스 카드를 추가할 수 있는데, 앱에 따로 접속하지 않아도 간편하게 결제 및 리워드 적립까지 가능하다.
마지막 하단에서는 스타벅스 쿠폰과 모바일 상품권을 쉽게 등록할 수 있다.
3. Order
하단 내비바에서 오더를 탭했을 때 매장 선택이 안되어 있는 경우, 매장을 선택할 수 있는 바텀시트를 제공한다.
1. 매장 지도 검색: 지도로 주변 매장 검색이 가능하다.
2. 매장 텍스트 검색: 매장명을 텍스트로 검색이 가능하다.
3. 매장 속성 카테고리: 드라이브 스루가 있는 매장, 리저브 매장, 브루잉 커피를 마실 수 있는 매장 등 각 매장의 속성이 다르기 때문에 카테고리 분류된 칩을 누르면 해당 속성을 가진 매장을 현재 내 위치 기반 거리 가까운 순으로 정렬한다.
4. 카테고리 아이콘: 각 속성을 아이콘으로 보여주어 각 매장의 속성을 쉽게 구분할 수 있다.
매장 설정을 마치면 두번째 화면을 볼 수 있다.
5. 탭 메뉴: 전체메뉴와 즐겨찾기를 할 수 있는 나만의 메뉴 탭이 있으며 전체메뉴의 하위 속성으로는 크게 음료, 푸드, 상품으로 나뉜다.
6. 위치, 이용방법: ∨ 버튼을 누르면 첫번째 사진의 매장 설정 바텀시트를 볼 수 있으며, 음료를 담을 때마다 장바구니 아이콘의 숫자가 카운팅 된다.
7. 나만의 메뉴 홈화면 표시여부: 나만의 메뉴를 설정 후에 홈화면에 표시할 수 있다. 홈화면에서 바로 주문이 가능해 구매 프로세스가 크게 단축된다.
Painpoint - Insight
1. 불편한 지도 매장 탐색
지도 아이콘을 눌렀을 때 초기화면은 내 위치만 보인다. 내 위치와 주변 가까운 매장을 같이 볼 수 있으면 편리 할 것 같다.
4. Shop
Shop 화면은 상단부터 배너, 카테고리, Best items, New products 로 영역을 나누었고, 주로 상품 썸네일 모듈로 구성 되어있다. 그리고 1번과 2번 처럼 이동 아이콘을 누르면 온라인스토어로 이동한다.
온라인 스토어는 메인, 기획전, 베스트, 마이페이지의 4개의 탭으로 나뉘어있다. 메인, 기획전, 베스트는 상품 판매가 중점이라 다양한 상품과 상품 구매를 유도하는 랜딩페이지를 볼 수 있고, 마이페이지는 주문 배송 및 현황, 전반적인 쇼핑 정보에 대해 알 수 있다.
5. Other
Other은 사용자 계정 관리를 위한 탭으로 보통 앱들의 마이페이지 정도로 볼 수 있다.
개인적으로 Other 화면이 좋은 UIUX 를 가졌다고 생각했는데, 그 이유는 스타벅스의 모든 주요 기능을 여기서 확인할 수 있었기 때문이다. 어디있는지 모르겠으면 이 화면에서 가장 먼저 탐색하면 큰 도움이 될 것 같다.
특히 하단 내비바의 대표 기능들이 깔끔하게 정리 되어 있는데 페이, 오더, 샵 탭의 모든 주요 기능을 한 페이지에 모아 놓아 쉽게 접근할 수 있다.
6. 예상 대기 시간 안내
6번은 추가적으로 설명하고 싶은 부분이다!
스타벅스는 작년 12월 사이렌오더 기능을 고도화했다. 특정 시간대 주문이 몰려 음료 픽업까지 상당한 시간이 예상되는 경우에는 사이렌오더 결제 전 예상 대기시간을 사전에 알려주는 사전 알림을 강화했으며, 주문 취소 기능을 도입했다. 결제 전 대기 예상 시간을 15분, 20분으로 세분화해 고객에게 팝업 알림을 제공한다.
Painpoint - Insight
1. 매장 승인 후에는 취소할 수 없다.
결제 직전까지 가서야 긴 예상 대기 시간을 볼 수 있고, 오더 후 매장이 빠르게 승인해버리면 취소가 어렵다. 현실적으로 매장 승인 이후 취소는 불가능하다고 생각한다. 음료를 만들고 있는 도중에 고객이 취소하면 음료를 버려야하기 때문이다. 언제든지 취소가 가능하다는 것은 스타벅스의 비용적인 측면에서도 부정적이고, 바리스타의 헛 된 수고는 음료를 더 늦게 픽업하게 되는 길이다.
실시간 매장의 혼잡도를 선 제공하면 사용자가 효율적으로 매장을 선택할 수 있고 취소를 해야하는 상황이 덜 생길 것이다.
☑️ 사용자 분석
스타벅스의 주 고객층은 2030 여성이다.
고로 스타벅스 앱의 사용자도 비슷할 것으로 보고, 아래의 내용을 캡쳐해왔다.
전체 사용자 중에서도 직장인의 비율이 제일 높은데, 아무래도 시간이 항상 부족한 직장인에게 '사이렌 오더' 기능이 큰 몫을 하는 것으로 보인다. 그리고 신생아/유아 부모와 초등학생 부모가 높은 비중을 차지하며 전업주부, 워킹맘의 비중 또한 높은 축에 속하는 것을 보아 여성 사용자가 많다는 것을 알 수 있다. 서치해보니 사용자 성비는 남성 25%, 여성 75%로 여성 사용자 비중이 절대적으로 높았으며 1인당 앱의 평균 사용시간은 15.7분으로 나타났다.
* 출처(사용자 성비, 평균사용시간) : Brand Brief - 브랜드브리프(http://www.brandbrief.co.kr)
☑️ 개선점
페인포인트와 인사이트를 기반으로 개선점을 간단하게 수정해보았다.
1. 퀵 오더
비교적 아래에 있던 퀵 오더기능을 홈화면 상단에 배치하여 접근성을 높였다.
2. 지도
매장 지도 기반 검색 시 매장 목록과 지도 위치가 별개의 화면이라 불편했다.
네이버지도처럼 한 화면에 매장목록과 위치를 함께 제공하되, 목록에서 원하는 매장을 클릭하면 해당 매장의 위치로 지도가 이동, 바텀시트는 해당 매장의 정보를 볼 수 있게끔 수정해보았다.
3. 실시간 매장 혼잡도 안내
작년부터 사이렌 오더 결제 전 예상 대기 시간을 안내해주는 기능이 생겼지만, 것보다 앞서서 매장의 특성을 설명해주는 화면에서 매장의 혼잡도를 혼잡, 보통,여유 라는 작은 칩으로 안내해준다면 훨씬 좋은 사용자경험이 될 것이다.
3주차 레퍼런스 과제 끝..!
중간에 폰이 고장나서.. 급하게 아이패드에서 화면캡쳐를 한 탓에 크기가 뒤죽박죽이라 아쉽다 😦
'디자이너 회고록' 카테고리의 다른 글
| [문제해결스터디] 01 (4) | 2025.08.03 |
|---|---|
| [레퍼런스 분석] - 마이리얼트립 (1) | 2025.07.24 |
| [레퍼런스 분석] - 쿠팡이츠 (0) | 2025.06.26 |
| [레퍼런스 분석] - 컬리 (0) | 2025.06.14 |
| [레퍼런스 분석] - 29CM (4) | 2025.06.06 |