✍️ 스타벅스 앱에 담긴 Laws Of UX
#스타벅스 #LawsofUX #존야블론스키 #UX/UI #열가지심리학법칙
� 한 줄 요약
- 스타벅스가 사용자를 위해 제공하는 법칙, 7가지
✔️ UX를 적용함에 있어, 심리학 법칙이 이렇게 많은 줄 몰랐어요. 아티클은 존 야블론스키가 말한 Laws Of UX 10가지를 정리해, 이를 차근차근 스타벅스 앱에 적용하고 있는데요. 짧게 7가지 법칙을 예로 들어 설명하는데, 그 안에는 더 많은 내용들이 숨어 있다고 해요.
✔️ 이 아티클을 보며 깨달은 점은 단 한 가지입니다.
"아 여전히 나는 많이 부족하구나.
✔️ 요새 많은 아티클들을 살펴보며 배움이 부족하다는 생각을 연신하고 있습니다. (왜 갑자기 연신이란 단어가 어색하게 느껴지지) 다양한 콘텐츠를 접하며, 단순하게 콘텐츠를 제작하여 발매하는 나를 되돌아보며 반성의 나날을 보내고 있습니다. 좀 다양화할 필요가 있는데, 현생이 바쁘다 보니, 잡생은 더욱 단순화하는 측면이 강하네요.
✔️ 그래도 열심히 배우고 노력해서, 콘텐츠의 다각화를 위해 노력하도록 하겠습니다. 본 아티클을 통해 저와 같은 위치에 놓인 많은 분들이 UX에 적용된 심리학 법칙에 대해 배웠으면 하는 마음에 요약을 해봤습니다. 함께 살펴보도록 하시죠!
� Laws Of UX 10가지
1. 제이콥의 법칙: 사용자는 익숙한 제품이나 서비스를 통해 구축한 기대치를 타제품에 동일하게 투영한다.
2. 피츠의 법칙: 대상에 도달하는 시간은 거리는 가까울수록, 크기는 클수록 빨라진다.
3. 식의 법칙: 사용자 선택지 개수를 최소화하여 의사결정의 시간이 영향받지 않도록 한다.
4. 밀러의 법칙: 마법의 숫자 7로 페이지를 나누어 제공하여 기억을 쉽게 만든다.
5. 피크엔드의 법칙: 사용자 여정에서 가장 강렬한 순간에 신경 쓰고, 특히 부정적인 경험을 주의해야 한다.
6. 포스텔의 법칙: 사용자의 실수에는 관대하게, 서비스 스스로에게는 엄격하게 대응한다.
7. 심미적 사용성 효과: 아름다운 디자인은 인간의 뇌에 긍정적인 반응을 일으키고, 때론 사용성을 뛰어넘는다.
8. 폰 레스토프 효과: 중요한 정보나 핵심적인 동작은 강조되어 눈에 띄어야 한다.
9. 테슬러의 법칙: 모든 시스템에는 더 이상 줄일 수 없는 일정 수준의 복잡성이 존재한다.
10. 도허티 임계: 사용자의 시선과 주의가 분산되는 것을 막고 생산성을 향상하기 위해 시스템의 피드백은 0.4초 이내로 제공되어야 한다.
☕ 스타벅스 앱에 적용된 Laws of UX
1. 피크엔드 법칙(Peak-End Rule)
✔️ 인간의 경험과 기억은 '강렬함'에 꽂히기 마련이에요. 처음부터 끝까지 경험한 모든 것에 집중할 가능성이 낮죠. 또한, 이 강렬함은 '긍정적인 경험' 보단 '부정적인 경험'에서 오는 경우가 많다고 해요. UX를 디자인 함에 있어 이를 낮춰야 한다는 것은 누구나 다 아는 사실이죠. (물론 저는 지금 알았어요..)
✔️ 갑자기 번뜩 떠오른 생각인데, '사용성을 개선한다 = 부정적인 경험을 제거한다.'로 봐도 무방하지 않을까요? 여튼, 다시 돌아가서 스타벅스 앱에서 '피크엔드 법칙'이 적용되는 부분이 바로 '프리퀀시'와 '별 적립'이라고 해요. 누군가는 프리퀀시를 채우기 위해 680잔의 음료를 주문하고, 한 잔만 가지고 간 과거도 있죠.
✔️ 그 사람은 과연 긍정적인 피크엔드에 꽂혀서 이런 행위를 했을까요? 많은 사람들의 추측으로는 '굿즈'를 받기 위한 행동이라 보고 있지만, '프리퀀시'와 '별 적립'이라는 긍정적인 피크엔드도 여기에 한몫했을 거라 여겨져요. 그 사람은 680잔의 값을 지불했지만, 프리퀀시와 별 적립으로 이를 해소했으니까요.
2. 제이콥의 법칙 (Jacob's Law)
✔️ 인간은 '적응의 동물'이에요. 모든 것에 쉽게 익숙해져 금세 동일한 서비스를 쉽게 이용하죠. 스타벅스 앱도 이를 이용했어요. 우리에게 지도 앱은 참 많아요. 네이버 지도, 카카오 지도, 구글 지도 등 많이 있죠. 그들은 다른 프로세스를 전달할지 몰라도, UI의 형태는 비슷해요. 맨 위에 지도를 놓고, 아래에서 해당 지역을 선택하는 방식이죠.
✔️ 스타벅스 앱도 이와 동일하게 적용했어요. 스타벅스는 사이렌 오더 시 매장을 선택해야 해요. 우리가 그 장소에서 픽업해야 하기 때문이죠. 그래서 지도와 같은 방식의 장소 선택법을 채택하여 제공하고 있죠. 어, 혹시 다른 서비스는 어떨까 급 궁금해지네요. 다이닝코드도 동일한 방식을 제공하고, 카닥, 마이클 등 모두 장소를 택함에 있어 같은 방식을 제공하네요.
✔️ 요새 제가 자주 사용하는 데이트립은 좀 다른 방식으로 제공하네요. 왜일까요? 데이트립은 '장소'도 중요하지만, 그 장소가 제공하는 '분위기'가 중요하기 때문이에요. 그래서 사진을 좀 더 크게 배치하여, 썸네일 목록 방식으로 제공하고 있어요. (TMI인데, 데이트립 폰트가 바뀌었군요.�)
3. 피츠의 법칙 (Fitt's Law)
✔️ 스마트폰을 사용하는 유저 중, 엄지손가락을 사용하지 않는 유저는 얼마나 될까요? 이것을 데이터화한 자료가 있을까요? 대충 찾아보니 드퀘르뱅 증후군, 손목터널 증후군이 검색되는 걸 보면 '없다'라고 생각해도 되지 않을까 해요.
✔️ 스타벅스 앱은 사람들의 이 습관을 활용하여 피츠의 법칙을 극대화하고 있어요. 우선, 피츠의 법칙은 '대상에 도달하는 시간은 거리가 가까울수록, 크기가 클수록 빨라진다'는 심리학 법칙인데요. 스타벅스 앱은 음료 메뉴들의 크기와 위치를 '엄지손가락'이 가장 쉽게 닿는 부분에 배치함으로써, 구매 전환을 최대한 올리고 있어요.
✔️ 해당 위치에 메뉴와 버튼을 놓음으로써, '추천 메뉴'에 도달하는 거리를 줄이고, 시간을 줄이고 있어요. 또한, 주문 메뉴에서 쉽게 선택할 수 있도록 유도함으로써, '심리적 거리감'을 최대한 축소하고 있어요. 이러한 방식은 스타벅스 앱뿐만 아니라, 타 앱에서도 해당되는 내용이겠죠?
4. 본 레스토프 효과 (Von Restorff Effect)
✔️ 여러분들 CTA 버튼 많이 접하죠? 보통 CTA 버튼은 브랜드와 관련 있는 색상으로 배치해요. 배경과 대비되도록 만들어서 말이죠. 이는 눈에 띄게 만들기 위한 수단이죠. 여기에는 본 레스토프 효과가 들어가 있는데요. 비슷한 사물이 여러 개 있으면 그중에서 가장 차이나는 한 가지만 기억하게 하여, 강조하도록 만드는 것이죠.
✔️ 이 외에도 아이콘의 색상과 크기를 조절하여 눈에 띄게 만들기도 하여 본 레스토프 효과를 따라요. 스타벅스 앱도 그런 방식을 취하고 있어요. 로그인과 회원가입 버튼에 이 효과를 적용하고 있으며, 자신들이 강조하고 싶은 기능에 주의집중 효과를 추가함으로써 행동을 유도하죠.
5. 도허티 임계 (Doherty Threshold)
✔️ 우리가 무언가를 눌렀을 때 아무 반응이 없다면 여러분들은 어떠세요? 저는 '이게 고장이 났나?' 또는 '내가 누른 게 맞아?'라는 생각을 하며 다시 한번 클릭하게 되죠. 저와 같은 생각을 하지 않으신가요? 이때, 도허티 임계를 적용하여 그 심리를 없앨 수 있어요.
✔️ 도허티 임계는 컴퓨터와 사용자가 서로를 기다리지 않아도 되는 속도(0.4초 이하)로 인터랙션 하여 생산성을 급격히 높이는 법칙이에요. 앱을 접속했을 때, 대기 시간을 숫자로 표현하거나, 스플래쉬 이미지를 넣어 '진행되고 있음'을 나타내 주는 것도 이에 해당하는데요.
✔️ 스타벅스 앱은 인터랙션에 따른 대기 시간을 최소하 하기 위해 서비스 구조를 먼저 순서대로 제공하여 사용자의 체감 시간을 줄여줘요. 이 방법은 접속 시 대기시간 동안 보여주고, 음료 주문 과정에서는 대기 시간을 시각적인 피드백으로 제공하여, 사용자에게 대기 과정을 인지시키고 체감시간을 짧게 만들죠.
6. 힉의 법칙 (Hick's Law)
✔️ 우리는 정보가 많고, 메뉴가 많으면 선택하는데 시간이 오래 걸려요. 그러다 복잡해지기 시작하면 사람은 '안 해!'를 외치며 이탈할 수도 있어요. 힉의 법칙은 이를 방지하기 위한 내용을 담고 있어요. '의사결정에 걸리는 시간은 선택지의 개수와 복잡성에 비례해 늘어날' 수 있다는 거예요.
✔️ 즉, 이를 활용하여 '유저의 선택 항목 개수를 최소화하여 빠르게 반응해 의사결정을 내릴 수 있게 도와줘야 한다.'라고 할 수 있죠. 스타벅스 앱은 이를 적절히 활용하여, 페이지의 스크롤 가능 영역 내에서 최대 6개 까지만의 메뉴 종류를 제시하고, 메뉴 분류를 선택 시 음료의 종류는 5개까지만 보여줘요.
7. 밀러의 법칙 (Miller's Law)
✔️ 밀러의 법칙은 보통 사람은 작업 기업에 7±2개의 항목 밖에 저장하지 못한다는 것이에요. 갑자기 떠오른 건데, 우리가 OTP 등 비밀번호를 7자리 밑으로 지정하는 이유도 이와 같지 않을까요? 한 번에 외워서 적어낼 수 있도록 말이죠. 여튼 다시 스타벅스 앱으로 돌아가도록 하죠.
✔️ 스타벅스 앱은 메인 페이지에서 사용자가 인식하는 구역을 네 부분으로 나눠요.
1️⃣ 상단의 적립과 쿠폰 관련
2️⃣ 이벤트 홍보
3️⃣ 추천 메뉴
4️⃣ 하단 네비게이션 바
✔️ 이렇게 네 군데로 말이죠. 하단 네비게이션 중, 많은 정보를 담고 있는 기타 페이지에는 다시 8개의 소분류로 나누어 정보를 제공하고 있는데, 밀러의 법칙에 따라 최대 개수를 지정한 것으로 보여요. 이 덕분에 사용자는 쉽게 덩어리를 인식하고 이해할 수 있어요. 또한, 단위 영역의 구분이 잘 나뉨에 따라 가독성도 올라가게 되죠.
✔️ 조금 더 생각해보니 밀러의 법칙이 적용된 내용들은 더 많이 있겠죠? 전화번호, 계좌번호 등등 말이에요. 그리고 갑자기 궁금한 점은 와이파이 초기 비밀번호는 이 밀러의 법칙이 적용되지 않아 외우기가 가장 어려운 거겠죠? 집에 있는 와이파이 비밀번호는 몇 번을 봐도 까먹게 되더라는..�
